Hide header and footer

Hi, 

I use a code on this website to make a hamburger menu on desktop so I think thats the problem with following: 

I want  to hide the header and footer on a salespage and this code in the advanced tab doesnt work: <style> #header, #footer-sections { display: none!important;} </style>

Can anyone help me with a code to do so?

PW: Anahata12

Can you share the website URL?

That code is for hiding the desktop header, you need a different selector for the mobile header.

Sorry, yes

https://anahata-coaching.squarespace.com/hsp-hss-4-daagse

Add this to the page header code injection:

<style>
  .header .header-announcement-bar-wrapper, #footer-sections { display:none !important;}
</style>

Or this if you want to hide the announcement bar as well:

<style>
  .header .header-announcement-bar-wrapper, #footer-sections, .sqs-announcement-bar { display:none !important;}
</style>

Let me know if that works for you.

Hi @Ziggy No unfortunately it doesnt' work. 

Do you have an other solution? 

Hmm, try these selectors instead:

.header-display-mobile
.header-display-desktop

and try adding !important as it seems to need that in my testing.

hi @Ziggy

So i tryed this: 

<style>
  .header-display-mobile
.header-display-desktop .header-announcement-bar-wrapper, #footer-sections, .sqs-announcement-bar { display:none !important;}
</style>

Too bad but it is not working 😢 ...  Do you think it's because of some other code inflicting?

44 minutes ago, Lian said:

Do you think it's because of some other code inflicting?

Very strange, this is not normally difficult to achieve, but it could be a code conflict with the header code you're using to force a mobile view, but it's hard to help you further without access the website in question.

@Ziggy yes I figured. Can you help me further when I give you acces? With what credentials I can add you?