How to keep the announcement bar at the top of the page in Squarespace

This tutorial was recorded in Squarespace 7.1 but also applies to legacy sites built on version 7. For more information, visit insidethesquare.co/themes

In this Squarespace tutorial, you’ll learn how to keep your announcement bar at the very top of the screen in your Squarespace site, so it’s always visible, even when people scroll down the page.

All the codes from this tutorial are below, BUT it’s important to know that at the time of posting this video, the announcement bar is a feature only available for business & commerce plans. Personal plans will need to upgrade.

Check out this announcement bar setup tutorial if you haven’t used this feature yet.

---

Here is the code from this tutorial:

This one fixed the announcement bar at the top of the page:

.sqs-announcement-bar {position:fixed; width: 100%;}

To hide the close option, add this code too:

.sqs-announcement-bar-close {display: none}