-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Description
Hi, thanks for the great navbar walker, I'm using it in my wordpress site with bootstrap 4.6
It works fine, even I use it with 3rd level menu and it looks fine in desktop
the problem is that, in mobile, we can't use hover effect to make the third level menu show,
I need to know how to add toggle-split icon ( .dropdown-toggle-split ) with the second level menu, so visitors can:
- Click on the dropdown-toggle-split of the 2nd level menu to show the 3rd level menu (which is sub-categories from 2nd level category)
- or click on the 2nd level menu to open the 2nd level menu category directly
here you are my code in header.php
<?php wp_nav_menu([ 'theme_location' => 'header-menu', 'depth' => 3, 'container' => 'div', 'container_class' => 'collapse navbar-collapse', 'container_id' => 'bs-example-navbar-collapse-1', 'menu_class' => 'nav navbar-nav', 'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback', 'walker' => new WP_Bootstrap_Navwalker(), ]); ?>
and below is css code to help showing 3rd level menu
`/* multilevel navigation */
ul.dropdown-menu li > ul.dropdown-menu {
left: 100%;
top: 0;
}
ul.dropdown-menu li:hover > ul.dropdown-menu, ul.dropdown-menu li:focus > ul.dropdown-menu {
display: block;
}`
I hope I can get help fixing this issue