Create a Cover Page in Squarespace
Have you ever seen a sales page or registration page with no header and wondered, “Can I do this on my Squarespace website?”
Absolutely…with a little bit of magic CSS!
Cover pages, more commonly known as landing pages, are simple webpages that minimize where the user can go. Whereas a regular website page has a header at the top and a footer at the bottom containing the website navigation menus, a landing page typically has neither. That’s because landing pages funnel or direct users to one specific goal, without allowing visitors to click on links that take them outside of the page.
How to Create a Squarespace Cover Page Using Code
Squarespace 7.0 had a cover page option, but you were limited to the templates and styles that were provided. Meanwhile, Squarespace 7.1 doesn’t have a landing page option at all. So, what is a Squarespacer to do?
Luckily, all you need are a couple snippets of code!
In this video, I show you how to hide the header and footer on a specific page to create a cover or landing page in both Squarespace 7.0 and 7.1.
Remove the Header & Footer
Create a new page or select an existing page in your website. Click on the page settings icon and scroll down to ‘Advanced.’ Then simply copy and paste this code into the box under the ‘Advanced’ tab.
If you don’t want to remove the entire footer, visit my tutorial on how to hide only part of your footer.
<style>
/* REBECCA GRACE DESIGNS */
header, footer {
display: none !important;
}
</style>When Should You Use a Cover Page or Landing Page?
Now that you know how to create a cover page in Squarespace, when should you use one?
Well, landing pages have a wide variety of applications. They are most often used for sign-up pages, event registration pages, sales pages, or coming soon pages.
But that’s not all you can use cover pages for! Sometimes, a landing page can even be used for the home page. For example, if you have a business that offers two distinct services, you may use a landing page as your home page to direct the user to appropriate section of your website.
Basically, any time you want to direct website visitors to take one specific action, you may want to use a landing page.
Tips for Creating a Squarespace Landing Page that Converts
The purpose of a landing page is usually to convert visitors into either leads or customers. Whether you are trying to collect their email address or sell them a product, you’ll want to make sure your landing page will convert instead of having a high bounce rate.
“Landing pages need to look appealing, but most of all they need to convert.” – Russell Brunson
After you use the code provided above to create a cover page in Squarespace, follow these tips to make sure you grab your visitors’ attention, keep them on the page, and convert them into leads or customers.
Grab your visitors’ attention with a killer headline.
Write actionable copy that speaks with your target audience and motivates them to make a decision.
Create one irresistible offer that solves a pain point for your target audience.
Use customized CTAs instead of the normal boring CTAs like ‘Buy now’ or ‘Sign up.’
Break up the copy with engaging visuals, but make sure they are not large files that will slow the page loading speed.
Include social proof such as testimonials or reviews.
After visitors convert, redirect them to a thank you page and provide links to more content on your website that might interest them.
Guess what? Now you’re ready to go create your own Squarespace cover page! Make sure to save the code snippets to a swipe file so you can easily copy and paste them with each new landing page you create. Happy designing!
