Return to previous page

Can I turn off the header on selected pages?

This topic has 7 replies, 2 voices, and was last updated 1 years, 9 months ago ago by Awais Ahmed

Azager

Participant

July 15, 2022 at 06:02

I would like to integrate some of my website pages onto a mobile app and for this, i would like to turn off the header and footer on these selected pages.
I already figured out how to turn off the footer on selected pages, but i can’t seem to hide the header.
Please help!

#329725 Copied Theme version: 8.2.3 WooCommerce version: 6.7.0

6 Answers

Awais Ahmed

Participant

July 15, 2022 at 06:38

Hello, @Azager,

Thanks For using our Theme.

Actually, You have to do this with the help of custom CSS but for this, you have to pick the classes of the pages and header then combine the classes and set the “display: none !important;”

Now, the thing is how can you get the classes to let me explain to you. first of all, we need to get the page id on every page by default WordPress shows the page id and it is unique from every page you can find the page id on the “” tag via console log see this image: https://postimg.cc/mzSWBS5M
as you can see in this image the page id of the main page is “page-id-11” this way you can get the page id of every page you want.

Second, now we need to find the header class the class of header is the “site-header” so now we have the both classes page and header now let’s combine and set the code to display none. The code will be like I write below.

.page-id-11 .site-header{display:none !important;}

See this is the code now add this CSS code in the XStore >> Theme Options >> Theme Custom CSS then save settings and check back to your site after clearing the browser cache.

I hope you understand.

Regards 8Themes Team.

#329732 Copied

Azager

Participant

July 15, 2022 at 06:45

I will try this now

#329735 Copied

Azager

Participant

July 15, 2022 at 07:03

I cannot get it to work.

.page-id-11 .site-header{display:none !important

Instead of hiding the already existing heade, the above code adds another header. This time it adds a mobile view header. I want to hide the header and footer so that i can retain only the body of the page.

#329739 Copied

Awais Ahmed

Participant

July 15, 2022 at 07:28

Hello, @Azager,

sorry for the inconvenience the code was wrong. Below is the working code you can use to solve your issue. Here is the result image for a better reference: https://postimg.cc/HV83M9wC, as you can see in the image the code works, and the header is gone.

.page-id-11 .site-header{display:none !important;}

Regards 8Themes Team.

#329741 Copied

Azager

Participant

July 15, 2022 at 07:44

Perfect! It works.

Thanks alot!

#329746 Copied

Awais Ahmed

Participant

July 15, 2022 at 07:50

Most Welcome 🙂

If you do not mind, can you please leave 5 stars rating for our Theme & Customer and Technical Support by going here: http://themeforest.net/downloads It will allow us to release more updates and provide dedicated support in the future. It would encourage our work a lot. If you like our Theme and Support.

Thanks for contacting us.
Have a great day 🙂

If you will have any issues, you can contact us anytime, we are always here to help you.

Case Closed.

#329747 Copied
Tagged: header, selected pages, templates, turn off, woocommerce, wordpress
Viewing 7 results - 1 through 7 (of 7 total)

The issue related to '‘Can I turn off the header on selected pages?’' has been successfully resolved, and the topic is now closed for further responses

Can I turn off the header on selected pages?

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection