Adding a Background Color to Your Acuity Scheduling Block

Make your online scheduler stand out with some custom code! Your Acuity scheduling block can be your go-to spot for potential new clients or general business inquiries to get in touch with you - give it some CSS love with this snippet of code.


In this video I cover:

  • How to access your Acuity scheduling block information and update the code

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

Show Notes

0:25 Adding Acuity scheduling block

0:45 Inspecting the scheduling block to find background code

2:03 Copying the block code

2:30 Adding custom CSS

3:10 Changing the background color

#blockid{
  background-color: #000000
}
#blockid{
  background-color: #000000
}

The following information was created for use with templates made with Squarespace 7.0.
Stay tuned for more tips and tricks for the new 7.1 platform!


NEW!
a templated guide to messaging magic

THE WEBSITE COPY TEMPLATE FOR COACHES

A plug-and-play website copy template for your four core pages (Home, About, Offerings, Contact). Save yourself hours of stress and get templates, examples, and expert guidance that will benefit your business and your bottom line.

learn more >

WANT to CREATE
a custom WEBSITE?

GET THE DETAILS >

Previous
Previous

Adding a Vertical Line with Code

Next
Next

Creating and Styling an Announcement Bar