Hello,
How do I make the header background transparent on my homepage only. All the code I’ve found changes my whole site.
Thanks
Hello,
How do I make the header background transparent on my homepage only. All the code I’ve found changes my whole site.
Thanks
Hi,
Thank you for contacting us. I am happy to help with your queries.
You can add a .home class name at the beginning of your code to make it only be executed only on homepage.
For example, if the current code looks like this:
.background-overlay {
display: none;
}
Replace it to
.home .background-overlay {
display: none;
}
I hope this reply helps.
Regards,
Kharis
aThemes Support
This hasn’t helped unfortunately, nothing changed.
I tried this code you sent before for another page. And it doesn’t work either, it only recolours if a hex code is applied.
.page-id-4 #masthead {
background-color: #none;
}
I’m using header style Basic 2 - Outside Header and have set colours for both sticky and non-sticky views (black and white). This means, that I’m only able to do a colour overlay rather than remove the colour completely. Also, using the code you sent previously changed the header for both sticky and non-sticky views, and I only want to change the non-sticky colour.
Is this possible?
This is the link to my site for reference.
Thanks
Hi,
Thank you for getting back.
Try this code:
.home #masthead-sticky-wrapper:not(.is-sticky) #masthead {
background-color: none;
}
Regards,
Kharis
aThemes Support
This solution hasn’t worked either unfortunately.
Hi,
Thank you for getting back. Perhaps there is a line contains an error from the entire code of your additional CSS. If you couldn’t identify it, I’d recommend validating all of your code with this tool: https://jigsaw.w3.org/css-validator/#validate_by_input. And try fixing it when the CSS issue found. You can share it here in case you don’t know how to fix.
Regards,
Kharis
aThemes Support