[Resolved] Specific CSS class for header in specific page

[Pablo Querol]

Hi Tom,

I’ve been searching in your forum, but I didn’t find something like that. I think it’s quite easy but I’m not being capable of doing it by myself.

I want a transparent header only for the homepage, you can see the design I want to display here: https://www.estudiomomo.com/wp-content/uploads/2017/05/home.jpg

I have seen on a few sites made with your plugin/theme that the designer has given a specific class for the page header only for the homepage, something like:

.home .site-header {
background-color: transparent;
}

How can I do that?

Thanks in advance!

[Leo]

Hi Pablo,

I assumed you’ve tried this code:

.home .site-header {
    background-color: transparent;
}

but it’s not working?

Maybe try this:

.home .main-navigation {
    background-color: transparent;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

If not are you able to provide a link to your site so I can take a look? Thanks!

[Pablo Querol]

Hi Tom!

Thanks for your quick answer! Now I see I really didn’t explain myself very well 🙁

I’ve solved my question taking a deeper look into your documentation. What I really wanted to do was merge the header with the content in the homepage. And I found the way here https://docs.generatepress.com/article/merging-header-navigation-content/

Thanks! I’m going to mark this as solved 🙂

[Leo]

Awesome glad you found the solution 🙂

[Author]

Posts