Archived topic
Change header background color on one page
7 replies · Started by Ben on May 7, 2022
Hi all,
I am looking for help with changing the header background color but only on one page. Thanks in advance.
Hoping for css to specify only the background-color for header & sticky header on this page.
Bw,
Ben
Hi Ben,
Try this:
.page-id-3524 .site-header, .page-id-3524 .site-header .inside-header, .page-id-3524 nav#sticky-navigation, .page-id-3524 div#primary-menu {
background-color: black !important;
}
.page-id-3524 .main-navigation .main-nav ul li:hover > a {
background-color: black;
color: white;
}
Thanks @Ying!
That worked. Could you please also help me to include the nav menu (see snip).
Bw,
Ben
Yes, updated the code in my last reply :)
That's great! And lastly (sorry for not asking complete qu to begin with..) the hovered link in nav menu?
See snip.
Bw,
Ben
No worries, updated the code again: https://generatepress.com/forums/topic/change-header-background-color-on-one-page/#post-2212770
Perfect, you have been super helpful and speedy! Thanks.
You are welcome :)
Glad to help!