Squarespace DIY: Using Spacers to Format Your Site

After designing over 30 Squarespace websites, I can say hands down the most impactful Sqauarespace hack is learning how to use spacers. Spacers within Squarespace allow you to move blocks around to achieve the desired layout you are looking for.

 

So how do you use this magic hack to create an eye-catching layout? Simple, just watch our screen recording below or click the link here.
Now that you’ve watched, you have an idea of how to use spacers to orient your own Squarespace website. On top of simply learning how to use them, we also want to share some call outs:

 

It helps to stay consistent with spacers. For example, if you are using them to center the text for your page headers, try and use the same size spacers for each page. This gives the user a consistent feel and allows them to know where to look when accessing each new page.
Always take a look at how spacers are impacting your mobile layout to make sure that they are giving you the look you want on both mobile and desktop.

 

Reiterating – use the grey line that populates to make sure you are only placing the spacer on the content block you want to impact.

 

And also some great use cases for spacers:
  • To center text on a page.
  • To minimize the size of an image.
  • To organize content and push it to one side of the page.

 

We hope this quick tutorial helps you in your Squarespace DIY! Let us know in the comments if you have any questions about using spacers and if this article was helpful for you!

Want more tips to help you succeed?

Leave a Reply

Your email address will not be published. Required fields are marked *

©2024 Olivewing Designs LLC, All rights reserved


The olivewing butterfly is the only animal in nature that produces blue pigment.

Everything else is simply a reflection of light.

Fun Fact

Thank you!