Marquee: Hiding header and footer?

I would like to hide the header (including navigation) and footer on a few unlinked pages on the Marquee template. Is there any quick CSS I can use to do this?

Thanks!

Yep, go to the page you want to hide the header and footer on, and go to Manage Site (gear icon) > Page Settings > Advanced and paste this into the Page Header Code Injection (be sure to include style tags):

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

That should do the trick.

And to remove the header and footer across the site, add this to the Custom CSS Editor:

#header, #footer { display: none }

Worked perfectly. Thanks!

Worked! I'll mark my own question as solved with this. Thanks!

This is not working for Marquee, any ideas?

@arthurm

I just tried in Marquee - it works great for unlinked individual pages.

I'm trying to use it for the index pages as the footer is showing on my main page under the parallax images. I have tried it on regular pages too and it takes the content out of the footer but does not remove the actual footer bar.

strange, I tried the code on a index page and the footer is not showing at all. Do you enter the code in the advanced section of the configure page?

i have tried it in the site wide css, the single page code injection and the sitewide injection.. It's just not working anywhere. like i said, it takes away the content inside the footer but not the bar itself.

I just checked, you are right: if entered in the custom css section, the footer info disappears, but the footer bar stays. Within an index, I had pages without the complete footer and some with the footer bar only.

very odd, maybe a CSS issue. Good luck, I hope somebody can help you!

If you're still wanting a solution, post the url to your site so people can see the code.

This code seems to work in Flatiron as long as you replace #footer with #bottomBar when using it as custom CSS. Otherwise it had no effect.

@kale

Thank you so much for this. I would also like to remove the banner image. Do you know the style tags for that? Where do I add them?

I think this will do the trick. If you want to hide it on particular pages only, add this CSS (with style tags) to the Page Settings > Advanced > Page Header Code Injection area. Please note, if you already have style tags for other CSS for that page, don't add an additional set, simply add the CSS within existing style tags.

<style>
 .title-desc-wrapper.has-main-image { display: none; }
</style>

If you'd rather apply it to every page on your site, add this to the 'Design' > 'Custom CSS' section (no style tags necessary).

 .title-desc-wrapper.has-main-image { display: none; }

@kale

Thank you so much! That did it. Very helpful, thank you.

Would you also happen to know how I can change the color of a page?

Instead of applying the code into the Page Header Code Injection area, what code can be used to hide the Header and Footer on all Pages on a site minus a specific Page? This would save time compared to having to inject code into each individual Page on a site.

Ideally, this code would be placed in Custom CSS or Settings-->Advanced-->Code Injection. Is this possible?

Code worked, but I need a way to toggle my footer on and off. Basically, I don't like it visible, but need it to where a visitor can click a text link or a button to open it to show content and hide it again to save space. Anyone know how?

Hi there, i had a similar requirement in not wanting to have Pre-Footer information on specific pages. Using the coding supplied, i also searched for the correct naming of the Pre-Footer within my CSS style sheet settings. I inserted the following code in the Advanced tab per other descriptions, and it worked just fine! Happy days from this dumb non-coder :)

 <style>
  #preFooter { display: none }
</style>

how to keep just the logo?

Is there any ready this isn't working for my site? the internal page is

http://www.trianondesign.ca/threadneedle