Squarespace Style Editor: A complete guide

A complete guide to using the Squarespace Style Editor.png
 

The Squarespace Style Editor is something every new Squarespace user should get familiar with, as it enables you to change so much of the look and style of your site.

When you're first building your website, you'll spend lots of time in the Style Editor, so it's important to understand just how to use it right from the get-go.

 

Before we get even one step further, I want to explain exactly what your Style Editor controls, versus your template, or Squarespace blocks.

Think of your template as the structure/frame of your house, and the Style Editor as the interior decorating.

The Style Editor can change the look of your fonts, buttons, navigation, footer, enable or disable parallax scrolling, the look of your announcement bar and more.

The template you choose controls the layout. Some templates have a sidebar, banner images, index pages, the availability of parallax scrolling and special blog features such as author profiles and auto-populated related posts.

If you template has a certain feature, say, banner images, you would enable that feature and change the styles of it (height of the banner, if there's a down arrow on the banner, change the color of the overlay color over the background photo, etc.) in the Style Editor.

Not sure what template has what features? Here's 2 perfect resources to answer that exact question for you.

Squarespace Template Comparison Chart

Which Squarespace templates have ... a sidebar, index, parallax, second navigation + more!

 

Okay, back to the Style Editor. Now you know a little bit about what the Style Editor can and cannot do, let's show you exactly how to use the thing!

Want to hop to the part you're especially interested in quickly?

Here's the jump-to points!

0:05 How to find the Style Editor
0:22 Multiple ways to find Style Editor options
1:18 What to do if you can't find the Style Editor option you're looking for
3:03 Changing text/heading styles
3:20 Quick find fonts used on your site
5:34 How to change your navigation/heading Style Editor options
6:32 The template I'm using and suggest
6:52 How to change your logo size
7:11 How to change Style Editor colors with HTML color codes
8:47 How to change Style Editor button options
9:57 How to change your blogs style
12:36 How to turn on and off parallax scrolling
13:31 How to edit the mobile styles on your site

 

Just getting started with your site? Be sure to grab a copy of the Start Your Squarespace Website Workbook which gives you a clear path on just how to get started building that fab new site!