Wordpress - 在父菜单项上维护“活动”类

时间:2013-12-17 05:02:10

标签: php wordpress menu

我正在Wordpress中实现一个主题。此主题有一个顶部导航菜单,每个父项下都有水平子菜单。它在当前查看的当前父项上放置一个“活动”类(否则它不会显示它的子子菜单项)。通过在functions.php中使用这两个函数,我以某种方式设法在当前父项上维护“活动”类。

/**
 * Wp Nav Menu Customizer.
 */
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);


class SH_Last_Walker extends Walker_Nav_Menu{

   function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ) {

        $id_field = $this->db_fields['id'];

       //If the current element has children, add class 'sub-menu'
       if( isset($children_elements[$element->$id_field]) ) { 
            $classes = empty( $element->classes ) ? array() : (array) $element->classes;
            $classes[] = 'has-sub-menu';
            $element->classes =$classes;
       }
        // We don't want to do anything at the 'top level'.
        if( 0 == $depth )
            return parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );

        //Get the siblings of the current element
        $parent_id_field = $this->db_fields['parent'];      
        $parent_id = $element->$parent_id_field;
        $siblings = $children_elements[ $parent_id ] ;

        //No Siblings?? 
        if( ! is_array($siblings) )
            return parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );

        //Get the 'last' of the siblings.
        $last_child = array_pop($siblings);
        $id_field = $this->db_fields['id'];

            //If current element is the last of the siblings, add class 'last'
        if( $element->$id_field == $last_child->$id_field ){
            $classes = empty( $element->classes ) ? array() : (array) $element->classes;
            $classes[] = 'last';
            $element->classes =$classes;
        }

        return parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
    }
}

但现在我的问题是,当我点击任何父菜单项的子菜单或子菜单时,它成功将我带到子页面,但从父项中删除“活动”类并将其放在子项上(因为它是当前查看的页)。我不希望它把这个课程放到孩子们身上,我希望无论什么时候看到孩子,都要在那里(在父项目上)。

非常感谢任何帮助。

3 个答案:

答案 0 :(得分:9)

如果您希望下拉宏祖父项在子菜单项处于活动状态时处于活动状态,那么您可以检查当前菜单 - 祖先或当前页面 - 祖先..在您的情况下,我认为当前菜单 - 检查是最有利的。

function special_nav_class($classes, $item){
     if( in_array('current-menu-item', $classes) || in_array('current-menu-ancestor', $classes) ){
             $classes[] = 'active ';
     }
     return $classes;
}

我希望这会有所帮助,祝你有个美好的一天:)

答案 1 :(得分:0)

如果您想要的是通过定位父元素来添加一些样式或其他属性,那么WordPress为您提供内置类,例如:

当您在子页面上时,您可以看到像current-menu-parent current-page-parent current_page_parent current_page_ancestor这样的类,这些类通过WordPress添加到父页面,您可以选择其中任何一个来定位父元素。

答案 2 :(得分:0)

当您单击子菜单项时,WordPress会将.current-menu-item类添加到该子菜单项,并将.current-menu-parent类添加到该子菜单项的父菜单项。您可以根据需要为那些特定的类设置样式。