How to Setup and Style the Squarespace Announcement Bar
Your announcement bar sits at the top of your Squarespace* website. It’s a small element but it can be used strategically to share important messages and offers. In this guide, we’ll share how to turn on your announcement bar, style it, and the best ways of using it to increase conversions.
Affiliate disclosure: Some of the links in this article are affiliate links, marked with an asterisk (*). Studio Founded may receive a commission from qualifying purchases made through these links, at no additional cost to you. You can read our full affiliate disclosure here.
How to Add an Announcement Bar to Your Squarespace 7.1 Website
Open Settings
Start by going to your Squarespace dashboard and using the left-hand panel to navigate to Pages > Marketing Tools > Announcement Bar, or use the search tool to search for “Announcement Bar”.
Turn on the Announcement Bar
Toggle on the Announcement Bar option.
Add Your Message
Write your announcement bar message. We’ll share more on exactly what you should write below.
You can also add a clickthrough URL to make the whole announcement bar clickable if you’d like to link to a specific page or content.
Save Your Changes
Press the Save button, and your announcement bar will be live.
How to Style the Squarespace Announcement Bar
Font
Go to Design > Fonts and choose a font that fits your brand.
Colors
Under Design > Colors you can choose a color from your brand palette or an accent color if you’d like the announcement bar to stand out.
Border
You can add a border to the bottom of your announcement bar with custom CSS. Open the CSS Panel, paste the following code, and replace the hex value with your chosen color:
/* Announcement Bar Border */
.sqs-announcement-bar {
border-bottom: 1px solid #000000;
}
How to Write Your Announcement Bar Message
Consider Your Goal
Start by thinking about what you want your announcement bar to achieve. Do you have a signature offer you’d like to promote, do you have 1:1 spaces available that you’d like to let people know about, or are you simply sharing an update? Your goals should guide the content that goes into the announcement bar.
Keep It Concise
Announcement bars are small and can’t look heavy or crammed if you add too much content. Keep the message short and easy to read at a glance, so it’s clear and not too distracting from your main content.
Create Urgency
Don’t overuse urgency, as false urgency can push people away, but some urgency can be helpful for offers that are genuinely limited or time-sensitive, encouraging visitors to take action.
Highlight Value
Focus on the value that you’re offering and what your visitor can gain from clicking on your announcement bar and exploring your offer, i.e. a limitied-time only free strategy call to help them book more clients.
Add a Call-to-Action
Tell your visitors what the next step is, like “Shop Now,’ or “Learn More,” and include a link that takes them to further information. Some examples are:
Shop our Latest Collection of Handmade Artisanal Jewellery (Link to the latest collection in your Shop).
Book a 1:1 Strategy Session - 5 Spaces available for September (Link to your booking form or scheduler).
Free: Download Our Brand Strategy Guide (Link to your newsletter sign up form).
You May Also Like:
How to Change Your Squarespace Favicon (Step-by-Step)
How to Build a Link in Bio Page for Squarespace
How to Password Protect a Squarespace Website
