If you’re a more techy user you can use snippets of CSS (Cascading Style Sheets markup language) to customize your template design even more. I highly recommend avoiding this if you don’t have experience with CSS, because it can break the site design. But if you feel comfortable with it, here’s how you’ll go about adding custom CSS in a Squarespace template. 

Where to add it

Under the Design option on the Home menu there’s a Custom CSS page. Opening this will give you a box where you can add snippets of CSS and see the changes in real time in the site preview. There’s also an option to open the CSS editor in a pop out window. 

On this same page, right below the CSS editor, you’ll see a button to Manage Custom Files. Clicking this will let you upload font and image files that can be referenced in your code snippets. 

For example, my website uses a font named Artful Beauty which isn’t available with my Adobe Typekit subscription, meaning it has to be added to my website manually or it won’t show up correctly in other people’s browsers. I’ve uploaded the font files here and used a code snippet to add the font to the website, so now my headers show up correctly no matter what. 

Where to find CSS snippets

I want to reiterate that if you don’t have at least a basic knowledge of CSS and feel comfortable here, don’t play with this Module! 

But if you do decide to add some custom CSS snippets, how do you know what to use? Generally you’ll be looking for something specific, like my font snippet from earlier. To find that you could go to Google and search for “Squarespace CSS adding font” or “Squarespace CSS removing images from blog page”. There are tons of resources out there, mostly in the form of forums and blog posts, to grab code snippets from. 

Most of what you’ll need to do on Squarespace won’t require a bit of code though, so we won’t go any more in depth on that here. You now know where to add it if you need to, go forth and prosper… carefully!