【问题标题】:Wordpress Menu - Active Class Not WorkingWordpress 菜单 - 活动类不工作
【发布时间】:2015-01-19 17:58:55
【问题描述】:

我正在更改 WordPress 主题“反转”的样式。

由于某种原因,菜单中的活动类对每个网页(它具有背景蓝色属性)页面都很好,但博客的子页面除外。你可以在这里看到。

http://www.branchingouteurope.com/BOE2014/
http://www.branchingouteurope.com/BOE2014/
http://www.branchingouteurope.com/BOE2014/blog/
http://www.branchingouteurope.com/BOE2014/blog/lead-generation-app-of-the-month-jan/

链接到菜单的样式在样式表中如下:

#skenav ul li.current_page_item > a,
#skenav ul li.current-menu-ancestor > a,
#skenav ul li.current-menu-item > a,
#skenav ul li.current-menu-parent > a { background-color:<?php if(isset($bg_color)){ echo $bg_color; } ?>;color:#fff;}

这里的任何帮助将不胜感激

【问题讨论】:

    标签: wordpress


    【解决方案1】:

    应用背景的样式当前以 .current_page_item 类为目标 - 所以只是当前页面。要将其也应用到子页面,也可以使用相同的样式定位 .current_page_parent,如下所示:

    #skenav ul li.current_page_item > a, #skenav ul li.current_page_parent > a, #skenav ul li.current-menu-ancestor > a, #skenav ul li.current-menu-item > a, #skenav ul li.current-menu-parent > a {
        background-color: #17bfdc;
        color: #fff;
    }
    

    这些类应该是开箱即用的(只需使用 invert lite 进行检查)。但是您可以使用过滤器将自己添加到单个博客文章中的博客菜单中,如下所示:

    function add_page_parent_to_single( $classes, $item ) {
        if ( is_single() && $item->title == 'Blog' ) {
            $classes[] = 'current_page_parent';
        }
        return $classes;
    }
    add_filter( 'nav_menu_css_class', 'add_page_parent_to_single', 10, 2 );
    

    虽然它可以解决 - 我真的不喜欢这样按名称引用菜单。

    【讨论】:

    • 我已尝试按照您的建议将 .current_page_parent 类添加到样式表中,但它似乎并没有改变任何东西。我可能做错了。我发现更改菜单的 CSS 文件不是标准的“样式”CSS 文件,而是在此处找到的 PHP 文件中 branchingouteurope.com/BOE2014/wp-content/themes/invert/…
    • 奇怪的是这些类现在没有被应用。您使用的是标准的 Wordpress 菜单系统吗?还有其他代码修改它吗?
    • 我使用的是标准的 Wordpress 菜单系统。奇怪的是,“服务”子页面似乎将父样式应用于菜单,例如 link 它仅在“博客”子页面上未应用父页面样式。
    • 帖子与其他帖子的子页面不同,但它们仍应具有该类-我检查了 Invert lite 的香草安装,它没有同样的问题。可能有其他东西影响了菜单 - 我已经用过滤器更新了上面的内容,您可以使用它来添加类作为解决方法。
    • 我已经添加了该功能并且它有效。谢谢!一定是我做过的事情。希望我和你一样了解前端代码。非常感谢。我每天都在尝试更多地了解前端开发 - 按名称引用菜单有什么缺点?
    猜你喜欢
    • 1970-01-01
    • 2011-12-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-06-17
    • 1970-01-01
    相关资源
    最近更新 更多