Menu text color

  • Unknown's avatar

    Hello

    I have tried all combinations and do not seem to be able to alter the color of my menu text through CSS. I have established how to hide it… Not particulalry helpful, but I cannot change the color.

    I wold be grateful if someone could provide me with the identifier for my menu.

    https://newmotionfitness.com/

    Thanks

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Hi,

    The below code would do the needful
    #wrap #header .menu a, #wrap #header .menu a:link{
    color:red;
    }

    You can use the web inspector built into the browser to find the relevant CSS. If you are not familiar with the web inspector in your browser, please follow the below steps.

    Web Inspector Basics

    These three basic steps will work in most current browsers to open the web inspector:

    Right-click on a web page element
    In Safari, go to Preferences > Advanced and enable the Develop menu first.
    In Internet Explorer 10, go to Tools > F12 Developer Tools instead.

    Select the “Inspect Element” option
    Look for a panel at the bottom of the screen
    The panel will show the HTML for the element you clicked as well as all the CSS that applies to it. You can click on different HTML elements in the panel and then look at the CSS on the right to figure out what CSS changes you need to make.

    Having said that, this forum only supports the sites hosted on WordPress.com. Please post your question on the WordPress.org support forum henceforth: https://wordpress.org/support/

    Both(WordPress.com and WordPress.org) are different products. You can find out the differences between them here: https://en.support.wordpress.com/com-vs-org/

    Thank you.

  • Unknown's avatar

    Hello, I am currently using wordpress.com, however it is on the premium account and therefore provides me with access to custom css :). My site is also hosted on wordpress.com.

    Thank you for your response! It does sort of work. When in the custom css screen, the viewer shows that the header font has changed colour, however when navigating on the live website, the font is either black, or changes from black to white sporadically.

    Is this the theme interfering with the css? Or some other issue?

    Thanks again for the help. Really appreciated!

  • Unknown's avatar

    Hello henrynewmotion,

    All what iamrishaan said is correct, but regarding the colour change, it happens when you click on the links (home, about, pricing, etc.) so visiting a page changes it.

    Maybe this short code might be enough for you:

    .page a, .page a:link, .page a:visited {
    /* color: */
    }

    The color you can set to whatever you want for the visited link or remove the function all together.

    Hope this helps you a bit. For further assistance just leave a comment.

    All the best,

    Sander

  • Unknown's avatar

    Hello Sander

    Thanks for your quick response.

    My issue relates just to permanently changing the colour of the texts. Haha.

    Both of your suggestions work perfectly for their purpose, but how do I permanently change the text colour.

    Thanks again!

  • Unknown's avatar

    Hi again

    It has to then be the same code that was in the first answer.

    #wrap #header .site-title a, #wrap #header .menu a, #wrap #header .menu a:link {
    color: #48e022;
    }

    Just put that into your custom CSS and change the colour to what you want. This should change all the menus to the colour you want.

    Not 100% sure but it seemed to work for me.

    All the best and hope this is what you were looking for.

  • Unknown's avatar

    Hello again,

    Thanks for your response!

    It does change some of the menu items! Thank you very much.

  • The topic ‘Menu text color’ is closed to new replies.