• angler2010

    (@angler2010)


    I want to change the text color and also the background color of the wordpress custom menu.

    Site is based on a thesis theme however I wanted a vertical menu and it seemed the standard wordpress custom menu would suit. All fine until I wanted to change the colors of both the text and the menu tabs background to the same as the site backgrounds.
    I have tried a few entries in the style.css and also the custom.php of thesis with no real gain. Changing the thesis menu changes the top tab only and none of the others.

    site is new to wordpress and so am I.

    http://www.dalrymplesheetmetal.com.au

Viewing 2 replies - 1 through 2 (of 2 total)
  • govpatel

    (@govpatel)

    To change back ground if you theme options there should way to change backgrounds if not this is where you will find the css code
    http://dalrymplesheetmetal.com.au/wp-content/themes/thesis_18/custom/custom.css?031212-13433
    around line 29

    .custom .menu li > a {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 5px 5px 5px 5px;
    color: #000000;
    letter-spacing: 0;
    margin-top: 4px;
    padding: 3px 5px;
    text-shadow: 2px 1px #EEEEEE;
    text-transform: capitalize;

    Change #FFFFFF To #FAFFAD( same as your body backgound)

    To chnage font color change color: #000000 to what ever color you want.
    }

    Thread Starter angler2010

    (@angler2010)

    I managed to try a few different things using your comments and getting game enough to try. I figured I could always reload the custom.css file from my computer if all else fails.

    Code I used at the end of the custom.css file

    .custom .menu { border:none; background:#FAFFAD; height:28px; font-family:georgia; font-size:1.2em; }
    .custom .menu > li { margin-right: 8px; margin-left: 8px; }
    .custom .menu li > a { background: #FAFFAD; text-shadow:2px 1px #eee; color:#000;
    -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; padding:3px 5px;
    margin-top:4px; letter-spacing:0px; text-transform:capitalize; }
    .custom .menu > li.current > a { background: #FAFFAD; color:#00f; }
    .custom .menu > li a:hover { background: #1D0DFF; color:#FF0810; }

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘custom menu test color’ is closed to new replies.