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]