Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
  • #5957

    i was woundering how to chang the menu description color (the little subline from a main point).

    i’d like to have the current and the hover the same color and the nonactive one always black.



    you can use following code in style1/2/3.css:

    .nav li a:hover, .nav li a:hover span, .nav li .current_page_item a span{
    color: #fff;

    You can change the color value of course :)


    since i only want to change the hover for the little span i insert the following code into the style1.css.

    .nav li a:hover span, .nav li .current_page_item a span{color: #8bbf00;}

    this is working for hovering.

    but now the currentpage is not logged in the menu. even the white main description is shown grey.

    how do i make them react right?


    Instead of:

    .nav .currentli_item a, .nav li a:hover{


    .nav .current-menu-item a, .nav li a:hover{


    i tried this and it works for fine for the main menu.

    to get it changed for the description also you have to enter the following snipped in the style1.css:

    .nav .current-menu-item a, .nav li a:hover{color:#fff;} /* main menu */

    .nav li a:hover span, .nav .current-menu-item a span{color: #8bbf00;} /* main menu description */

    thanks dude!


    for the little i-dot,

    how can i change the behaviour of the submenus according to there parrent page?

    i’d like to highlight the main menu item when you are at a so that you know in which menu point of the site you are.

    i tried something with

    .nav li ul.current-menu-ancestors a {color: #fff;}

    but this won’t work


    and how do i change the width of the submenu to 130px?

    best regards



    .nav .current-menu-ancestors a span {color: #fff;}

    #top .nav li ul a {
    width: 130px;

    #top .nav ul {
    width: 152px;


    .nav .current-menu-ancestors a span {color: #fff;}

    does not work – any other ideas?


    allright, i got this one!

    to highlight the parent menu item from a subpage enter the following code in your style.css or style1/2/3.css

    .nav .current-menu-parent a {color:#fff;} /* main menu */<br />
    .nav .current-menu-parent a span {color:#8bbf00;} /* main menu description */


    okay, last thing ;-)

    how can you get this behaviour working with post?

    whenever i show a simple post from the blog category i’d like to highlight the menu item that links to the blog.

    ir tried

    .nav .current-post-parent a {color:#fff;}

    with no result.


    I’m sorry – there’s no class which highlights the blog page of a post. I.e. it’s not possible to highlight “Blog” while you’re on “neuauflage”.


    thanks for the information.

    i found

    which tells you that it works, but i don’t know where to implement the code snippet for the menu.

    very last question for this whole subject.

    when hovering to a subpage (e.g. analysis) is it possible to keep the (buchvorstellung) highlighted?


    The tutorial: refers to the old wp_list_page function which was used before wp3 intoduced custom menus. Display uses: to generate the menus – unfortunately this tutorial is useless.


    how about this tutorial for the new menu system:

    any news for the hover parent effect?

    best regards


    hey dude i was thinking i found the solution to keep the blog menu item highlighted when reading a single post.

    into the wordpress 3 menu manager and tick show advanced settings.

    then you can add css-classes to each item of the menu.

    i add


    to the site that links to your blog.

    but it keeps highlighting it consistantly even when i am at another page

    i put the current hover effect to a new thread:


    Yes but it doesn’t work nevertheless. The problem is that wp doesn’t know which categories are part of the blog. It would require a custom function which determines all blog categories, all posts which are part of the blog and based on the result it checks if certain menu classes are required/can be set or not. Another solution would be to work with http referer but it’s a very case sensitive solution too. The only “easy” solution is to display an archive instead of the blog page because you can use:

    .current-post-ancestor {


    afterwards. The drawback is that you can display one category as blog only instead of severals or all (Display’s blog page). It doesn’t help to “hardcode” classes like “current-menu-parent” because WordPress needs to decide dynamically which classes are required and which not.


    hey dude

    #top .nav .current-post-ancestor a{color:#fff;}
    #top .nav .current-post-ancestor a span{color:#8bbf00;}

    works but whenever i go to the portfolio site the blog menu item is highlighted too.

    how do i exlude the portefolio category from this behaviour.

    best regards


    i think i found a solution but i need some advice.

    couldn’t it be solved by adding a conditional class to the blog menu item when show a single article.

    and then use .blog in the style.css to highlight the menu-item?

    but i don’t know how to connect

    <?php if (is_single()) { ?> class="blog"
    <?php }


    wp_nav_menu( array( 'menu' => 'First', 'menu_class' => 'nav', 'echo' => true,
    'fallback_cb' => 'displayfallbackSlider', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '',
    'depth' => 0, 'context' => 'frontend', 'walker' => new description_walker() ));

    best regards



    You can modifty it to be like this:

    'menu_class' => 'nav blog'

    This way your menu will be classed as both nav and blog and can therefore be styled with “.nav .blog”

    You should be able to do it by using the your if statement to either display

    // Menu Controlled by the Backend
    wp_nav_menu( array( 'menu' => 'First', 'menu_class' => 'nav', 'echo' => true,
    'fallback_cb' => 'displayfallbackSlider', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '',
    'depth' => 0, 'context' => 'frontend', 'walker' => new description_walker() ));


    // Menu Controlled by the Backend
    wp_nav_menu( array( 'menu' => 'First', 'menu_class' => 'nav blog', 'echo' => true,
    'fallback_cb' => 'displayfallbackSlider', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '',
    'depth' => 0, 'context' => 'frontend', 'walker' => new description_walker() ));

    So you’d do something like: if you’re on a single page you’d display menu x else you’d display menu y.


    thanks for the answer, but can you be a little more precise.

    what is the exact code to enter in the header.php.

    and will it really work? i tried it with ‘menu_class’ => ‘nav blog’ and the thing is that every menu item gets highlighted.

    which is logical because the code above means that every menu item gets the class “blog” in addition.

    maybe the correct solution will be to give the navigation element (menu-item-91 = my blog) a conditional class.

    how can you achieve this goal?

    best regards


    i found out another interessting thing.

    letting everything like it is and adding the following snippet into the style1.css

    .single li a {color:#fff;}
    .single li a span{color:#8bbf00;}

    changes all the menu items without using if then else double wobble menues in the header.

    if we can now get the only menu-item-91 using the css this topic should be solved



    finally i got this problem solved:

    i simply added the following snipped the style1.css

    .single li#menu-item-91 a {color:#fff;}
    .single li#menu-item-91 a span{color:#8bbf00;}

    works like a charm. take a look at the blog-page and click any post you want.

    the blog menu-item in the navigation keeps on being highlighted.

    if you want to use this too, make sure to find the right number of the div-id that links to your blog. mine is 91 yours might be different.

    best regards



    Glad that you found a solution :)

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

The topic ‘change menu description color’ is closed to new replies.