wp_nav_menu walker类子菜单仅在父页面上显示

Question

我已经搜索过，无法找到一个自定义的“Walker”类，它将隐藏wp_nav_menu中的子菜单，直到您在父页面上。我已经找到很多方法来隐藏它们或只是显示子菜单但不是一种只在你处于该部分时显示子菜单的方法。以下是我需要显示的示例：

目前的Wp_nav_menu结构：

• 家长1
• 家长2
  • 儿童1
  • Child 2
• 家长3
  • 儿童A
  • Child B

- 显示 -

父母1 /主页：

• 家长1
• 家长2
• 家长3

在父2和父2子页面上：

• 家长1
• 家长2
  • 儿童1
  • Child 2
• 家长3

Answer 1

您不需要自定义walker来执行此操作，可以使用CSS类完成，并显示：none;

e.g。你可以从：

开始

.menu .sub-menu { display: none; }
.menu .current-menu-item .sub-menu { display:block; }
.menu .current-menu-ancestor .sub-menu { display:block; }

使用一些额外的规则，基于应用于body标签的类，您可以有条件地显示和隐藏其他菜单项，使用通过后端添加到菜单项的类。

Answer 2

在我看来，使用CSS来“隐藏”不需要的菜单级别充其量是麻烦的，最糟糕的是有点'hacky'。就个人而言，我从不喜欢向不应该存在的页面输出任何内容（无论如何都可以避免）。

Wordpress目前没有给我们任何好处，因为他们没有提供wp_nav_menu内置的选项来限制菜单的起始深度。

我尝试过不同的步行器，小部件和插件来解决这个问题，但我对我尝试过的解决方案一直很满意。例如，上面插件中的解决方案要求您传递所需子菜单的ID。

我编写了自己的插件，扩展了wp_nav_menu以添加'start_depth'选项。这可以在任何子页面上自动运行，而无需指定任何内容。

安装插件后，只需使用这样的代码：

wp_nav_plus(array('theme_location' => 'primary_navigation', 'start_depth' => 1));

对于任何有兴趣的人都可以在我的网站上找到：https://mattkeys.me/products/wp-nav-plus/

Answer 3

上面的答案是正确的 - 您可以使用css执行此操作，但菜单在技术上仍然“存在”。如果你想完全消除 - 你可以使用我写的插件 - here。

请评价并确认它有效 - 我刚刚在几天前发布了它。我已经在几个网站上使用过它了。我的第一个插件：）