Menu color

[Light House]

I love that the dropdown menus have color and you can select the color for the whole menu. I was wondering if there was anyway to have each dropdown menu sport a different color. So if I have a couple subs under about, I’d want them to show up as one color and then all of the dropdowns under portfolio to have a different color than the ones under the about.

[Nexus]

Yeah, you can do that. Use the chrome developer tool to find out the id of the list item which has the sub-menu (ul) and set a background for it in the custom css of theme options like below

#menu-item-4039 .sub-menu {
background:  #0000ff;
}

#menu-item-4042 .sub-menu {
background: #ff0000;
}

See the screenshot for assistance. Of course your menu ids will be different 🙂 . Thanks!

[Light House]

Sorry,

just tried this, but I might not of been clear. The hover color, how do I change the hover color for each sub menu. keep the composite notebook feel on all of the menu’s but then change the color of the hover for each of the sub menus so the about hover is one color and then another menu group is a different highlight color.

thanks for the help!

[Nexus]

Can you send me a screenshot, so that I can be sure of what you need? Thanks!

[Light House]

the hover over color.

[Nexus]

Put the following code into custom css of the theme options and change to your needs.

#menu-item-3798:hover {
background:  #0000ff !important;
}

#menu-item-3800:hover {
background:  #ff0000 !important;
}

Again, for this you will have to use the chrome developer tools to see what is the menu item id for your menu items and change the code accordingly.

[Light House]

You are amazing! Thanks for the help!

[Author]

Posts