How to change menu color in wordpress twentyten theme



Changing the menu color of twentyten wordpress theme gives a new look to complete site. This is very easy and can be easily done if you are familier with firebug tool. I am getting mails asking how to change the color of menu bar of wordpress twenty ten theme. So I thought of writing a post which can help everyone.  let us see how to change the color of wordpress twenty ten theme.

Login to your wordpress Dashboard

Go to Appearanace ->Editor ->style.css

Check for the blow part of the code and change the value of #000 to your desired value. You can use this site to pick up color.

So are to change the tect color, find the below code and change as shown in the figure

So as to change the color of drop down menu,  and for hover color ( mouse over color ) search for the below code and replace with your desired color.

Please let me know if you face any problems.

Comments

  1. Gary Smith says:

    Hi Aswin-
    I found your site and learned how to change the colors, but I also
    wanted to change the color of the menu tab for the current
    accessed page. I kept changing a few things and finally got the
    text color to change for the current page tab so I knew I was in
    the right area of code. I noticed just above that there was an
    extra line of code for background color so I copied it and added
    it to the #access ul li.current-menu-parent > a
    See below:
    #access li:hover > a,
    #access ul ul :hover > a {
    background: #7BB9B6; ul {
    display: block;
    }
    #access ul li.current_page_item > a,
    #access ul li.current-menu-ancestor > a,
    #access ul li.current-menu-item > a,
    #access ul li.current-menu-parent > a { Did a return and pasted it here
    background: #6ACBBA; <- this gave me a value for the
    color: #fff; different color of the current page

    Hope this adds to the knowledge base!
    Gary

  2. Hi Aswin

    Thanks for your post!

    Just wondering, do you know how to change the hover colour for the horizontal navigation menu buttons (under the header – with ‘About Me” etc). I only want to change the hover colour for this, not for the rest of the site.

    Would appreciate any assitance you might be able to give here!

    Cheers
    rolanstein

  3. parmjeet says:

    Nice Post thanks.

  4. Thank you for this – I was able to change the colours but I was wondering if I could change the font of the menus and the width of the columns.

    Thanks.

Speak Your Mind

*


+ five = 11