How To: Fix Squarespace Quote Formatting in Text Blocks

Nov 23

We’ve recently been running into an issue with Squarespace whereby text within a text block that’s formatted as a ‘quote’ only displays correctly within the editor. Once you save and exit the editor, the formatting seems to get lost.

In the last few weeks we’ve had to write custom CSS on several client sites to fix this so we thought we’d put together a tutorial to show you how to fix it.

Enjoy!

Key Features:

CSS-based workaround for quote formatting/indenting not working
Change HEX code and use any colour code of your choosing
Adjust spacing as per your requirements

Video Walkthrough:

Code:

blockquote {
  border-left: 10px solid #efefef; /* replace with hex code */
  padding-left: 10px;
  margin-left: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
}