Chaging header background colour on multiple pages


#1

Hi,

I installed your theme and changed the header background colour on the Home page. It worked fine just like the demo page. But when I go onto other pages they all have black headers when sticky. I can’t figure out how to change this with elementor or wordpress customisation. Does this require separate CSS script to change on other pages?

Thanks


#2

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .is-sticky .site-header {
      background-color: #ff0000 !important;
    }

If it doesn’t help, please share a link to your site, so I can have a look.

Regards,
Kharis


#3

That code was too powerful. It just changed the whole website header to the same colour.
I just wanted to change them individually. The website is butitsdigital.com

I found a code:

    .page-id-198 #masthead {
       background-color: #ff183c;
    }

which changed the header on the services page but the blog and contact us stayed the wrong colour (I don’t know what I did to find that code or what it means) It says ‘page-id’ so I can only assume this is naming the services page as number 198, so how do I find out the page id of the blog and contact pages?


#4

it has just come to my attention that this was addressed in another post on Nav background colour issue it was indeed the pageID I was looking for