Only display Header on homepage

just the Header Image part.

Hello,@wenrenebao!

If you want to hide content on the homepage only, try to insert the following code into Customizing->General->Aditional CSS:

.home #main.wrapper{
    visibility:hidden!important;
}

Regards

Hey thanks for the reply! but I actually want the opposite like I want to hide it on the other pages but homepage. Because it currently appears on every single pages of my site. Thanks!!

Hi,@wenrenebao!

If you want to display the header image on the Homepage only, use the next codes instead of the code I gave you previously:

#agama-header-image {
    display: none!important;
}
.home #agama-header-image {
    display: block!important;
}

Regards

It worked. Thanks a lot!

And I’m trying to hide the header image on the home page but have it visible on every other page. I tried doing the code I below but it doest work. its either visible everywhere or nowhere

#agama-header-image {
display: block!important;
}
.home #agama-header-image {
display: none!important;
}

Hello @osasza96!

This code is enough to do that:

.home #agama-header-image {
display: none!important;
}

Regards

Hello @themevision

It worked! Thank you ??
Now I have another question,

Im trying to remove the header image from just one specific page.

I tried doing something similar as
“.home #agama-header-image {
display: none!important;
} ”

But I changed the .home to .page ID but it didn’t work.
Do you know how I could achieve that ?

To remove the header from front page and just one more page ?

thanks in advance ??

Hello @osasza96 !

First, you need to find the specific page ID number on the page in which you want to apply the code.

To discover the page id, please follow the steps below :

1. Navigate in your browser to the page you want to work with.
2. Right-click on that page (anywhere) and select “Inspect Element“.
3. Search inside the site’s markup for the body tag. It should be one of the first element in the source.
You’ll see it has many classes. Look for the class that starts with “page-id-…”. That’s the class you should use.

You can check THIS video guide

then, Open the Customizing->General->Additional CSS
and insert the below code. Add the Page selector for every page you want to remove the image and replace the page ID. (Separate the selectors with a comma)

.home #agama-header-image,
.page-id-31 #agama-header-image {
display: none!important;
}

Regards

@themevision
Thanks for your quick reply.
Unfortunately the code doesn’t work ??

Check the attached screenshots:

https://ibb.co/Wv95646
https://ibb.co/Jj6fSmx

Hello, @osasza96!

You have missed one bracket in your code:
https://prnt.sc/tmied1

Regards

Hello @themevision

You are right!
Thank you! It works now ??