WordPress - 将.active类添加到活动菜单项的子页面?

时间:2016-02-26 06:47:50

标签: php css wordpress

以下wp_nav_menu存在问题:

Nav.php:

    $arg = array(
        'container' => false,
        'menu_class' => 'nav navbar-nav navbar-right'
    );
    wp_nav_menu($arg);

的functions.php:

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;
}

输出:

<ul id="menu-quinn-menu" class="nav navbar-nav navbar-right">
<li id="menu-item-15" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-15"><a href="http://xxx/">Home</a></li>
<li id="menu-item-14" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item current_page_parent menu-item-14 active "><a href="http://xxx/work/">Work</a></li>
<li id="menu-item-13" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-13"><a href="http://xxx/shop/">Shop</a></li>
<li id="menu-item-12" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-12"><a href="http://xxx/contact/">Contact</a></li>
</ul>

您可以在作品active中看到课程li,但当我转到工作(父母)的子页面时,输出:

<ul id="menu-quinn-menu" class="nav navbar-nav navbar-right">
<li id="menu-item-15" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-15"><a href="http://xxx/">Home</a></li>
<li id="menu-item-14" class="menu-item menu-item-type-post_type menu-item-object-page current_page_parent menu-item-14"><a href="http://xxx/work/">Work</a></li>
<li id="menu-item-13" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-13"><a href="http://xxx/shop/">Shop</a></li>
<li id="menu-item-12" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-12"><a href="http://xxx/contact/">Contact</a></li>
</ul>

再看工作active中的课程li

我在工作active的子页面中如何获得li的任何想法?

1 个答案:

答案 0 :(得分:2)

尝试更改您从functions.php文件中粘贴的块:

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;
}

为:

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

或者,您也可以使用CSS并选择current_page_parent,因为Wordpress会自动将该类添加到页面的父级。