WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Change font colour in menu.

[Resolved] Change font colour in menu.

  • How do i change the menu font to red on my site originbmx.com

    I have tried putting font: #xxxxxx; in the #navigation: but its not working.

Viewing 12 replies - 1 through 12 (of 12 total)
  • It has something to do with the cufon settings…maybe check and see if there is an area to configure that how you want?

    dremeda

    @dremeda

    Sucuri Wizard

    Try changing:

    .nav a, .nav a:visited  { /* visited pseudo selector so IE6 applies text colour*/
    	color:			#444;
    }

    to

    .nav a, .nav a:visited  { /* visited pseudo selector so IE6 applies text colour*/
    	color:			#fff;
    }

    Make sure you make the change in the appropriate css file, in your case it looks like the /styles/grey.css

    Cufon allows for css changes, but it also allows for regular css selectors to be inherited from your stylesheet.

    Thankyou i have done it now 🙂

    Also how do i change the font size? i have tried putting font-size: 13px in the #navigation but its not working

    dremeda

    @dremeda

    Sucuri Wizard

    Try it in .nav a also.

    I cant get it to work and when i do it in em it changes the box height

    dremeda

    @dremeda

    Sucuri Wizard

    You’ll probably have to tweak a few different things there including #navigation-wrap. The unordered list used in the navigation will probably need to be adjusted as well.

    background: #f0f0f0;
    padding-left: 13px;
    width: 105.5%;
    }

    #sidebar {
    width: 235px;
    padding-top:65px;
    line-height:1.3;
    }

    #wrapper {
    background-color: #fcfcfc;
    padding-top:0px;
    padding-bottom:0px;
    padding-right:40px;
    padding-left:40px;
    border-radius: 4px;
    width: 880px;
    }
    body {
    margin-top: 11px;
    margin-bottom: 11px;
    border-radius: 4px;
    }
    #content {
    padding-top:70px;
    }
    #navigation-wrap {
    position: relative !important;
    width: 973px !important;
    margin: 0 auto !important;
    left: -0.8%;
    }
    #header {
    position: relative !important;
    width: 961px !important;
    left: -4.7%;
    }
    .nav a, .nav a:visited {
    /* visited pseudo selector so IE6 applies text colour*/
    color: #910d0d;
    font-size: 15px;
    }

    I have tried many ways and i just cant get it to work, you got any ideas?

    dremeda

    @dremeda

    Sucuri Wizard

    Code snippets posted into the forum should be short, otherwise please use Pastebin to attach.

    The font size is in fact hard coded into the Cufon functionality. In your theme directory navigate to theme/includes/js/cufon-customization.js and you will see in there:

    Cufon.replace('#site-title', { fontFamily: 'Gnuolane' });
    Cufon.replace('#navigation a', { fontFamily: 'Gnuolane', fontSize: '15px' });
    Cufon.replace('#footer-navi a', { fontFamily: 'Gnuolane', fontSize: '13px' });
    Cufon.replace('h1, h2, h3, h4, h5, h6', { fontFamily: 'Gnuolane' });
    Cufon.replace('#sidebar h3', { fontFamily: 'Gnuolane', fontSize: '15px' });
    Cufon.replace('#site-description', { fontFamily: 'Vegur' });

    Change the (‘#navigation a’) fontSize to whatever size you’d like:

    Cufon.replace('#site-title', { fontFamily: 'Gnuolane' });
    Cufon.replace('#navigation a', { fontFamily: 'Gnuolane', fontSize: '20px' });
    Cufon.replace('#footer-navi a', { fontFamily: 'Gnuolane', fontSize: '13px' });
    Cufon.replace('h1, h2, h3, h4, h5, h6', { fontFamily: 'Gnuolane' });
    Cufon.replace('#sidebar h3', { fontFamily: 'Gnuolane', fontSize: '15px' });
    Cufon.replace('#site-description', { fontFamily: 'Vegur' });

    Thankyou i have done it now 🙂

    Thanks Dre – was out this morning. Good work sir!

    dremeda

    @dremeda

    Sucuri Wizard

    Cheers!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Resolved] Change font colour in menu.’ is closed to new replies.
Skip to toolbar