我正在努力实现的目标:
具有一级子菜单的菜单:
PAGE 1<br>
--- Page 1 sub-page 1<br>
--- Page 1 sub-page 2<br>
PAGE 2<br>
--- Page 2 sub-page 1<br>
--- Page 2 sub-page 2<br>
--- Page 2 sub-page 3<br>
PAGE 3<br>
--- Page 3 sub-page 1<br>
--- Page 3 sub-page 2<br>
在第1页时,在顶层页面下方的一节中显示所有第1页子页面。在第1页时(&A);将鼠标悬停在第2页上,在顶层页面下方的一个部分中显示第2页的所有子页面
要在我的网站上正确显示此内容,我需要添加div
内部ul.sub-menu
<ul>
<li><a>...</a>
<ul class="sub-menu">
<div class="container">
<li><a>...</a></li>
<li><a>...</a></li>
<li><a>...</a></li>
</div>
</ul>
</li>
</ul>
为此,我尝试创建一个Walker类,但当我将其添加到wp\\u nav\\u menu()函数中时,它会一起删除菜单。这是我使用的Walker类:
class custom_wp_walker extends Walker_Nav_Menu{
function start_lvl(&$output, $depth) {
$output .= \'<ul class="children">
<div class="container">\';
}
function end_lvl(&$output, $depth) {
$output .= \'
</div>
</ul>\';
}
}
现在,为了让我的菜单能够自我填充,我没有在wordpress后端创建菜单(外观->菜单)。如果我删除walker类,它会添加所有菜单项,包括前端的子项。我就是不能把它做得很好。
但是,如果我在后端创建菜单并手动添加我拥有的项,Walker类就会工作并添加额外的div。问题是子项不会自动添加,我需要它们。Walker类是否需要在后端手动添加页面才能工作?
我为之建立网站的人在技术上有点困难,所以它需要自己填充,因为他们自己做不到。
所以,我的问题是如何在ul.sub-menu
还有一个完全自填充的菜单?除了步行课还有别的路吗?我试着在谷歌上搜索出一个解决方案,但没有找到任何其他方法。
最合适的回答,由SO网友:mrmadhat 整理而成
您的html结构应该如下所示
<ul class="parent-class">
<li>Page 1</li>
<li>
<ul class="child-class">
<li> Sub menu item 1</li>
<li> Sub menu item 2</li>
</ul>
</li>
</ul>
Wordpress应该自动向活动页面添加一个“活动”类,然后您应该能够使用css设置所有内容的样式。类似于
.parent-class li ul {
Display:none;
}
.Active li ul {
display:block;
}
.parent-class:hover > .parent-class li ul {
display:block
}