How to remove the header and footer from a Squarespace page
Headers and footers are a very valuable part of a website. They help visitors navigate your website and switch between various pages. But the reality is, we don’t always want them! Luckily this is possible to do in Squarespace.
So, in this article, we’ll go through the various ways to remove the header and footer in Squarespace, whether you want to use the built-in settings or need a bit of custom code. We’ll also go through a few use cases for when a page can benefit with a removed header and footer, and why this is useful. Keep reading!
How to remove the header and footer from a Squarespace page
There are two different ways to remove the header and footer in Squarespace — one using the built-in functions and the other using a bit of html code.
To remove the header and footer with built-in functions:
Navigate to the Page Settings of the page in which you want to remove the header and footer.
Click on the Navigation tab.
Turn the Show Header and/or the Show Footer toggle off.
Save your changes.
To remove the header and footer with code:
Navigate to the Page Settings of the page in which you want to remove the header and footer.
Click on the Advanced tab.
Paste the following code
To remove just the header: <style> #header {display: none;} </style>
To remove just the footer : <style> #footer-sections {display: none;} </style>
To remove the header and the footer: <style> #header, #footer-sections {display: none;} </style>
Save your changes.
Reasons to remove the header and footer
There are a few good reasons to remove the header and footer from a website page. Let’s go through some of them.
Eliminate distractions: Taking out the header and footer can help keep your visitors focused on the contents of the page. Without all the usual navigation links and other content at the top and bottom, people are less likely to get sidetracked and more likely to spend time with what you want them to engage with.
Encourage a specific action: Removing the header and footer is also a great way to nudge visitors toward a specific action, like downloading a lead magnet or making a purchase. After all, including navigational links can give your visitors too many options, rather than a specific one.
Increase conversion rates: Eliminating distractions and being able to encourage a specific action tends to lead to one thing — higher conversion rates. In fact, data consistently shows that just removing the navigational links from a landing page can increase conversion rates. Removing other links like social media share links and external links can also help increase conversion rates.
Which pages should you remove the header and footer from?
Now that you know the reasons some pages can benefit from a removed header and footer, let’s go through some examples of pages that this may apply to. The main types of pages in which you may want to remove your header and footer from are landing pages. Landing pages are designed to drive conversions, so removing the header and footer helps eliminate distractions and keeps visitors focused on the call to action, whatever the call to action may be. Here are some types of landing pages where it makes sense to do this:
Sales pages: There’s one main goal of a sales page — to make sales. And removing the header and footer can keep the focus entirely on the offer. This approach helps improve conversion rates by guiding users directly toward making a purchase without any distractions.
Thank you pages: Thank you pages come after an action, like a purchase or sign-up. Navigations could prompt users to navigate away, missing additional calls-to-action or important follow-up steps provided on the page.
Webinar pages: Webinar pages aim to drive registrations or attendance to your webinar. Headers and footers with navigation links might lead users away from signing up.
Upsell pages: The purpose of an upsell page is to encourage additional purchases or upgrades. A clean, distraction-free layout keeps the user focused on the offer, increasing the likelihood of conversion.
Coming soon pages: Designed to build anticipation while a site is being built, these pages often don’t have a header since there may not be any other content on the site.
Lead magnet pages: Lead magnet pages are focused on capturing contact information in exchange for a valuable resource. Keeping the page simple without headers or footers ensures that users are more likely to provide their contact details.
A links page: A "links" page, often used in social media bios, is designed to direct visitors to specific content or resources. It has a more targeted navigation, which often defeats the purpose of having a header or footer on this page.
Need more help?
Hopefully, you now know exactly how to remove and footer from Squarespace. But do you need more help? You can learn more about Squarespace, design, copywriting, SEO, and more on the blog! Here are some of our favorites!
40+ ways to increase your blog traffic
How to grow your business without social media
How to write an email welcome sequence
How to write a blog post: Step-by-step
Why SEO is important for business
