menus - How do you show horizontally the submenu in WordPress using the nav walker?

admin管理员组

文章数量:1328623

I've added a nav walker in my wordpress theme. It looks like this:

Functions.php

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


/*Navigation Menus*/
function register_my_menu() {
  register_nav_menu('header-menu',__( 'Header Menu' ));
}
add_action( 'init', 'register_my_menu' );
/*End*/

and then header.php

 <nav class="navbar navbar-expand-lg">
   <div class="container"><a href="home" class="navbar-brand home"><img src=<?php echo get_template_directory_uri() . '/img/logo_pezzini_big.png';?> alt="Obaju logo" class="d-none d-md-inline-block"><img src=<?php echo get_template_directory_uri() . '/img/logo_pezzini_small.png';?> alt="Obaju logo" class="d-inline-block d-md-none"><span class="sr-only">Obaju - go to homepage</span></a>
     <div class="navbar-buttons">
       <button type="button" data-toggle="collapse" data-target="#navigation" class="btn btn-outline-secondary navbar-toggler"><span class="sr-only">Toggle navigation</span><i class="fa fa-align-justify"></i></button>
       <button type="button" data-toggle="collapse" data-target="#search" class="btn btn-outline-secondary navbar-toggler"><span class="sr-only">Toggle search</span><i class="fa fa-search"></i></button><a href="basket.html" class="btn btn-outline-secondary navbar-toggler"><i class="fa fa-shopping-cart"></i></a>

      <header>
        <nav class="navbar navbar-expand-lg">
            <!-- Brand and toggle button -->
            <a class="navbar-brand" href="#">Navbar</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <!-- End -->
            <!-- Your website Links -->
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <?php
                     wp_nav_menu( array(
                     'menu'              => 'primary',
                     'theme_location'    => 'header-menu',
                     'depth'             => 4,
                     'container'         => 'div',
                     'container_class'   => '',
                     'container_id'      => '',
                     'menu_class'        => 'navbar-nav mr-auto',
                     'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                     'walker'            => new wp_bootstrap_navwalker())
                     );
                ?>

            </div>
            <!-- End -->
        </nav>
</div>
</header>

It works pretty good but I've a question. Actually the sub-menu is vertical but I'd like to have it horizontal. Here how it looks:

but it should show like:

SOCKS UNDERWEAR TSHIRTS ......

Hope it is clear. Thank you in advance

[![enter image description here][2]][2]

本文标签： menusHow do you show horizontally the submenu in WordPress using the nav walker