[terry wParticipant]

Hi,

When I hover over a primary menu item a little red bar appears over it to show the selection, this is the default for the theme. Normally I would go to the stylesheet and change the color but I can’t find where to change the color.

[SupportMember]

You would search the CSS file for the following line of code:

.x-navbar .x-nav > li > a:hover, .x-navbar .x-nav > .current-menu-item > a

Set the box-shadow and -webkit-box-shadow options to a different hex color, or to none for no bar.

[terry wParticipant]

perfect, thanks

[ChristianModerator]

You’re welcome Terry.

[verjanocommParticipant]

Hey, I had the same question about changing the navbar’s accent color and tried finding the aforementioned code in my CSS stylesheet (the one under Editor > Stylesheet.CSS). Only problem is that my stylesheet is blank. When I try overriding the code, it doesn’t work – it stays red. Anyway you can help me out with this?

I’m using the light version of the Integrity stack. Here’s the site I’m working on: http://verjanocommunications.com/MSG/

Let me know what info you need me to provide. Thanks in advance!

[GrumpyParticipant]

Have you tried just adding the modified css to your Custom CSS? From the WordPress admin menu go to Appearance > Customize. From the Customize panel look for the “Custom” tab. Place your modified css in the Custom CSS field.

The css to paste in would look like this:

.x-navbar .x-nav > li > a:hover, .x-navbar .x-nav > .sfHover > a, .x-navbar .x-nav > .current-menu-item > a {
  -webkit-box-shadow:PINK 0 4px 0 0 inset;
  box-shadow:PINK 0 4px 0 0 inset;
}

Just change PINK in the above example to a named or hex colour of your choice, i.e. #ff6600

[ChristianModerator]

Thanks for sharing Grumpy. Hope that helps Verja.

[verjanocommParticipant]

Hey guys, thanks for the quick reply. I tried that but oddly enough it only worked when I hover over menu items that have sub-menus. The rest stay red, whether it’s the selected link accent or hovering over non-sub-menu items. Any other suggestions?

[verjanocommParticipant]

I take that back, it works now! I originally added it to the Stylesheet instead of where you actually told me to place it (under Customize). Note to self: Read instructions thoroughly beforehand. Thanks!

[CousettMember]

Glad you were able to figure it out. 🙂 Have a nice day.

[Author]

Posts