首页 文章

wordpress bootstrap导航栏总是扩展

提问于
浏览
0

我 Build 了一个静态引导程序网站,导航栏工作正常,但在转换为wordpress模板的过程中,我偶然发现了一个问题,无法弄明白 .

基本上,当导航栏折叠以适合正确的屏幕宽度时,导航栏菜单始终会展开,切换按钮也不会切换为隐藏/显示 .

这是我的完整导航栏HTML代码:

<div id="navbar-wrapper" class="navbar-wrapper">
      <div class="navbar navbar-default navbar-static-top" role="navigation">
         <div class="navbar-inner">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                        <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="/"><img class="logo" src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/logo_blue_ls.png" alt="Relax on Ryan"></a>    
                </div><!-- navbar header -->

                <!-- if the menu (WP admin area) is not set, then the "menu_class" is applied to "container". IN other words, it overwrites the "container_class". Ref: http://wordpress.org/support/topic/wp-nav-menu-class-usage-bug?replies=4 -->

                <?php
                    wp_nav_menu( array(

                        'theme_location'    =>  'primary',
                        'container'         =>  'nav',
                        'container _class'  =>  'navbar-collapse collapse',
                        'menu_class'        =>  'nav navbar-nav navbar-right'

                    ) );
                ?>

            </div><!-- navbar-container -->
        </div><!-- navbar-inner -->
    </div><!-- navbar -->   
 </div><!-- navbar-wrapper -->

任何援助将不胜感激 . 我想知道我的数据目标是否可能被错误定义?

谢谢,希思

1 回答

  • 0
    <div id="navbar-wrapper" class="navbar-wrapper">
       <nav id="navigation" class="navbar navbar-default navbar-static-top" role="navigation">
          <div class="container">
             <!-- Brand and toggle get grouped for better mobile display -->
             <div class="navbar-header">
                  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" 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>
                    <span class="icon-bar"></span>
                  </button>
    
                  <a class="navbar-brand" href="<?php echo home_url(); ?>">
                     <img id="logo" src="{logo}" class="img-responsive" alt="Image">
                  </a>
             </div>
             <?php wp_nav_menu(array(
                'menu'            => 'primary',
                'theme_location'  => 'primary',
                'depth'           => 2,
                'container'       => 'div',
                'container_class' => 'navbar-collapse collapse',
                'container_id'    => 'bs-example-navbar-collapse-1',
                'menu_class'      => 'nav navbar-nav navbar-right',
                ));
             ?>
          </div><!-- /.container -->
       </nav>
    </div>
    

相关问题