Navigation element color

Support
#1

Hey all, is there a setting where I can change the color of a navigation text element based on the page I am on? As an example, if I have a menu made up of “Page A” “Page B” “Page C” and “Page D” - is there a way when I navigate to “Page C” the color can be different, so users know they are on “Page C”? Hope this makes sense. Thank you

#2

Hello @rpduffy,

Thanks for asking. :slight_smile:

You can use page id along with the CSS selector to change menu color for specific pages. You can add following CSS under X > Launch > Options > CSS:

.page-id-3034 .x-navbar .desktop .x-nav > li > a {color: #000;}

You need to replace 3034 i.e the id of page from above code. To find out page id, please refer following tutorial.

Thanks.

#3

Great, I’ll give it a try. Thank you

#4

Sure, let us know how it goes. :slight_smile:

#5

Thanks for the help. The solve isn’t taking working. I located the post ID and dropped this code into the CSS: .post-id-15 .x-navbar .desktop .x-nav > li > a {color: #1b75bb;}

When I navigate to the page, the menu text is still black like all the others instead of the blue hex I tried to assign to it. Any other thoughts? Thank you again.

#6

Hello @rpduffy,

Thanks for updating. :slight_smile:

Please update the code with following:

.post-id-15 .x-navbar .desktop .x-nav > li > a {color: #1b75bb !important;}

If you still face the issue, please share website URL for us to take a closer look.

Thanks.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.