PaperMod 文章页展示所属系列的文章列表

需求：在文章页面底部展示该文章所属系列的文章列表

实现步骤：

新建模板

./layouts/partial/series-posts.html

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
{{- if .Params.series }}
<div class="x-post-series">
{{- $series := .Site.Taxonomies.series}}
{{- range .Params.series}}
{{- $seriesName := . }}
    
{{- range $name, $value := $series }}
    {{- if or (eq $name $seriesName) (eq ($name|urlize) ($seriesName|urlize) ) }}
    <details open>
        <summary>{{ $seriesName }}</summary>
        <ol>
            {{- range $value.Pages.ByDate }}
            <li><a href="{{.Permalink}}">{{.LinkTitle}}</a>
                <sub>{{- .Date.Format .Site.Params.DateFormat -}}</sub>
            </li>
            {{- end }}
        </ol>
    </details>
    {{- end }}
{{- end }} {{/* end range site series */}}
    
{{- end }} {{/* end range page series */}}
</div>
{{- end }} {{/* end .Params.series */}}

添加样式

./assets/css/extended/custom.css

1
2
3
.x-post-series {
  padding: 16px 0;
}

编辑文章模板

./layouts/_default/single.html

38
39
40
41
42
  <footer class="post-footer">
    <!--  添加下面这几行  -->
    {{- if and site.Params.ShowSeriesInPost (ne .Params.showSeries false ) }}
    {{- partial "series-posts.html" . -}}
    {{- end }}

使用姿势

./config.yml

1
2
3
params:
    # 是否在文章页显示所属系列的文章列表
    ShowSeriesInPost: true

设置文章所属系列，比如本篇是这样：

1
2
3
4
5
6
7
8
9
---
title: "PaperMod 文章页展示所属系列的文章列表"
date: 2022-06-12
draft: false
tags: ["hugo", "paper-modx"]
series: ["PaperModx 定制文章页"]
# 是否在本页展示系列文章，默认值 true
showSeries: true
---