Changing the Colour of my Nav bar

Hey Lizzy, unfortunately I learned that wordpress forum do not support other themes besides the default themes. The Nav bar, are you talking about the menu bar? Like where your “Home” bar is?

Hi, oh i had not realised that ?? thanks.

yes, i mean the menu bar below the header panel.

i can change the top menu, but really cannot figure out how to change the other one.

I hope you can still help me please?

You should be able to do this by modifying the file MenuMatic.css of your theme. The path to the file on your hosting account would be public_html/wp-content/themes/TravelZine/menu/MenuMatic.css. The code that you need starts around line 88 and looks like this:

#nav li {
    background-image: url("../img/mainnav-sep.gif");
    background-position: 100% 5px;
    background-repeat: no-repeat;
    cursor: pointer;
    display: inline;
    float: left;
    height: 50px;
    margin: 0 2px 0 0;
    padding: 0 2px 0 0;
}

Put an attribute for the color (e.g. background-color: green;), so that the code looks like this:

#nav li {
    background-image: url("../img/mainnav-sep.gif");
    background-position: 100% 5px;
    background-repeat: no-repeat;
    background-color: green;
    cursor: pointer;
    display: inline;
    float: left;
    height: 50px;
    margin: 0 2px 0 0;
    padding: 0 2px 0 0;
}

Then clear the browser cache and refresh the frontend of your site.

Hope this helps.

@hostknox – won’t those changes will be lost when the theme is updated? It’s generally much better advice to use custom CSS or a child theme.

@hostknox, please see WPyogi’s response here: https://www.ads-software.com/support/topic/change-color-of-dropdown-menu-1?replies=6#post-4702787

WPyogi, they most certainly will. Thank you for the note.

Here’s more info on child themes:

https://codex.www.ads-software.com/Child_Themes

Thanks for the help here everyone.

yeah i have read a few of those posts thanks, and now know that i need to update the custom css plug-in to avoid update issues down the line. i have downloaded this, but i have no idea what code to add in the custom css plugin to make this work – i could not find this information anywhere?!

i don’t really want to have to change the css file if i can help it.

can anybody help me with the code i need to use in the custom css manager plugin please?

If you need it urgently and are not receiving support as fast as you’d like then it may be worth asking for help from https://jobs.wordpress.net or https://directory.codepoet.com .

www.ads-software.com is driven by volunteers, which can mean that some threads are never answered.

Thats great, thanks for your help ??