自定义分类的活动菜单条目 - Wordpress

时间:2012-05-21 18:15:06

标签: wordpress taxonomy

我有自定义帖子类型和自定义分类。每个自定义帖子类型仅分配给一个术语。我在自定义分类中为每个术语添加了一个菜单项。每个菜单条目的后面都是一个概述页面,其中包含分配给该术语的所有自定义帖子。如果您点击其中一个海关帖子,则会打开详细信息页面。但是,如果您在详细信息页面上,则分类术语的相应菜单条目不再标记为活动。我究竟做错了什么?

4 个答案:

答案 0 :(得分:3)

好的,我为我的问题找到了以下解决方案:

add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);

function special_nav_class($classes, $item) {
    global $naventries;
    $naventries[$item->ID] = $item;
    if($item->type == 'taxonomy') {
        global $post;
        $terms = get_the_terms($post->ID, $item->object);

        $currentTerms = array();
        if ( $terms && ! is_wp_error( $terms ) ) {
            foreach($terms as $term) {
                $currentTerms[] = $term->slug;
            }
        }

        if(is_array($currentTerms) && count($currentTerms) > 0) {
            $currentTerm = get_term($item->object_id, $item->object);
            if(in_array($currentTerm->slug, $currentTerms)) {
                $classes[] = 'current-menu-item';
            }
        }
    } 

     return $classes;
}

但仍有一个问题。我还想将类 current-menu-ancestor 添加到父元素。我通过$item->menu_item_parent获得了父元素的id,但是我不知道如何在此时使用这个id来更改相应菜单项的类?

答案 1 :(得分:0)

<script type="text/javascript">
    // Active state if you have a pagetitle on the result page
    var currentTitle = $('.header h2').html();
    $('.nav ul.menu li').find(':contains('+currentTitle+')').parent().addClass('current-menu-item');
</script>

因此,如果您的页面标题与菜单项同名,则我的解决方案有效 您想将课程current-page-item添加到。

当然,你需要安装jQuery来实现这个目的。

编辑:确保将其放在归档分类页面上的循环下。

答案 2 :(得分:0)

你可以通过jquery来实现:

<script type="text/javascript">
    $(document).ready(function(){
        var title = $(document).attr('title');

        $(".maincat-list li a:contains('"+title+"')").css("text-decoration", "underline");

    });
</script>

答案 3 :(得分:0)

我一直在努力解决这个问题。这就是我解决问题的方法。

  1. 进入wordpress后端 - &gt;外观 - &gt;菜单
  2. 将一些自定义类添加到您希望在分类或归档页面上激活的菜单项(如果您没有看到css类选项转到屏幕选项并激活它)。例如,我将类“激活”放在菜单项上。
  3. 转到archive.php或taxonomy.php或您正在使用的任何模板,并为刚刚添加的.active类添加一些样式,例如:
  4. <style>
    .menu li.active {
    background-color:#000;
    }
    </style>
    

    当然,您可以使用其他方法将css注入存档页面。