Hugo のセクションテンプレート (section.html) の中でセクションのタイトルを表示する

セクションテンプレートの中では、.Title や .Section を利用してセクションページ用のタイトルを生成することができます。 それぞれの変数の違いについて説明します。

セクションテンプレートとは

セクションテンプレート（あるいはセクションページテンプレート）は、content ディレクトリ内の各セクションのインデックスファイル (_index.md) をレンダリングするときに使用されるテンプレートファイルです。

content/
  +-- mysection1/
  |   +-- _index.md  ★このファイルや、
  |   +-- page1.md
  |   +-- page2.md
  +-- mysection2/
      +-- _index.md  ★このファイルに適用されるレイアウトです
      +-- page1.md
      +-- page2.md

どのようなファイルがセクションテンプレートとして使用されるかは、本家サイトの下記ページに詳しく説明されています。

• Section Template Lookup Order

すべてのセクションで共通のテンプレートを使用したいのであれば、まずは下記のようなパスにテンプレートファイルを用意するのがよいでしょう。

• /layouts/_default/section.html （セクション専用のテンプレート）

• /layouts/_default/list.html （セクション以外にも様々なリスト系ページで使われるテンプレート） ＜ テーマとしてテンプレートファイルを提供したいときは、テーマディレクトリの下に同じ構成でファイルを作成すれば OK です。

• /themes/<テーマ名>/layouts/_default/section.html

• /themes/<テーマ名>/layouts/_default/list.html

list.html の方は、ホームページ（ルートの _index.md）や、タグやカテゴリーのインデックスページなどにも使用されます。 セクションのインデックスページとしてのみ適用したいテンプレートであれば、section.html という名前で作成しましょう。

セクションテンプレートから .Title を参照する

セクションテンプレート layouts/_default/section.html（存在しない場合は list.html）の中で {{ .Title }} と記述すると、そのセクションの _index.md ファイルのフロントマターに定義した title の情報が参照されます。 これはすなわち「セクションページのタイトル」として使用できるものです。

content/
  +-- mysection/
      +-- _index.md （セクションページ）
      +-- a.md
      +-- b.md
      +-- c.md

---
title: "サンプルセクション"
---

これは本文のサンプル。

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

上記のような構成で、http://localhost:1313/mysection/ にアクセスすると、下記のような HTML が表示されることになります。

<h1>サンプルセクション</h1>

想定通り、_index.md のフロントマターに記述した title フィールドの値が表示されていることがわかります。 同様に、セクションテンプレートの中から {{ .Content }} を参照すると、_index.md に記述した本文の内容がそこに展開されます（この場合は、「これは本文のサンプル。」というテキストが展開されます）。

_index.md がない場合に .Title を参照するとどうなるか？

実は、上記のディレクトリ構成で示した content/mysection/_index.md というファイルを作成しなくても、そのセクションの index.html ファイルは暗黙的に生成されます。 そのようなケースでも、テンプレートファイルとしてはセクションテンプレート (section.html) が使用されます。 擬似的な空っぽの _index.md ファイルが存在し、そのファイルに対してセクションテンプレートが適用されていると考えればよいでしょう。

ただし、この場合は _index.md のフロントマター記述も存在しないため、{{ .Title }} で参照できるはずの title 情報を取得することができません。 その代わりに、Hugo は セクションのディレクトリ名から自動的にセクションページのタイトルを生成 し、それを {{ .Title }} の値として使用します。 そのとき生成されるタイトルは、ディレクトリ名と同一ではないことに注意してください。 Hugo はセクションのディレクトリ名の 先頭を大文字にし、さらに複数形に変換した単語 をタイトルとして生成します。 上記のディレクトリ構成の場合は、セクションのディレクトリ名は mysection なので、自動生成されるタイトルは Mysections となります。

<h1>Mysections</h1>

セクション名が自動的に複数形になってしまうのを防ぎたい場合は、Hugo の設定ファイル（config.toml など）で下記のように設定します。

# Pluralize titles in lists using inflect
pluralizeListTitles = false

セクションテンプレートから .Section を参照する

セクションテンプレートの中で {{ .Section }} を参照すると、セクションのディレクトリ名をそのまま取得することができます。 {{ .Title }} と異なり、自動的に先頭を大文字にしたり、複数形にしたりすることがないので、ディレクトリ構成をそのまま出力したい場合にはこちらを使用するのがよいでしょう。

<h1>{{ .Section }}</h1>

<h1>mysection</h1>