Adding .active class to active menu item

  • Resolved AD7863

    (@ad7863)


    11 years, 6 months ago

    Hello, I am aware that the class .current-menu-item is added to active menu items, instead, I would like to add the class .active. How would I go about doing this?

    I’ve been told I have to put this in my functions.php file, I just don’t know to test if the link is active e.g. is_active() or something..?

    Any help will be appreciated, thanks.

    add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
function special_nav_class($classes, $item){
     if( put something here ) ) ){
             $classes[] = 'active ';
     }
     return $classes;
}
Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator keesiemeijer

    (@keesiemeijer)

    11 years, 6 months ago

    Try it with this:

    add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
function special_nav_class($classes, $item){
     if( in_array('current-menu-item', $classes) ){
             $classes[] = 'active ';
     }
     return $classes;
}

    Thread Starter AD7863

    (@ad7863)

    11 years, 6 months ago

    It worked. Thanks so much.

    Moderator keesiemeijer

    (@keesiemeijer)

    11 years, 6 months ago

    No problem 🙂

    poco06

    (@poco06)

    10 years, 11 months ago

    Hello,

    Can you tell me where you placed this code within your function.php file? I have the same issue and would like to use the active menu position.
    Many thanks
    Pat

    Thread Starter AD7863

    (@ad7863)

    10 years, 11 months ago

    Hey, I have long since abandoned WordPress and transferred my blog to Jekyll.

    You can put that snippet anywhere in your functions.php file before the closing ‘?>’ though I think.

    tonety_bcn

    (@tonety_bcn)

    10 years, 10 months ago

    Hello,

    My menu item “Blog” does not look as .current in single post, archive, category.

    http://www.barcelonawebstudio.com/blog

    Please, does anyone know how to fix this problem?

    This is how my header looks like:

    <?php

    /* wp_nav_menu( array(
    ‘container’ =>false,
    ‘menu_class’ => ‘nav’,
    ‘echo’ => true,
    ‘before’ => ”,
    ‘after’ => ”,
    ‘link_before’ => ”,
    ‘link_after’ => ”,
    ‘depth’ => 0,
    ‘walker’ => new description_walker())
    ); */

    if ( has_nav_menu( ‘header-menu’ ) ) {
    wp_nav_menu( array( ‘theme_location’ => ‘header-menu’, ‘container’ => ‘false’, ‘menu_id’ => ‘nav’, ‘depth’ => ‘5’, ‘fallback_cb’ => ‘wp_page_menu’, ‘items_wrap’ => ‘<ul id=”%1$s” >%3$s’, ‘walker’ => new description_walker()) );
    } ?>

    You’ll have to forgive me, I’m fairly new at this and am learning as I go along. Your help is greatly appreciated.

    Thanks in advance ;))

    Best regards from Barcelona,

    tonety_bcn

    iceolemune

    (@iceolemune)

    10 years, 7 months ago

    I’m having a problem with my custom theme not adding a custom class to my menu on the initial wp load (first page load).

    I’m using the code mentioned above:

    add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
function special_nav_class($classes, $item){
     if( in_array('current-menu-item', $classes) ){
             $classes[] = 'active ';
     }
     return $classes;
}

    Which works nearly perfectly. But when I visit my site it automatically goes to the “home” page by default, but because there appears to be no page_id or anything mentioned in the $_GET, no active css class is applied to any menu items. If I navigate the site from here via my menu, the active class is added normally.

    How do I apply my active css class to the main page by default? Or to the default page that’s loaded if this can be specified?

    Any feedback would be appreciated. Thanks.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Adding .active class to active menu item’ is closed to new replies.