这里有件有趣的事给你
STEP 1向标题添加一个脚本，如下所示（最好使用排队方法。我需要一些人帮助我以WordPress的方式正确添加下面的脚本。jquery应该在第二个脚本之前运行>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
$(\'.dropdown-menu a.dropdown-toggle\').on(\'click\', function(e) {
if (!$(this).next().hasClass(\'show\')) {
$(this).parents(\'.dropdown-menu\').first().find(\'.show\').removeClass("show");
}
var $subMenu = $(this).next(".dropdown-menu");
$subMenu.toggleClass(\'show\');
$(this).parents(\'li.nav-item.dropdown.show\').on(\'hidden.bs.dropdown\', function(e) {
$(\'.dropdown-submenu .show\').removeClass("show");
});
return false;
});
});
</script>
STEP 2添加如下css：
.dropdown-submenu {
position: relative;
}
.dropdown-submenu a::after {
transform: rotate(-90deg);
position: absolute;
right: 6px;
top: .8em;
}
.dropdown-submenu .dropdown-menu {
top: 0;
left: 100%;
margin-left: .1rem;
margin-right: .1rem;
}
/* to show the arrow */
.dropdown-submenu a::after {
transform: rotate(-90deg);
position: absolute;
right: 6px;
top: .8em;
}
.dropdown-toggle a::after{
transform: rotate(-90deg);
position: absolute;
right: 6px;
top: .8em;
}
STEP 3现在进入walker类：搜索
&& 0 === $depth 然后移除它。还要确保
\'depth\' => 3现在应该开始显示第三级菜单。可能需要一些额外的css。
这将添加到标题中：
wp_nav_menu( array(
\'theme_location\' => \'primary\',
\'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(),
) );
