BDeen,
I’m not sure what your comfort level is with code, but a very simple method would be to target the page template with CSS and set the header/footer to display: none.
.page-template-no-header-footer .skehead-headernav,
.page-template-no-header-footer #footer {
display: none;
}
This has it’s own drawbacks but not sure what your usability/UX goals are so this is kind of my “general purpose answer” for your situation.
Thread Starter
BDeen
(@bdeen)
Thank you for your help. I placed this in my CSS but it didn’t work.
.page-template-profile .skehead-headernav,
.page-template-profile #footer {
display: none;
}
Is this correct? My page template is named profile.
Do you have a page on the live site that’s using this page template so I could take a look at why that’s not working?
Thanks!
I just checked out the first page and saw you changed it to the new template, also the name for it when viewing source in Chrome inspector is .page-template-template-profile so the code should be:
.page-template-template-profile .skehead-headernav,
.page-template-template-profile #footer {
display: none;
}
Thread Starter
BDeen
(@bdeen)
Perfect! It worked! Your a life saver thank you so much!
Glad I could help 🙂
If you could also just mark this thread as ‘resolved’, that would be awesome!
Cheers!
Thread Starter
BDeen
(@bdeen)
Oops one more thing. I just noticed when you go to this page
http://liveathlete.com/flowers/
and you scroll the header appears again. This theme uses that style of header. Do you know how I can keep that from happening?
Ah so it’s using JavaScript to add a new class/styles to the header to create a “sticky header” effect. It adds .skehead-headernav-shrink to it which is why it comes back. So you should add the following:
#header.skehead-headernav.skehead-headernav-shrink {
display: none !important; /* needed to override JS inline class */
}
I normally try to stay away from adding !important to CSS but in this case it will be needed.
Let me know if that fixes it for you!
Thread Starter
BDeen
(@bdeen)
It did fix a portion of it. Now it does not show the smaller sized down header when scrolling but the header is still there.
http://liveathlete.com/flowers/
I really appreciate your help with this. I have been having so much trouble with this.
That’s odd, it looks like there is also a header ID that’s getting shown when you scroll back up, so adding this should do the trick:
#skehead {
display: none;
}
