Closed cranca closed 4 years ago
I found a solution.
In line 192 of class-wp-bootstrap-navwalker.php changed this:
if ( isset( $args->has_children ) && $args->has_children && 0 === $depth && $args->depth !== 1 ) {
by this:
if ( isset( $args->has_children ) && $args->has_children && $args->depth !== 1 ) {
Then added the following CSS:
// Third level
ul.dropdown-menu li > ul.dropdown-menu {
width: 100%;
top: 25px;
margin: 0;
color: #212529;
background-color: #fff;
border: 0;
}
ul.dropdown-menu li:hover > ul.dropdown-menu,
ul.dropdown-menu li:focus > ul.dropdown-menu,
ul.dropdown-menu li > ul.dropdown-menu:hover,
ul.dropdown-menu li > ul.dropdown-menu:focus, {
display: block
}
and to control behaviour on mobile devices, added this to custom-javascript.js:
// Controls open submenu on mobile devices
$(document).on('click', '.dropdown-menu li', function (e) {
$('.dropdown-menu li > .dropdown-menu').slide();
e.stopPropagation();
});
Then changed depth
value on mybooking-navigation-walker.php to 3 and it worked.
When you add a 3rd level menu on WordPress it does not appears anywhere. It seem to be a Bootstrap restriction and the class WP Bootstrap Navwalker doesn't manage this.
https://github.com/wp-bootstrap/wp-bootstrap-navwalker/issues/115 https://github.com/wp-bootstrap/wp-bootstrap-navwalker/issues/176
Some walkarounds: https://wordpress.stackexchange.com/questions/240219/nav-walker-bootstrap-display-3rd-level-items-under-2nd-level https://stackoverflow.com/questions/51398685/bootstrap-4-navwalker-multilevel-menu