Adding Background Color Behind Text with Code in Squarespace

Tips & TricksSquarespaceSqSp Supply RoomWeb Design
Written By kaliedwards
<div style=“background-color: #000000; padding-top: 5%; padding-bottom: 5%; text-align: center’>
  <h3 style=“color: white;”>Word</h3>
</div>

Add some color to your website page on Squarespace! By incorporating a background color behind your text, you can draw attention to call to actions, new offerings and more on your website. Only a few simple steps and easy to follow custom code needed!

In this video I cover:

  • Ideas to where to add a background color to your website design

  • The specific code used to achieve this look (see below)

Show Notes

0:28 Insert code block

1:25 How to change the text color

1:52 How to change the background color

2:20 How to change the padding and alignment

3:25 Adjusting the left and right padding with spacers

WANT to CREATE
a custom WEBSITE?

GET THE DETAILS >

 
Featured
Keeping Up Your SEO
Adding a Background Image to a Form
Adding an Anchor Link in Squarespace 7.1
No Code Custom Button Options
kaliedwards
Previous

Create an Engaging About Page : Part 1
Next

How To Add A Link That Scrolls Down To The Footer In Squarespace