Question

我正在构建一个WordPress博客，我使用bootstrap构建它。我找到wp_bootstrap_navwalker并使用它构建了两个菜单。一切正常，除了“嵌套”或“子菜单”如果我检查chrome Devtools中的代码，我可以在HTML中看到Subs（见下文）。

检查代码

 <li id="menu-item-937" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-937 dropdown"><a title="More" href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true" aria-expanded="false">More <span class="caret"></span></a>
<ul role="menu" class=" dropdown-menu">
    <li id="menu-item-945" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-945"><a title="Consultancy" href="https://www.###/">Consultancy</a></li>
    <li id="menu-item-946" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-946"><a title="PR" href="https://www.###">PR</a></li>
</ul>
</li>

以下是我通过GIT仓库中的指令集成wp_bootstrap_navwalker的方法（参见下面的代码）。

的header.php

<nav class="navbar navbar-default navbar-fixed-top navbar-light">
<!--    <nav class="navbar navbar-default" style="margin-bottom: 0;">-->
<div class="container">

    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collaps"
            aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>

    <a class="navbar-brand " href="<?php echo get_page_link(2); ?>"><img
                src="<?php bloginfo('url'); ?>/wp-content/uploads/2016/10/logo.png"></a>
    <button type="button" class="btn btn-primary navbar-btn navbar-right hidden-xs" style="margin-left: 10px"><span
                class="glyphicon glyphicon-user"></span> Sign up
    </button>
    <button type="button" class="btn btn-primary navbar-btn navbar-right hidden-xs"><span
                class="glyphicon glyphicon glyphicon-log-in"></span> Login
    </button>
</div>

<div id="navbar" style="background-color: #333;max-height: 50px;">
    <div class="container">
        <?php bootstrap_nav(); ?>
    </div>
</div>

的functions.php

<?php
// Register Custom Navigation Walker
require_once('wp_bootstrap_navwalker.php');

register_nav_menus(array(
    'locations-primary' => __('Primary Menu', 'Main_Menu_Blog'),
    'locations-secondary' => __('Secondary Menu', 'Career_Advice'),
));

// Bootstrap navigation
function bootstrap_nav()
{
    wp_nav_menu(array(
            'menu'              => 'Primary Menu',
            'theme_location'    => 'locations-primary',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'collapse navbar-collapse',
            'container_id'      => 'navbar-collaps',
            'menu_class'        => 'nav navbar-nav',
            'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
            'walker'            => new wp_bootstrap_navwalker())
    );
}

所以看起来子菜单只是没有打开点击，我错过了什么？

Answer 1

刚刚引用了正确的CDN'S

 <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
}

wp_bootstrap_navwalker子菜单单击或悬停不显示子菜单

1 个答案: