Setting Current Nav Menu Item color…

Community Forums Forums Design Tips and Tricks Setting Current Nav Menu Item color…

This topic is: resolved

This topic contains 4 replies, has 2 voices, and was last updated by  Terry 11 months, 3 weeks ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #55000

    Chris Moore
    Participant
    Post count: 136

    Hello!

    Just upgraded to Genesis 2.0 and eleven40 Pro and I have been doing my customizations. I’m a little bit tired from working on it all last night, so I thought I would just reach out to all of you about this one easy thing I am having trouble with.

    I would like to do two things:

    1.) I would like the current nav menu item to be color: #222;
    2.) I would like the current category nav menu item to also be color: #222;

    Here’s the site: Reflect On This

    Thanks for your help!


    Resepctfully, Chris Moore
    Web Dev, CSS Hacks, & Biz Consulting @ MooreCreativeIdeas.com / Blogging @ ReflectOnThis.com

    http://reflectonthis.com
    #55123

    Terry
    Participant
    Post count: 75

    It looks like changing around line 1757 to
    .eleven40-pro-blue .genesis-nav-menu a {
    color: #222;
    }
    should do the trick.
    It does impact your hover (which you’ll loose b/c it’s set at #222).

    Hope this helps.


    Customizing Genesis Child Themes @ MaroonTech

    #55134

    Chris Moore
    Participant
    Post count: 136

    Thanks for your reply @maroontech, but maybe I should have been clearer. I meant the color of the nav menu item when you are ON that page. I want to keep the menu items blue, the hover as #222, and then the current page/category you are on as #222 as well.

    I think this is the selector that I was hunting down:

    .eleven40-pro-blue .genesis-nav-menu .current-menu-item > a

    I will give this a try…


    Resepctfully, Chris Moore
    Web Dev, CSS Hacks, & Biz Consulting @ MooreCreativeIdeas.com / Blogging @ ReflectOnThis.com

    #55135

    Chris Moore
    Participant
    Post count: 136

    Yep, I figured it out! That one did the trick.. This is the one I was looking for:

    .eleven40-pro-blue .genesis-nav-menu .current-menu-item > a

    It’s live on the site now…

    ONE REMAINING QUESTION:

    How do I get the nav menu to be #222 when I am reading a post that is in a particular category?

    So, if I am reading this post (linked here), how do I get the “Spirituality” secondary nav item to light up with #222?

    I suppose this requires doing some custom PHP work. But I will put it out there… I’m sure it’s easy. I just don’t know how to do it! :-)


    Resepctfully, Chris Moore
    Web Dev, CSS Hacks, & Biz Consulting @ MooreCreativeIdeas.com / Blogging @ ReflectOnThis.com

    #55231

    Terry
    Participant
    Post count: 75

    Sorry Chris, I totally missed that. Too much good coffee yesterday.

    You should just be able to target the css, something like…

    .nav-secondary .current-post-ancestor a {
    color: #222; (I always pick something crazy like red to test)
    }

    (instead of .current-post-ancestor could try .current-post-parent, .current-menu-ancestor, .current-menu-parent)

    Let me know if that works for you. I tested it on one of my blogs and it did the trick.
    TGIF!


    Customizing Genesis Child Themes @ MaroonTech

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.