Question

我在 Wordpress 中创建了菜单，其中一个菜单项有一个子菜单。那么，我应该如何修改此代码以获得像 Bootstrap Navs 那样的下拉导航？

<?php 
       wp_nav_menu(array(
       'theme-location'=>'header_menu',
       'menu_class' => 'nav',
       'my_menu_li_class' => 'nav-item',
        'my_menu_a_class' => 'nav-link js-scroll-trigger'
                        
    )); 
?>

引导示例：

<ul class="nav nav-tabs">
      <li class="nav-item">
        <a class="nav-link active" href="#">Active</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <a class="dropdown-item" href="#">Something else here</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Separated link</a>
        </div>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
      </li>
    </ul>

Answer 1

我找到了解决方案。

我使用 theme
在 function.php 中，我添加了以下代码：

function register_navwalker() {
   require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
}
add_action( 'after_setup_theme', 'register_navwalker' );

然后在菜单代码中我添加了参数：

<?php 
        wp_nav_menu(array(
        'theme-location'=>'header_menu',
        'menu_class' => 'nav',
        'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback',
        'walker' => new WP_Bootstrap_Navwalker(),                     
   )); 
?>

Wordpress 下拉菜单（引导程序）

1 个答案: