提前阅读：
WordPress主题制作之菜单
wp_nav_menu详解
https://www.cnblogs.com/zhaoweidong/p/10296776.html
在使用wp_nav_menu设置菜单显示项，对于二级菜单的类名（默认sub-menu）无法修改。在这种情况下可以利用Walker来设置。
实际上，wp_nav_menu()函数默认调用了一个核心提供的对象，即“Walker_ Nav_Menu”。
备注：多余的类和ID是程序自动添加的，可以去除或保留菜单多余类名，参考相关文档《去除或保留菜单多余类名》。
其他来源：
https://github.com/wp-bootstrap/wp-bootstrap-navwalker
这里重新写了一个类，比如起名wp_bootstrap_navwalker()，继承“Walker_ Nav_Menu”并重新编写。以便构造合适的多级菜单。
通过代码：’walker’ => new wp_bootstrap_navwalker() 调用该对象。实现对二级菜单类名的修改。
案例，原始代码如下（还没有调用wordpress代码）：
第一步、准备类：
如下类是我们在一直支持bootstrap的主题中找到的，
文件名：class-wp-bootstrap-navwalker.php
类：understrap_WP_Bootstrap_Navwalker()
class Understrap_WP_Bootstrap_Navwalker extends Walker_Nav_Menu
<nav class=“navbar navbar-expand-lg navbar-dark bg-dark static-top”>
<div class=“container”>
<a class=“navbar-brand” href=“#”>Start Bootstrap</a>
<button class=“navbar-toggler” type=“button” data–toggle=“collapse” data–target=“#navbarResponsive” aria–controls=“navbarResponsive” aria–expanded=“false” aria–label=“Toggle navigation”>
<span class=“navbar-toggler-icon”></span>
</button>
<div class=“collapse navbar-collapse” id=“navbarResponsive”>
<ul class=“navbar-nav ml-auto”>
<li class=“nav-item active”>
<a class=“nav-link” href=“#”>Home
<span class=“sr-only”>(current)</span>
</a>
</li>
<li class=“nav-item”>
<a class=“nav-link” href=“#”>About</a>
</li>
<li class=“nav-item”>
<a class=“nav-link” href=“#”>Services</a>
</li>
<li class=“nav-item”>
<a class=“nav-link” href=“#”>Contact</a>
</li>
</ul>
</div>
</div>
</nav>
第二步：在functions.php导入bootstrap菜单样式
include_once(‘inc/wp_bootstrap_navwalker.php’);
第三步：显示：
<nav class=“navbar navbar-expand-lg navbar-dark bg-dark static-top”>
<div class=“container”>
<a class=“navbar-brand” href=“#”>Start Bootstrap</a>
<button class=“navbar-toggler” type=“button” data–toggle=“collapse” data–target=“#navbarResponsive” aria–controls=“navbarResponsive” aria–expanded=“false” aria–label=“Toggle navigation”>
<span class=“navbar-toggler-icon”></span>
</button>
<!– The WordPress Menu goes here –>
<?phpwp_nav_menu(
array(
‘theme_location’ => ‘menu-1’,
‘container_class’ => ‘collapse navbar-collapse’,
‘container_id’ => ‘navbarNavDropdown’,
‘menu_class’ => ‘navbar-nav ml-auto’,
‘fallback_cb’ => ”,
‘menu_id’ => ‘main-menu’,
‘depth’ => 2,
‘walker’ => new Understrap_WP_Bootstrap_Navwalker(),
)
);
?>
</div>
</nav>
对应HTML
<nav class=“navbar navbar-expand-lg navbar-dark bg-dark static-top”>
<div class=“container”>
<a class=“navbar-brand” href=“#”>Start Bootstrap</a>
<button class=“navbar-toggler” type=“button” data–toggle=“collapse” data–target=“#navbarResponsive” aria–controls=“navbarResponsive” aria–expanded=“false” aria–label=“Toggle navigation”>
<span class=“navbar-toggler-icon”></span>
</button>
<!– The WordPress Menu goes here –>
<div id=“navbarNavDropdown” class=“collapse navbar-collapse”>
<ul id=“main-menu” class=“navbar-nav ml-auto”>
<li itemscope=“itemscope” itemtype=“https://www.schema.org/SiteNavigationElement” id=“menu-item-1121” class=“menu-item menu-item-type-custom menu-item-object-custom menu-item-1121 nav-item”><a title=“Home” href=“#” class=“nav-link”>Home</a></li>
<li itemscope=“itemscope” itemtype=“https://www.schema.org/SiteNavigationElement” id=“menu-item-1122” class=“menu-item menu-item-type-custom menu-item-object-custom menu-item-1122 nav-item”><a title=“About” href=“#” class=“nav-link”>About</a></li>