2014-01-08 4 views
0

Im работает над WordPress темы с бутстрапом. В настоящее время у меня есть сворачиваемая панель навигации, и ссылки заполняются и работают, когда они не рушились. Но когда я меняю разрешение и появляется кнопка, вы можете щелкнуть, но ссылки не появятся.Wordpress bootstrap Свернуть меню, не показывающее ссылки

Вот мой Navbar помещен в header.php

<nav class="navbar navbar-default navbar-fixed-top" role="navigation" id="navigation"> 
<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>  
      <?php if (get_theme_mod('themeslug_logo')) : ?> 
       <a class="navbar-brand" href='<?php echo esc_url(home_url('/')); ?>' title='<?php echo esc_attr(get_bloginfo('name', 'display')); ?>' rel='home'><img src='<?php echo esc_url(get_theme_mod('themeslug_logo')); ?>' alt='<?php echo esc_attr(get_bloginfo('name', 'display')); ?>'></a> 
       <?php else : ?> 
        <a class="navbar-brand" href='<?php echo esc_url(home_url('/')); ?>' title='<?php echo esc_attr(get_bloginfo('name', 'display')); ?>' rel='home'><?php bloginfo('name'); ?></a> 
       <?php endif; ?> 
      </div> 

      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
<ul class="nav navbar-nav"> 
      <?php /* menu */ 
      wp_nav_menu(array(
       'menu'    => 'primary', 
       'theme_location' => 'primary-menu', 
       'depth'    => 2, 
       'container'   => 'div', 
       'container_class' => 'collapse navbar-collapse navbar-ex1-collapse', 
       'menu_class'  => 'nav navbar-nav', 
       'fallback_cb'  => 'wp_bootstrap_navwalker::fallback', 
       'walker'   => new wp_bootstrap_navwalker()) 
      ); 
      ?> 
</ul> 
      </div> 
</nav> 

Вот вывод HTML:

<div class="navbar-collapse in" id="bs-example-navbar-collapse-1" style="height: auto;"> 
<ul class="nav navbar-nav"> 
<div class="collapse navbar-collapse navbar-ex1-collapse"> 
<ul id="menu-navigation" class="nav navbar-nav"> 
<li id="menu-item-22" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-22"> 
<a title="Blog" href="http://dillonraphael.com/blog/">Blog</a> 
</li> 
</ul> 
</div> 
</ul> 
</div> 
+0

У вас есть bootstrap.js или начальной загрузки файлов JavaScript включен/призвал в нижней части страницы? Если кнопка не будет ничего делать. – Braunson

+0

@Braunson Кнопка работает. Я нажимаю его, и белая коробка расширяется. Но внутри нет ссылок. Когда сайт использует более крупные размеры экрана, ссылки отображаются на фактическом навигаторе – Dondada

+0

Может захватить выходные данные WordPress и опубликовать его? – Braunson

ответ

0

Ваш вывод неверен, он имеет два Div с NavBar коллапсом

Возьмите функцию WordPress wp_nav_menu и удалите div и ul, обернутые вокруг нее, поскольку она генерирует ее собственную, и у вас есть правильный класс.

Удалить это и это закрывающие теги:

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
<ul class="nav navbar-nav"> 

Затем добавьте это в массив

container_id => 'bs-example-navbar-collapse-1', 
Смежные вопросы