BlackCoffy

hugoにタグ,カテゴリページを追加

hugoで作ったブログにタグ一覧ページを追加したときの備忘録です.カテゴリも基本的に同じ.

このブログに実装している内容で,タグページを追加する場合です.

環境

  • hugo v0.75.0

実装

config.tomlのtaxonomiesに追加します.

config.toml

[taxonomies]
    tag = "tags"
    # category = "categories"

terms.htmlはタグの一覧とその数を表示します. このブログだとタグ一覧になります.

layouts/_default/terms.html

{{ define "main" }}

<h1>{{ .Title }} List</h1>

{{ if lt 0 (len .Site.Taxonomies.tags) }}
<ul">
  {{ range .Site.Taxonomies.tags.ByCount }}
  <li>
    <a href="{{ $.Site.BaseURL | relURL }}tags/{{ .Name | urlize }}">{{ .Name }}<span>({{ .Count }})</span></a>
  </li>
  {{ end }}
</ul>
{{ end }}

{{ end }}

list.htmlでは,タグに該当する記事の一覧を表示します. このブログだとhugoの記事あたり

layouts/_default/list.html

{{ define "main" }}

<h1>「{{ .Title }}」記事一覧</h2>

{{ range .Data.Pages }}
{{ .Render "li" }}
{{ end }}

{{ end }}

記事一覧は他のページでも使用しているので,li.htmlにしています.

layouts/_default/li.html

<div>

  <p>
    <a href="/posts/{{ .File.BaseFileName }}">{{ .Name }}</a>
  </p>

  <time>{{.Date.Format "2006-01-02"}}</time>

  {{ range .Params.tags }}
  <span>{{ . }}</span>
  {{ end }}

</div>