How to add and customize a Squarespace announcement bar - video tutorial

How to add and customize a Squarespace announcement bar

If you're looking to get important information in front of your website's audience, an announcement bar is a guaranteed way to do this.

Adding an announcement bar to your website is a guaranteed way to highlight a particular message, promote a call-to-action (CTA), or highlight an event, sale, promo or offering. Since they are displayed on every page of the website right up at the top, visitors to your website cannot miss them! 

Another great feature about Squarespace's announcement bars is that they are customizable. Once you add one to your website, you can make sure that it fits seamlessly with your branding through colours, fonts and website links. Heck yeah for good design!

If you've ever wanted to add an announcement bar to your website but weren't sure how to do it, watch this video tutorial to see how simple it is and how YOU can get one up and running today!

Note: want to watch more of my Squarespace video tutorials? I've linked to them at the bottom of this post or you can head over to my Youtube channel to binge them now. #aintnoshame

How to add and customize an announcement bar on a Squarespace website

In this video you will learn:
-What an announcement bar is and see 2 examples on live websites (Pattern of Purpose and Baiser Beauty)
-How to add an announcement bar to your Squarespace website
-How to customize the announcement bar (background and text colour, font, links, etc.)

Video tutorial shows a demo website using Squarespace's Aviator template.

Adding an announcement bar to your Squarespace website takes literally a minute to set up and it is very simple to customize to fit your website's branding. Want to get one up and running on your own website? This video tutorial will show you how!

Reminder that announcement bars appear on every page of the website (except Cover Pages), which means that they cannot be enabled on a particular page (e.g., Home page only) or customized beyond the built in functionality. Most of the time they will display above the navigation but depending on the template, they might also display below the navigation.

Related: How to add and remove pages from the navigation in Squarespace

If the announcement bar no longer applies (e.g., your sale has ended or your notification is no longer relevant), simply update the text or disable the announcement bar feature.

Easy as pie!

Final Thoughts

Squarespace's built-in announcement bar feature is one of my favourite ways to customize a website and make sure that visitors are presented with important information. Whether you're promoting a call-to-action (CTA), displaying a custom message, or highlighting an event, promo code, sale, or offering, the announcement bar is a wonderful way to get that information in front of your audience. Once you have the announcement bar enabled on your Squarespace website, you can go in and customize the colours, text and links as you see fit. 

The announcement bar is most commonly displayed above the Navigation bar so it's very visible on a website and can be eye-catching if designed correctly. Try one out on your website today and see how well it supports your website's goals!

Now it's your turn to tell me, do you have an announcement bar set up on your website? If so, how do you use it? Is it customized to match your brand's colours and texts? I'd love to know so leave me a note in the comments!


Interested in learning more about what it takes to get a website up and running? Sign up for my free 7 day e-course

Charlotte O'Hara