如何在Hugo中基于list.html实现章节子文件夹的HTML页面列表
在Hugo的list.html中列出章节子文件夹的方法
要在当前章节的list.html里展示下属子文件夹(对应Hugo的子章节),直接利用Hugo内置的页面变量即可,步骤如下:
确认子文件夹的章节属性
Hugo只把包含_index.md文件的文件夹识别为「章节(Section)」,所以如果你想展示某个子文件夹,先确保该文件夹内存在_index.md(可以是空内容,仅需保留文件结构)。在list.html中循环渲染子章节
在当前章节的list.html模板里,使用.Sections变量获取所有直接子章节,然后循环输出:<div class="sub-sections"> <h3>子文件夹列表</h3> <ul> {{ range .Sections }} <li> <a href="{{ .Permalink }}">{{ .Title }}</a> {{ with .Description }} <p>{{ . }}</p> {{ end }} </li> {{ end }} </ul> </div>.Sections:返回当前章节下的所有直接子章节(仅一级子文件夹)- 如果需要展示所有层级的嵌套子章节,改用
.Sections.Recursive即可
可选:筛选特定子文件夹
要是只想展示部分子章节,可以通过Front Matter的自定义参数筛选,比如先在子章节的_index.md里加:--- title: "我的子文件夹" show_in_parent_list: true ---然后在list.html里修改循环逻辑:
{{ range where .Sections "Params.show_in_parent_list" true }} <li><a href="{{ .Permalink }}">{{ .Title }}</a></li> {{ end }}
内容的提问来源于stack exchange,提问作者Nedjma Média
相关产品推荐
相关产品推荐

