Question

例如，在我的wordpress导航菜单设置中，如下所示。

主页
关于我们
- 我们是谁？
- 我们做什么？
服务
- 网站开发
- 网页设计

在所有这些菜单和子菜单上，我为每个菜单和子菜单设置了页面链接，以便用户可以随意浏览它们。

但是当我使用本教程中讨论的Bootstrap navwalker php插件时 http://www.pattonwebz.com/wordpress-custom/bootstrap-wordpress-responsive-menu/

关于我们和服务的链接已被禁用。这是因为这两个内部有子菜单内容，并且插件只是禁用了任何顶级菜单中包含子菜单的链接。请问有关恢复关于我们和服务菜单的链接需要做些什么？我可以在下面的wp_nav_menu代码中切换任何选项吗？

<?php 
        wp_nav_menu( array(
          'menu'       => 'top_menu',
          'depth'      => 2,
          'container'  => false,
          'menu_class' => 'nav',
          'fallback_cb' => 'wp_page_menu',
          'walker' => new wp_bootstrap_navwalker())
        );
?>

Answer 1

可以按照您想要的方式修改此navwalker，即将链接输出为href值，并允许您点击链接。

这里有2个问题需要解决：

使用的navwalker未将网址输出到href属性（而是输出'＃'）。
Bootstrap禁用e.preventDefault的链接点击行为，并将其替换为自己的功能。

使navwalker输出一个url并停止Bootstrap接管点击行为只是修改navwalker中的几行。我有一个包含modified version of the walker的仓库的分支。

停止Bootstrap接管链接的点击行为有一些影响。下载菜单是由Bootstrap JS单击打开的，因此如果删除它，则无法再打开菜单。快速解决方法是让它们出现在父母的悬停上。这是css那样做的：

.menu-item-has-children:hover ul.dropdown-menu {
    display: block;
}

请注意，在原始版本的Navwalker中禁用具有下拉菜单的菜单项是有原因的（并且Bootstrap核心不支持）。制作顶级项目可点击链接意味着需要在悬停时显示下拉菜单。触摸屏用户无法悬停。如果您预计任何人使用触摸屏，那么您应该避免使用下拉链接制作菜单项，而只是将它们保留为下拉切换。

披露：我写了问题中引用的文章，并将代码提供给原始使用的navwalker。

Answer 2

试试这个：（尝试一下，你应该从wordpress管理面板创建导航菜单，没有它，它将无效。）

<div class="collapse navbar-collapse navbar-ex1-collapse">
    <?php wp_nav_menu(array(
        'container_class' => 'menu-header',
        'theme_location' => 'primary',
        'items_wrap' => '<ul id="%1$s" class="%2$s nav navbar-nav">%3$s</ul>',
        'walker' => new BS3_Walker_Nav_Menu,
    )); ?>
</div>
<!-- /.navbar-collapse -->

和子菜单见here

Wordpress Bootstrap响应式导航菜单 - 如何使用Bootstrap Navwalker切换顶级菜单的href链接

2 个答案: