我在这个问题上度过了一段难忘的时光。除此之外的一切对我来说都很有用,所以希望我能得到一些反馈。我使用twitter bootstrap设计了一个静态网站,并对结构做了很多改动。将其转换为动态wordpress主题。我有一个navbar-left和navbar-right ul,因为在较大的尺寸(sm-lg)上,徽标出现在导航栏的中央,左边有3个链接,右边有3个链接。
除非我尝试将我的样式应用于生成的wp_nav_menu,否则一切都很棒。我不太了解它的这一部分,所以希望能有一个简单的解释。我已经尝试将自定义css添加到菜单中(基本上在Wordpress中将其添加到每个菜单项)但没有成功。我也明白需要安装导航器,这没问题。下面是它的HTML:
<!-- Collect the nav links, forms, and other content for toggling -->
<div id="navbar-collapse-main" class="collapse navbar-collapse">
<ul id="left-side-nav" class="nav navbar-nav navbar-left">
<li><a class="nav-links" href="page-home.php">Home</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle nav-links" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Menu<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a class="dropdown-links" href="#">Drink Menu</a></li>
<li><a class="dropdown-links" href="#">Food Menu</a></li>
<li><a class="dropdown-links" href="#">Specials</a></li>
</ul>
</li>
<li><a class="nav-links" href="#">Order</a></li>
</ul>
<!-- /#left-side-nav -->
<ul id="right-side-nav" class="nav navbar-nav navbar-right">
<li><a class="nav-links" href="#">Catering</a></li>
<li><a class="nav-links" href="#">Our Story</a></li>
<li><a class="nav-links" href="#">Contact</a></li>
</ul>
<!-- /#right-side-nav -->
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- /#main-nav -->
这是wp_nav_menu
<?php
wp_nav_menu( array(
'theme_location' => 'primary',
'container' => 'nav',
'container_id' => 'navbar-collapse-main',
'container_class' => 'collapse navbar-collapse',
'menu_class' => 'navbar-right navbar-left'
) );
?>
答案 0 :(得分:0)
这个函数的参数几乎都是字符串,所以据我所知你不能一次调用两个菜单。
我会做的是这样的事情:
<div id="navbar-collapse-main" class="collapse navbar-collapse">
<?php
wp_nav_menu( array(
'menu' => 'YOUR_MENU_ID',
'menu_id' => 'left-side-nav',
'menu_class' => 'navbar-left'
) );
wp_nav_menu( array(
'menu' => 'YOUR_MENU_ID',
'menu_id' => 'right-side-nav',
'menu_class' => 'navbar-right'
) );
?>
</div>
您可以在菜单管理页面的“屏幕选项”中使用“CSS Classes”选项,而不是将自定义类添加到菜单项中。