Change Navigation Bar Font

  • Author
  • #2327075

    I would like the font of my navigation bar to be the same as my header font (minion pro) as opposed to body text font (le monde journal). I have tried to override this with custom CSS but it doesn’t seem to be working.

    Any help would be much appreciated.

    The blog I need help with is


    Hi there, in your custom CSS, replace your existing #access a rule with the below.

    #access a {
        font-family: minion-pro-1,minion-pro-2,"Helvetica Neue",Helvetica,Arial,sans-serif;
        font-size: 15px;
        font-weight: 500;


    Thank you for the reply. I updated the css with the code you provided but it doesn’t seem to be showing up correctly. The section headers appear as Minion Pro but the navigation bar text looks like Arial.

    I am confused as to why the section headers can display Minion Pro correctly but the navigation bar defaults to Arial?


    Hmmm, so strange. Apparently we have to declare a few other things in the rule in order for Minion to be applied. This only seems to happen on Safari and Chrome, not on Firefox. Use the following instead.

    #access a {
    font-family: minion-pro-1, minion-pro-2, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: italic;
    font-variant: normal;


    For whatever reason, it doesn’t seem to be working. It’s okay — not a big deal. Thanks for taking the time to help, anyway :)


    When you didn’t see the font, was that only in the Customizer, or did you save and check your actual site? You may want to add the code back in and save and then view your site and clear your browser cache. It’s possible it is a caching issue.

The topic ‘Change Navigation Bar Font’ is closed to new replies.