Using JS to hide footer for spec page

Ask the community
,
1

Tried
$w( “#footer1” ).hide(); but not work
How to hide footer for spec page only?
Thanks

2

I dont think you can hide the footer itself via coding because .hide and .collapse aren’t valid code for the footer itself. But you can try putting everything in your footer into a container and collapsing that container when you don’t want to show the footer or you can hide it through the editor.

To hide through the editor:

  1. go to manage page

  2. click on the 3 dots next to the page you want

  3. go to layout to hide the header and footer

Note that you will have to copy the header into the page as you cannot only hide the footer if you use the editor method.

3

Here you will see how to hide a header…
https://russian-dima.wixsite.com/meinewebsite/header
Try it out, to do the same for the footer :wink:

4

Hey there …

The footer and the header do NOT have exposed APIs to hide or collapse them. You can only hide all elements (displayed on all pages) including the header and the footer from the page layout settings.

5

You can hide the footer without hiding the header only if you have a premium account.
Then you can try Dashboard > Settings > Custom Code > Head

<style>
footer {
    display: none;
}
</style>

And apply it to the relevant page(s)

6

If this doesn’t work then add a custom code to the end of the body instead like this:

<script>
    let footer = document.querySelector("footer");
    footer.style.display = "none";
</script>
7

@jonatandor35 Hey! Thank you so much for sharing this code. Is there a way to modify it so that the footer “collapses” insted of “hides”? Cause the blank space where the foooter was remains there.

Thanks!
Euge

8

@eugeniagarat This code shouldn’t leave any space, but it might not work on dynamic pages (due to an old bug, that I reported a long time ago and hasn’t been fixed yet afaik).
If it is a dynamic page and you see the issue there, you can hide the footer using Custom Element (instead of custom code).

If you’re using EditorX you don’t need any code at all because you can control the header and footer separately via the editor.

9

@jonatandor35 Thank you J.D.! I’ll check it out, hope I can make it work cause I’m really new at code. Too bad they didn’t fix that bug. Sadly it´s not editor X and the problem persists in dynamic pages as you said. I realized it doesn’t only leave that space in blank, it also fails at hidding the footer if you reload the same page you are in.
Thank you again for your help!
Euge