Is there any way to hide header footer menu only in mobile view for certain pages or posts.
Hi Saswata,
Thank you for writing in, yes that is possible, but you need to determine first the ID of the certain page or post.
After you locate your page ID, you can then add this to Theme Options > CSS
@media (max-width: 767px) {
.page-id-xxxx header, .page-id-xxxx footer {
display: none !important;
}
}
Replace the xxxx
with your actual page ID.
Hope it helps,
Cheers!
Is this css also work for post
Sorry but when I added this for mobile screen everything is blank, check out this link: https://partsofspeech.net/forum/
Oh sorry about that, I forgot. For the post, it would be:
@media (max-width: 767px) {
.postid-xxxx header, .postid-xxxx footer {
display: none !important;
}
}
Do you only want to hide the menu? If so, please update the given CSS to this:
@media (max-width: 767px) {
.page-id-xxxx header .x-nav, .page-id-xxxx footer .x-nav {
display: none !important;
}
}
If that did not work, please if you don’t mind clear and deactivate your caching/optimizer plugin so we can test the CSS code effectively before we give it to you.
Thanks,
Sorry, not working, and I deactivate both the plugins pls check it
For posts it work but not for pages
Hello, @friech here is another problem, and that is I hide my BB Press Forum section using this CSS, But when someone creates a topic on that section It is considered as a new post, and both header footers are visible, Please help me with this,
Do you want to hide the navbar button as well? If so, please add this custom CSS:
.page-id-3397 #x-btn-navbar {
display: none;
}
Please find this custom CSS:
@media (max-width: 767px){
.postid-3424, .postid-3426 header, .postid-3424, .postid-3426 footer {
display: none !important;
}
}
And change to this:
@media (max-width: 767px){
.postid-3426 header,
.postid-3426 footer {
display: none !important;
}
}
May we know the URL of the creating new topic page?
Thank you.
Hello, @thai Sorry, but I added that css too, but it also not working for me,
and this is the topic url: https://partsofspeech.net/forums/topic/test/, I also wanna hide header and footer when someone creates topics automatically,
Hi Saswata,
You seem to have the wrong ID, please back read to my first replay above and have the correct ID. bbPress topics are posts so use the .postid-xxxx header, .postid-xxxx footer
selector.
You need to clarify what you’re trying to do here because you said above certain pages or posts. Do you want to hide the header and footer to all topics? or just certain topics?
Please be reminded that bbPress is a 3rd party plugin, depending on what you’re trying to do, we might not be able to provide support with it.
Thanks,
Sorry, @friech I think I messed with something, now your CSS working fine, thanks, although is it possible when someone creates a topic on bb press it automatically adds that CSS to the post? so that on mobile version no header and footer displays.
Hi Saswata,
No, it will not automatically add the css to the post. If you would like it to work in all posts, you may change the css code with this.
@media (max-width: 767px){
.single.single-topic header,
.single.single-topic footer {
display: none !important;
}
}
Hope that helps
You’re welcome, Saswata.
@paul.r Can you also help with BBPRESS tags also? This is the url: https://partsofspeech.net/forums/topic-tag/test/
thank you
Hi Saswata,
To include bbpresstags, please change the css code to this
@media (max-width: 767px){
.single.single-topic header,
.single.single-topic footer {
display: none !important;
}
.bbpress.topic-tag header,
.bbpress.topic-tag footer {
display: none !important;
}
}
Hope that helps
You’re welcome.