layouts/term.html

Hugoのlayouts/term.htmlコードの解説

$ cat themes/my-theme/layouts/term.html 
{{ define "main" }}
  <h1>{{ .Title }}</h1>
  {{ .Content }}
  {{ range .Pages }}
    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
  {{ end }}
{{ end }}

このコードはHugo（静的サイトジェネレーター）のテンプレートで、term.htmlというテンプレートファイルの内容です。これはタクソノミーのタームページ（カテゴリーやタグのページなど）を表示するためのものです。

1. {{ define "main" }} … {{ end }}: これは「main」という名前のブロックを定義しています。このブロックは通常、基本レイアウト（baseof.html）内の{{ block "main" . }}部分に挿入されます。

2. <h1>{{ .Title }}</h1>: 現在のタームのタイトルを表示します。例えば、「Technology」カテゴリーや「golang」タグの名前などです。

3. {{ .Content }}: タームに関連付けられたコンテンツを表示します。多くの場合、タームページに対応するMarkdownファイルがある場合、その内容がここに表示されます。

4. {{ range .Pages }} ... {{ end }}: このタームに属するすべてのページをループ処理します。

5. <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>:

   • 各ページへのリンクをh2見出しとして表示
   • .RelPermalink: そのページの相対URLを提供します
   • .LinkTitle: そのページのリンク用タイトル（通常は.Titleと同じですが、front matterでlinkTitleが指定されていればそれが優先されます）

使用例

例えば、あなたのサイトに「Technology」というカテゴリーがあり、それに複数の記事が含まれている場合、このテンプレートは以下のようなHTMLを生成します：

<h1>Technology</h1>
<!-- もしcontent/categories/technology.mdなどがあれば、その内容がここに -->
<h2><a href="/posts/how-to-use-hugo/">Hugoの使い方</a></h2>
<h2><a href="/posts/static-site-generators/">静的サイトジェネレーターの比較</a></h2>
<h2><a href="/posts/web-development-basics/">Web開発の基礎</a></h2>

このようにして、特定のカテゴリーやタグに関連するすべての記事を一覧表示するページを作成します。