How To Change Header Font Colour On Specific Page

marcelobufaical · October 2016

I need to change the font color on this particular page of my site: [Links visible only for registered users]. The font is dark and because of that, it is difficult to read the text. I need to change it to a lighter color, like a light grey. Thank you.

Albert · October 2016

Hi,

do you mean menu items color?

marcelobufaical · October 2016

I mean the words, like "Home", "FAQ", "Contact", etc.

Albert · October 2016

So these are menu items and to change their color on specific page, you need to use the following css:

.page-id-xxx #Top_bar .menu > li > a { color: #FFF !important; }
.page-id-xxx #Top_bar .menu > li a::after { background: #FFF !important; }
.page-id-xxx #Top_bar a.button.action_button { color: #FFF !important; }

where xxx is PAGE ID.

marcelobufaical · October 2016

Awesome, guys. Fantastic. Worked perfectly. Is there any way to remove the border of the action button on that specific page?
Thank you very much!

Albert · October 2016

Yes, you can do this with the following css:

.page-id-xxx #Top_bar a.button.action_button { border: 0 !important; }

marcelobufaical · October 2016

Fantastic, guys! Worked like a charm. Thank you very much!

Albert · November 2016

You are welcome

How To Change Header Font Colour On Specific Page

Comments

This website uses cookies