YOU ARE A LIFE SAVER!!! I've literally been struggling with this for weeks! No one else has explained it this way. I'm so freaking relieved I can't believe it finally worked. I wish I found your channel months ago. Subbed! Tysm.
Thank you! ... SquareSpace support pretty much told me good luck it requires custom CSS. A simple requirement of hiding the header and footer allowed me to setup quick one pages sales funnel pages.
Hello Galen! Thx for the amazing Video! Is it also possible to blend out just a navigation tab? Like i want the Contact Page beeing still available but only reachable from the footer via linked text and not shown in the header navigation.
Thank you, searched for two hours looking for this. Pretty clunky solution. You'd think SS would just allow you to make multiple headers and footers for different marketing purposes.
It may depend on your template if you're on an older version of Squarespace, but the code still works :) Try this in your custom css: header {display:none;}
@@LocalCreative Right on. Thank you. It's amazing how creating an evergreen educational video keeps giving value from just searching. Glad I found this for my project today. I'll have to check out more of your videos too!
Yes, it should be the same code depending on your template/version of Squarespace. You just need to put it in the advanced settings for the Shop pages.
This still doesn't work - whether I use the Collection method in CSS or the page header code injection - Frustrated! It's Five Template and I just want the site title and navigation gone on one page. Helpppp!
Ahh you are using the older version of Squarespace so things may be a bit different. You just need to target the right ID. Try #navigation-top {display:none !important;}
Thanks for this super helpful video. I put the code into a single landing page that had a signup form on it and it removed the menu header, but also the title and description text from the form. Is there something I've missed?
Hmm instead of having "header" in your css, try "#header" and that should only target the heading on your website and not the form too. Hope that helps!
I tried as you suggested putting the code below on the individual page I wanted to remove the header but the logo and menu still show up - I do have the business plan. I must be doing something wrong?? header {display:none;}
Ah, I think it was because I was using version 7.0 and a Brine Family of templates - this code worked: .Header, .Footer, .Mobile-bar{display:none !important; }
i did your code ! it worked great, but now i wanna put it back, and you juste give the ''none'' display but if i want ot put it back whats the code ! because i deleted your code and my header and footer didn't reapper ? Help please !
Make sure you remove any custom CSS that's site-wide (under your style settings) as well as any code you've added to the page itself in the page settings under advanced. Hope that helps!
Do you know if this is an option on a "Personal" SS plan? I used to be able to edit the code but it says I need to upgrade. Maybe that's just to edit the 'advanced' CSS? Can't find that info/specs on their pricing plan option page 🤔
It's now the paintbrush in the top right for all design settings and custom css is under "website tools" under the list of all your pages. Squarespace changed their dashboard.
You want to make sure you are only adding the code in the advanced > header code injection for the pages you want the header to disappear rather than your entire site's CSS. Otherwise it will affect every page. Hope that helps!
This did not work, and it is unnecessary to install browser plugins to create a squarespace site. Here is the actual code needed to remove the header and footer of any page 👇 #header, #footer-sections { display: none!important;} Just copy and paste that into the box and you'll be good to go. 🖖
YOU ARE A LIFE SAVER!!! I've literally been struggling with this for weeks! No one else has explained it this way. I'm so freaking relieved I can't believe it finally worked. I wish I found your channel months ago. Subbed! Tysm.
Awww thank you! I'm so glad to have you as a subscriber. Let me know if you have any more video ideas :D
Thank you! ... SquareSpace support pretty much told me good luck it requires custom CSS. A simple requirement of hiding the header and footer allowed me to setup quick one pages sales funnel pages.
Wonderful! Yes, they don't like to support custom code since it opens a whole can of worms for them. But this is an easy solution :)
Exactly what I needed, Thank you!
You're welcome! So glad!
Thank you so much, I was pulling out what hair I have left!
Glad I could help! And you could save some hair ;)
Thank you !
You're welcome!
Hello Galen! Thx for the amazing Video! Is it also possible to blend out just a navigation tab? Like i want the Contact Page beeing still available but only reachable from the footer via linked text and not shown in the header navigation.
Yes! You can put any links only in the footer navigation instead of the header.
Worked perfectly! Thanks!
You're so welcome!
Thank you! I’ve never used code before and I was able to remove the header and it was so easy!
I love hearing that! Thanks for letting me know Lisa!
can you make a landing page, for sparespace scheduling ? when costumer have booked ? like a thank you page.
That's a great question! I think you can with a bit of code. I just Googled it and found a few tutorials. 👍
Thank you, searched for two hours looking for this. Pretty clunky solution. You'd think SS would just allow you to make multiple headers and footers for different marketing purposes.
Right! Hopefully someday. But it's just a few lines of code so not too bad :)
@@LocalCreative Appreciate it. It is a pretty site designer, but not a marketing site tool. Much better solutions if you have to market your site.
Super super helpful, thank you so much!!
You're very welcome!!
Thanks! that worked, although, now I'm seeing "header {display:none;}" at the top left of the page. It won't go away. Any solutions? Thank you!
You need to make sure it's inside of CODE GOES HERE :)
@@LocalCreative The goat right here! Thank you so much!
Thanks! In 2024 though, this isn't working. At least for me. The page refreshes and it's all still there. Any suggestions? Thank you!!
It may depend on your template if you're on an older version of Squarespace, but the code still works :) Try this in your custom css: header {display:none;}
This is amazing. Thank you. Quick question: does this work for hiding the footer too?
Yes :) you just need to tweak so it targets a different secion/id.
@@LocalCreative Right on. Thank you. It's amazing how creating an evergreen educational video keeps giving value from just searching. Glad I found this for my project today. I'll have to check out more of your videos too!
Hi there! Thank you for this! I tried to use the code injector, but my header still appears. Any ideas why that might be?
Feel free to share the code you're using so I can take a look :)
Thanks for this! How do you hide your header in mobile view too?
It should work for both, but if not try #header instead of header in the css. :)
Hi @Localcreative - Is it possible to do this on a product page? If so can you forward the code?
Yes, it should be the same code depending on your template/version of Squarespace. You just need to put it in the advanced settings for the Shop pages.
Thank you! So easy! And, subscribed!!!!
Thanks for subbing! Really appreciate the comment!
hey what about you don't want to show header when open an image? need to show in full size. thanks
Hmm could you explain a bit further? I'm not sure exactly what you're looking for.
You're the best, thank you so much!
You're so welcome!!!
This still doesn't work - whether I use the Collection method in CSS or the page header code injection - Frustrated! It's Five Template and I just want the site title and navigation gone on one page. Helpppp!
Ahh you are using the older version of Squarespace so things may be a bit different. You just need to target the right ID. Try #navigation-top {display:none !important;}
Thanks for this super helpful video. I put the code into a single landing page that had a signup form on it and it removed the menu header, but also the title and description text from the form. Is there something I've missed?
Hmm instead of having "header" in your css, try "#header" and that should only target the heading on your website and not the form too. Hope that helps!
I tried as you suggested putting the code below on the individual page I wanted to remove the header but the logo and menu still show up - I do have the business plan. I must be doing something wrong??
header {display:none;}
Ah, I think it was because I was using version 7.0 and a Brine Family of templates - this code worked: .Header, .Footer, .Mobile-bar{display:none !important; }
Glad you got it working!
i did your code ! it worked great, but now i wanna put it back, and you juste give the ''none'' display but if i want ot put it back whats the code ! because i deleted your code and my header and footer didn't reapper ? Help please !
Make sure you have the code at the page level and not the site level. Once the css is removed, it no longer can affect your site in anyway :)
Excellent! Precisely what I needed. :)
Great to hear! Thanks for letting me know.
This worked great, however, my header is still showing on my mobile device? Any way to remove it from both desktop and mobile view?
Hi Whitney! You can jump to 2:52 in the video to see an easy solution for that. :)
@@LocalCreative Thank you. I have applied to code to the actual page advanced settings. It is still showing the header, unfortunately.
@@whitneykay hmm what template are you using? And is it 7.1 or 7?
@@LocalCreative I'm having the same trouble. I've had the page 3 years. I'm sure it's 7. Is there a solution?
Great tutorial!
Appreciate the kind feedback! Thanks :)
How do I add the header back? Simply deleting didn't work :(
Make sure you remove any custom CSS that's site-wide (under your style settings) as well as any code you've added to the page itself in the page settings under advanced. Hope that helps!
Your way of guide is very good but it does not working on my WordPress site
This is only for Squarespace :)
Do you know if this is an option on a "Personal" SS plan? I used to be able to edit the code but it says I need to upgrade. Maybe that's just to edit the 'advanced' CSS? Can't find that info/specs on their pricing plan option page 🤔
Okay, looks like it's considered a premium feature (business and commerce). Planning on upgrading anyway... thanks for the video/tips!
You're welcome! Sorry it's not available on the personal plan.
Brilliant, thank you!
You're so welcome!
Thanks
Welcome!
I don't have a "Design" setting tab on my home screen..... anyone have any ideas?
It's now the paintbrush in the top right for all design settings and custom css is under "website tools" under the list of all your pages. Squarespace changed their dashboard.
How about removing ONLY the menu's items, leaving an header with a logo? Is that possible?
I would remove the heading using this code and create a new section below it with just your logo almost like a fake header. Hope that helps!
Thank you. Really well done. Liked and subscribed!
Thanks for the sub! Really appreciate it!
With this my homepage header is also gone,I don't know why,
You want to make sure you are only adding the code in the advanced > header code injection for the pages you want the header to disappear rather than your entire site's CSS. Otherwise it will affect every page. Hope that helps!
Thank youuuuuu
You're welcome! :)
This did not work, and it is unnecessary to install browser plugins to create a squarespace site.
Here is the actual code needed to remove the header and footer of any page 👇
#header, #footer-sections {
display: none!important;}
Just copy and paste that into the box and you'll be good to go. 🖖
Thanks, but I think you missed that part of the video. I go over this method as well about halfway through.