Change font colors in Structure Theme

  • Author
  • #927809


    I’m trying to change the font colors of headers and the nav bar links in my structure theme CSS editor. I figured out how to change the body text, but I’m not sure about the others. Any help is appreciated. Thanks!

    The blog I need help with is


    Menus: The first is the non-current, non-hover color, the second is the color when hovered, and the third is the color for the current page menu item. I included the border color declarations as well in case you wish to change those too.

    .ot-menu a, .ot-menu a:visited {
    color: #999999;
    .ot-menu a:focus, .ot-menu a:hover, .ot-menu a:active {
    border-color: #FFFFFF;
    color: #FFFFFF;
    .ot-menu .current_page_item a {
    border-color: #FFFFFF;
    color: #FFFFFF !important;

    When you say, “header” which are you talking about? Post titles, widget titles, page titles, etc?


    The nav worked, thank you! I guess I would want to change all of those options that you listed to clarify “header”. Is there a way to do that all in one line, or do I need to specify each one separately?


    Here are two different examples for you to work with:

    First, this will attempt to change the color for ALL headings. It’s pretty agressive and might change more things than you want:

    h1 a,
    h2 a,
    h3 a,
    h4 a,
    h5 a,
    h6 a {
    	color: palevioletred !important;
    h1 a:hover,
    h2 a:hover,
    h3 a:hover,
    h4 a:hover,
    h5 a:hover,
    h6 a:hover {
    	color: hotpink !important;

    Or you could be more selective and try to change just post titles, page titles, and widget headings in the sidebar like this:

    .posttitle h3,
    .post h3 a,
    #sidebar_right h4,
    #sidebar_left h4 {
    	color: palevioletred !important;
    .post h3 a:hover {
    	color: hotpink !important;

    Try them out and see which one you like best. Adjust the color code as necessary.


    Thanks so much! I also downloaded Firebug which helped me figure out what the div and class names were for each element….can’t believe I didn’t think of that before. Oh well, live and learn!


    Firebug is awesome! Firefox actually has a separate web inspector built in now. Most of the current stable browser versions have it too.

The topic ‘Change font colors in Structure Theme’ is closed to new replies.