Want to make your Squarespace website easier to navigate? Adding a sticky header (also known as a fixed header) is a quick way to improve user experience and keep your branding, menu, and navigation accessible at all times.

The good news: Squarespace has this feature built right in, it’s just hidden away in the header editor, which many people overlook. In this guide, I’ll show you exactly how to set up a sticky header in Squarespace in just a few clicks.

What Is a Sticky Header?

A sticky header is a navigation bar that stays visible at the top of the screen while a visitor scrolls down your page. This makes it easier for users to quickly access menus, links, or your logo without having to scroll back up.

On Squarespace, you can enable this directly in the header settings, no custom code required.

*Want a framework for designing the perfect homepage?*

Access now

Need an expert to build your Squarespace website?

Book a free kick-off call with our team to discuss your project requirements in detail.

Schedule a call

Step 1: Open the Site Header Editor

Go to your Squarespace website and click Edit.
Instead of jumping straight into editing sections (which many people do), hover over the site header at the very top.
Click Edit Site Header > Edit Design.

Step 2: Enable Fixed Position

Once inside the header design settings:

Scroll down until you find the Fixed Position option.
Toggle it on.
Choose between two sticky header styles:
Basic - The header stays in place as you scroll down the page.
Scroll Back - The header disappears as you scroll down but reappears when you scroll back up.

Step 3: Pick the Best Option

While both options are available, here’s the difference:

Basic Sticky Header - Clean, simple, and consistent. The header remains visible at all times.
Scroll Back Header - Hides when scrolling down and only reappears when scrolling up. Personally, this feels unusual and isn’t commonly seen outside of Squarespace.

Recommendation: Stick with Basic Fixed Position for the best user experience. It looks clean and keeps your navigation accessible.

Step 4: Save and Publish

Once you’ve chosen your sticky header style:

Click Save in the top-left corner.
Preview your site to make sure the header works as expected.
Publish your changes.

And that’s it, you now have a working sticky header on your Squarespace site.

Final Thoughts

A sticky header is a simple but powerful way to improve your Squarespace website’s usability. By keeping navigation visible at all times, you make it easier for visitors to browse, click, and convert.