html - 将 Bootstrap 4 导航栏与 wordpress 4.x 合并的问题

标签 html css wordpress twitter-bootstrap

正在将 bootstrap 导航栏与 wordpress 结合使用,但它对我不起作用。下面是 wordpress wp_nav_menu 函数和我注释掉的导航栏代码(有效)。我注意到的奇怪事情是 wordpress 将类放在错误的位置。

<?php
   wp_nav_menu( array(
      'theme_location'   => 'primary',
      'menu'             => 'primary',
      'container'        => 'div',
      'container_class'  => 'navbar-collapse collapse justify-content-end',
      'menu_class'       => 'nav navbar-nav'
                    ) );
?>
<!-- <div class="navbar-collapse collapse justify-content-end">
        <ul class="nav navbar-nav">
           <li class="nav-item"><a href="/" class="nav-link">Test 1</a></li>
           <li class="nav-item"><a href="/" class="nav-link">Test 2</a</li>           
        </ul>
     </div> 
-->

Wordpress 按如下方式构建 html,这当然会中断,因为类未应用于正确的节点。 ul 没有类,因为容器有错误的类。

<div class="nav navbar-nav">
   <ul>
      <li class="page_item page-item-12"><a 
      href="http://localhost/fmr/Test1">Test 1</a></li>
      <li class="page_item page-item-8 current_page_item"><a 
      href="http://localhost/fmr/">Test 2</a></li>
   </ul>
</div>

有什么建议吗?

谢谢!

最佳答案

在设置数组中,菜单设置为主要。这应该设置为后端菜单的标题。在这种情况下,菜单应该是主菜单

<?php
   wp_nav_menu( array(
      'theme_location'   => 'primary',
      'menu'             => 'Main Menu',
      'container'        => 'div',
      'container_class'  => 'navbar-collapse collapse justify-content-end',
      'menu_class'       => 'nav navbar-nav'
   ) );
?>

关于html - 将 Bootstrap 4 导航栏与 wordpress 4.x 合并的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51234598/

相关文章:

html - 如何在google chrome浏览器的选择框中显示图片

html - 如何将 CSS 表格行单元格大小与下一行的单元格大小分离?

jquery - 向超大 slider 添加标题标题?

css - 力方格

html - 设置 div 之后的 p 标签的样式(div 不是 p 的父级)

css - 在 WordPress 中创建固定导航菜单

javascript - 如何计算可排序 div 中的元素数量?

html - 图像按列对齐

css - 将现有的bower foundation+scss网站转换成wordpress主题

wordpress - 在 WooCommerce 结帐中获取密码值