ADDING BORDERS AND BOXED TEXT IN SQUARESPACE

Another day, another Squarespace hack! This hack helps you add a cool border to your text to create a boxed text. This is great for when you want to call attention to certain text. Perfect for sales pages or even for testimonials or quotes! Read on for the full tutorial.

 

HERE ARE THE STEPS:

  • In the main Squarespace menu, click DESIGN. Then CUSTOM CSS.
  • Copy and paste the following code:

 .fancyborder { border:4px solid #F2CBCB; padding: 10px; }

The pink highlighted text is where you can change your colors and width of the border. Do not edit the other text. (You can also add this code to an individual page if you only want to see the effects on one page of your Squarespace site).

  • Then on the page you're adding the boxed text to, insert a MARKDOWN block.
  • Add this code:
 

<div class="fancyBorder">

All of your awesome text can go here! You can write as much or as little as you want! It's totally up to you, but no matter what you write, it will look super cool with your custom border! Boom.

</div>

  • Replace the pink text with your own. Click SAVE.
 

And that's it!! Easy peasy. 

PS - If you want to get really fancy with your borders, check out the #squarespacehack shop to add dotted borders, inset borders, rounded borders and more!!