Jump to content

Removing header & footer to create a coming soon page

Recommended Posts

I know theres been a few questions on this topic but ive tried to use some of the CSS in those posts but it doesnt seem to work for me.

Im using 7.1 and my site isnt live just yet. Ive still got a few things before i can publish the site.

My issue is my domain is transferring over today so i want to create a simple "Coming Soon" page. Ive created this page just using a simple blank page from the template pages. Problem is this page has the header + links and the footer + links which i dont want my clients to see just yet. Once im ready ill delete this page and link all my site pages so its live.

Can anyone give me simplest way of doing this please? Will i just add the code provided into this specific page settings / advance / page header code injection? Or will it need to be added in the site wide CSS section?

Also do i have to set this "Coming Soon" page the home page while i use it as the coming soon page?

 

I cant give anyone a link to the website as its not live/published yet, hope this isnt crucial for this help?

Thanks in advance.

Link to comment

The easiest way is to set a site password. When you do this, a 'lock screen' will be created. The lock screen will prevent visitors seeing your header, footer and other page content. All they'll see is the lock screen.

You can customise the lock screen by following this guide: Designing a lock screen

  If this helps you, please click "Like" below  ⬇️

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment
23 minutes ago, paul2009 said:

The easiest way is to set a site password. When you do this, a 'lock screen' will be created. The lock screen will prevent visitors seeing your header, footer and other page content. All they'll see is the lock screen.

You can customise the lock screen by following this guide: Designing a lock screen

  If this helps you, please click "Like" below  ⬇️

Thanks for this but ive tried this and the lock screen is very very restrictive in 7.1. Ive been able to add a background image but then little else. There no option for changing fonts and etc, it seems theres only options for styling the password box which i dont even want.

 

Ideally im after custom CSS so im able to hide the header and footer on one specific page which ive already designed. 

 

I found this CSS code which ive tired putting into the specific page code:

 

<style>
 #header, #footer { display: none }
</style>

 

This hides the header on the page i want but doesnt hide the footer for some reason. If i could hide both it would be perfect.

 

Thanks for the reply though. 

Link to comment
20 minutes ago, NaviTavern said:

<style>
 #header, #footer { display: none }
</style>

This hides the header on the page i want but doesn't hide the footer for some reason. If i could hide both it would be perfect.

On 7.1, instead of #footer, you can either use footer (without the #) or #footer-sections.

Note that the rest of your site will still be accessible if there's no site password.

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.