有的时候,hexo站点内容较多,需要多级菜单,网上找了很久,没找到答案,自己想了一个方法,如要实现二级菜单,可以通过判断一级菜单来实现。实现三级菜单可以通过判断二级菜单实现,以此类推。
这里以实现二级菜单为例:
修改主题_config.yml
menu: #这里是一级菜单
Home: /
About: /about/
Products: /products/
News: /news/
Support: /support/
Contact: /contact/
about: #这里是二级菜单
Introduction: /about/introduction/
Videos: /about/videos/
Culture: /about/culture/
修改header.ejs
在菜单的位置,加入以下代码:
...
<% for (var name in theme.menu) { %>
<li><a href="<%- url_for(theme.menu[name]) %>"><div><%= name %></div></a>
<% if(name == 'About') { %>
<ul>
<% for (var i in theme.about) { %>
<li><a href="<%- url_for(theme.about[i]) %>"><div><%= i %></div></a></li>
<% } %>
</ul>
<% } %>
</li>
<% } %>
...
如果有多个二级菜单项,只要增加多个if判断即可。
原文出处:http://zhy.one/html/hexo-multi-menu.html