Question

我正在研究用bootstrap制作的wordpress主题。我目前有一个可折叠的导航栏，链接填充并在未折叠时工作。但是当我更改分辨率并出现按钮时，您可以单击但链接不会显示。

这是我的导航栏放在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>

Answer 1

您的输出不正确，它有两个div与navbar-collapse

使用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',

Wordpress bootstrap折叠菜单没有显示链接

1 个答案: