Archived topic
Custom CSS for page hero in one category
7 replies · Started by Rust on September 14, 2020
Hello.
I need to custom page hero colors just for one category posts only.
But i can't, because, i have this custom CSS for all site pages:
.page-hero {
background-image: linear-gradient(-30deg,#00004d,#5333ed 49%,#2cd4d9);
}
How can i enable this CSS just for one category only?
.page-hero {
background-color: black;
}
Hi there,
Are you referring to the category archives or single posts under a specific category?
single posts under a specific category
What if you create a separate page hero/header element specific for the single posts in that category using display rules like this?
https://www.screencast.com/t/IXS4Db6Zx
did, did not help, because i have GLOBAL custom .page-hero css code
The best way would be to add a custom CSS class:
https://docs.generatepress.com/article/header-element-overview/#element-classes
For example, if you add a class called gradient, then you can target your CSS specifically:
.page-hero.gradient {
background-image: linear-gradient(-30deg,#00004d,#5333ed 49%,#2cd4d9);
}Thanks, Leo, great support!
No problem :)
