1

大家好，我一直在使用 root/sage、wordpress、bootstrap 4、VVCW 和 WP_Bootstrap_Navwalker 为菜单开发我的第一个主题。在凉亭组件中还放置了一大堆引导程序。

一切正常，很酷，除了菜单没有像正常操作那样响应，例如菜单显示，直到它达到一定的宽度，然后出现菜单按钮，可以单击该按钮并且导航下拉。

到目前为止，这是我的代码

//header.php

<nav class="navbar navbar-default" role="navigation">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <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 home_url(); ?>">
        <?php bloginfo('name'); ?>
          </a>
    </div>
    </div>
        <?php
        wp_nav_menu( array(
            'theme_location'    => 'primary',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'collapse navbar-default',
            'container_id'      => 'bs-example-navbar-collapse-1',
            'menu_class'        => 'nav navbar-nav test',
            'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
            'walker'            => new WP_Bootstrap_Navwalker())
        );
        ?>
    </div>
</nav>

//函数.php

require_once('lib/wp-bootstrap-navwalker.php');

function register_menus() {
    register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'Beatroute' ),
) );
  }
add_action( 'init', 'register_menus' );

function wpt_register_js() {
    wp_register_script('jquery.bootstrap.min', get_template_directory_uri() . '/bower_components/bootstrap/dist/js/bootstrap.js', 'jquery');
    wp_enqueue_script('jquery.bootstrap.min');
}
add_action( 'init', 'wpt_register_js' );

function wpt_register_css() {
    wp_register_style( 'bootstrap.min', get_template_directory_uri() . '/bower_components/bootstrap/dist/css/bootstrap.css' );
    wp_enqueue_style( 'bootstrap.min' );
}
add_action( 'wp_enqueue_scripts', 'wpt_register_css' );

我只是希望出现 BS 菜单的常规功能。我怀疑网格断点有什么问题。因为这是我使用 Roots/Sage 和各种技术开发的第一个自定义主题，所以我认为这可能是一些简单的原因造成的。

感谢您提供的任何帮助！

4

1 回答 1

2

在 Bootstrap 4 中，您必须明确定义导航栏断点。您可以通过在.navbar-expand{-sm|-md|-lg|-xl}现有. 这是在 Bootstrap Navbar 文档中首先提到的。.navbar-expand-md.navbar

所以我认为你必须做的唯一改变是：

<nav class="navbar navbar-default navbar-expand-md" role="navigation">
于 2017-12-14T21:47:17.040 回答