WordPress 5.7

Question

我有一个基本菜单，有些菜单项有子菜单。我对wordpress的经验很少，没有时间深入研究细节。所以我的问题是，当用户导航到其中一个子菜单页面时，突出显示顶部菜单项的最简单方法是什么。（我尝试使用javascript和纯css按元素id设置颜色属性，并使用“current-cat-parent”类但不起作用）。
非常感谢任何帮助。

注意：我使用的是名为chameleon的主题。

Answer 1

您可以将current-menu-item类分配给.current-menu-ancestor类，如

.main_menu li.current-menu-item a, .main_menu li.current-menu-ancestor a{
    color: #777777 !important; /* highlight color */
}

它将突出显示父页面菜单

请参阅this page

Answer 2

您可以在关闭正文标记之前的主题footer.php文件中插入以下代码。

<!-- Highlight parent page link when on child page -->
<?php if (is_page()) {   //  displaying a child page ?>
    <script type="text/javascript">
        jQuery("li.current-page-ancestor").addClass('current-menu-item');
    </script>
<?php } ?>

这就是它在PHP中的优点所以代码的动态。它的作用就是添加另一个本地WordPress nav li类，使当前页面的链接处于活动状态。

我在这里写了一篇简短的帖子，解释它是如何运作的：How to keep parent page navigation link highlighted when viewing a child/sub page！

如果您对此有任何疑问，请随时与我们联系。

Answer 3

有趣。您的解决方案突出显示了父级，但不是当前子级。但它让我走上正确的道路，最终，这就是我所需要的。

li.current-menu-parent >a, .current-menu-item >a {
    color: red !important;
}

Answer 4

.current-menu-ancestor对我不起作用。 .current-page-ancestor做到了。

Answer 5

这对我有用。以下CSS将使您可以设置活动菜单的样式...直至三个菜单的深度。

.current-menu-ancestor{ background:RED !important; }
.current_page_parent{background:GREEN !important;}
.active{background:YELLOW !important;}

代表当前活动页面的菜单按钮将是黄色
如果代表当前活动页面的按钮被嵌套，则其父项将为GREEN ...，否则菜单上的“顶层”按钮将为GREEN。
最重要的是（无论在其中出现多少层嵌套您的菜单）具有 .current-menu-ancestor 类的任何元素将以红色背景为样式。

还可以仅设置 .current-menu-ancestor 的样式，并且将设置任何父菜单项的样式。

Answer 6

WordPress 5.7

经过测试并有效，2021 年

2021 年。如果你们中的任何人仍在寻找解决方案，那么就在这里。

这将突出显示父级及其子级。如果没有子菜单，则父菜单将突出显示。请记住 !important 是必需的。

.current-menu-parent > a,
.current-menu-item a { 
    color: blue !important; /* Important is required */
}

Answer 7

我在编辑时有点问题，但找到了一个简单的解决方案。我正在使用Wordpress Storefront主题，只需将其粘贴到您的子主题的style.css文件中：

li.current-menu-parent >a {
  color:red !important;
}

Wordpress - 选择/加载子菜单项页面时突出显示父菜单项

7 个答案:

WordPress 5.7