Hide the main navigation? What the heck?
Hear me out! Lots of designs benefit from removing the main navigation on Squarespace. Think about it: maybe you want an overlay menu, maybe you’re designing a non-traditional navigation system, or maybe you’re creating a special landing page. I use this code all the time when designing landing pages and I want something simple and striking. It’s actually a super-easy change with just a little snippet of CSS code:
[data-section-id="header"] {
display: none !important;
}That’s it! The CSS code above hides the main navigation, allowing you to implement whatever alternative design you’d like.
How to install it
To install, simply copy the code above and paste it in your site’s Custom CSS section.
Want the nav back?Restoring it is as easy as removing the code.
That’s it! Enjoy this free CSS tool for your Squarespace sites.