Normally if you want to change how long a Squarespace line block appears on your page, you’d have to add a spacer block next to it and drag it over. I recently found myself working on a client website where I wanted all the lines to be the same width (or length depending on how you see things, haha). I wanted all the lines on the website to take up about 75% of the typical allotted space. So I used the simple code hack below to make this adjustment! Additionally, it’s kind of annoying that in the older versions of Squarespace, you can only have a black line… or a white line. The end. But sometimes, I want the lines to be an element of the color scheme, with a minimal pop of color. Other times, I want all the lines in the design to be subtle and fade into the background. This code will solve that for you too!

If you’re looking for a way to make your header a full-screen video, look no further!

If you’re looking for a way to make your header a rotating set of images, you’re in the right place!

A common way of showcasing photos is by using Squarespace’s carousel gallery block (or the new slideshow reel in 7.1). But this forces your photos right up next to each other, which can sometimes look crowded or confusing. So to let the photos breathe and pop more, I came up with a CSS solution that can be tweaked to your liking. Here are some before and after shots!

Depending on which template you start with in Squarespace; your logo, navigation menu, and other elements may have a solid background color; or they may sit right on top of a photo. If you want to switch up these style settings, here’s where you can find them!