WordPress.org

Ready to get started?Download WordPress

Forums

Change color of menu items on menu bar (4 posts)

  1. jderouen
    Member
    Posted 1 year ago #

    My website is at http://joederouen.com

    I'm using the Twenty-ten theme, v1.4. The main menu that has "Home" "About Joe" etc. in it, I want to be able to change the color of some of the entries - specifically, Small Things, ST 2: Threads, Memories of a Ghost, and Leap Year. Those are my fiction titles and I want to make them stand out, but for the life of me I can't figure out how to do this. Right now, I have | in front of Small Things and behind Leap Year, which does serve to separate them a bit, but it looks clunky. How can I make the fiction titles be a different color, say light green?

  2. Pioneer Valley Web Design
    Member
    Posted 1 year ago #

    Since you are using this theme, each menu item has a unique style associated with it...for 'Small Things' we see in the source code:

    <li id="menu-item-506" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-506"><a href="http://joederouen.com/?page_id=4">| Small Things</a>

    So we can create a style for "menu-item-506":

    #menu-item-506 a {background-color: #00FF00}

    This CSS edit is best done in a child theme.

  3. jderouen
    Member
    Posted 1 year ago #

    Do I add that to style.css in the child theme directory? Where do I add it? Thank you!

  4. Pioneer Valley Web Design
    Member
    Posted 1 year ago #

    Once you have properly set up and activated the Child Theme, add this to the very bottom of it:

    #menu-item-506 a {background-color: #00FF00}

Topic Closed

This topic has been closed to new replies.

About this Topic