CSS Not Working – Need to Remove Header Image and Logo from Home Page Only

Hello,

Try to add the below code to the Customize > Custom CSS section to do it –

div#site-logo {
    display: none;
}
header#site-header {
    background-image: none;
}

If you want to disable the header completely on the home page, then edit the home page > OceanWP settings metabox > header tab and disable it.

Sat Sri Akaal Amit,

Thanks for the reply.

Unfortunately if I disable the header using the edit options then I lose the menu and page navigations buttons too.

And as mentioned in my initial post, for some reason adding custom CSS never works. I get the message advising changes have been made successfully but custom CSS codes never do anything to the website.

Can you please add the code I gave and let me know so that I can check why it is not working (Dashboard > Appearance > Customize > Custom CSS section)? It should work. Have you cleared the cache after adding the code?

Hi Amit,

I can confirm the code was added and the cache cleared.

Still no effect however.

Hi Amit,

I cleared the cache using WP Super Cache and also cleared the cache of my own browser and the CSS seems to have worked but has removed the header image and also the header logo from all pages, not just the home page which is what I needed.

Try the below code instead of the previous one –

div#site-logo {
    display: none !important;
}
header#site-header {
    background-image: none !important;
}

Can you share a screenshot where you have added the code exactly?

Hi Amit,

I had a play aound with the code yesterday and tried this:

body.home div#site-logo {
display: none;
}
body.home header#site-header {
background-image: none;
}

Which seems to have worked.

Glad to hear that it is fixed!