Skip to main content

コンテンツ構成

Hugo は、ソースのコンテンツを整理するのに有効なのと同じ構造を、レンダリングされるサイトの整理にも使用することを前提としています。

ページバンドル

Hugo 0.32 では、ページ関連の画像やその他のリソースが Page Bundles にパッケージされていることが発表されました。

これらの用語は関連しており、全体像を把握するためには、「ページリソース」「画像処理」 についても読む必要があります。

図では、3 つのバンドルが示されています。 ホームページバンドルには、他のコンテンツページを含めることはできませんが、他のファイル (画像など) を含めることは可能であることに注意してください。

コンテンツソースの構成

Hugo では、レンダリングされたウェブサイトを反映するようにコンテンツを構成する必要があります。

Hugo はあらゆるレベルでネストされたコンテンツをサポートしていますが、トップレベル (つまり content/<DIRECTORIES>) は Hugo では特別で、レイアウトなどを決定するために使用するコンテンツタイプと見なされます。 セクションをネストする方法など、セクションの詳細については、セクション を参照してください。

追加の設定なしで、以下が自動的に動作します。

.
└── content
    └── about
    |   └── index.md  // <- https://example.com/about/
    ├── posts
    |   ├── firstpost.md   // <- https://example.com/posts/firstpost/
    |   ├── happy
    |   |   └── ness.md  // <- https://example.com/posts/happy/ness/
    |   └── secondpost.md  // <- https://example.com/posts/secondpost/
    └── quote
        ├── first.md       // <- https://example.com/quote/first/
        └── second.md      // <- https://example.com/quote/second/

Hugo のパスの内訳

以下は、コンテンツの構成と、Hugo の Web サイトのレンダリング時の出力 URL 構造との関係を示すものです。これらの例は、Hugo のデフォルトの動作である プリティ URL を使用していることを前提としています。また、この例では サイトの設定ファイルbaseURL = "https://example.com" というキーと値を指定していると仮定しています。

インデックスページ: _index.md

_index.md は Hugo において特別な役割を担っています。これによって、リストテンプレート にフロントマターやコンテンツを追加できます。これらのテンプレートには、セクション テンプレートタクソノミー テンプレートタクソノミー用語テンプレートホームページ テンプレート が含まれます。

_index.md はホームページに 1 つ、コンテンツセクション、タクソノミー、タクソノミー用語のそれぞれに 1 つずつ作成できます。以下は、Hugo の Web サイトの posts セクションのリストページのコンテンツとフロントマターを含む _index.md の典型的な配置を示したものです。

.         url
.       ⊢--^-⊣
.        path    slug
.       ⊢--^-⊣⊢---^---⊣
.           filepath
.       ⊢------^------⊣
content/posts/_index.md

ビルド時には、以下の出力先に、関連する値が出力されます。


                     url ("/posts/")
                    ⊢-^-⊣
       baseurl      section ("posts")
⊢--------^---------⊣⊢-^-⊣
        permalink
⊢----------^-------------⊣
https://example.com/posts/index.html

セクション は好きなだけ深くネストすることができます。理解すべき重要なことは、セクションツリーを完全にナビゲートするためには、少なくとも一番下のセクションにはコンテンツファイル (つまり _index.md) を含める必要があるということです。

セクション内のシングルページ

各セクション内の単一のコンテンツファイルは、シングルページ テンプレート としてレンダリングされます。以下は、posts の中にある単一の post の例です。

                   path ("posts/my-first-hugo-post.md")
.       ⊢-----------^------------⊣
.      section        slug
.       ⊢-^-⊣⊢--------^----------⊣
content/posts/my-first-hugo-post.md

Hugo がサイトをビルドすると、コンテンツは以下の宛先に出力されます。


                               url ("/posts/my-first-hugo-post/")
                   ⊢------------^----------⊣
       baseurl     section     slug
⊢--------^--------⊣⊢-^--⊣⊢-------^---------⊣
                 permalink
⊢--------------------^---------------------⊣
https://example.com/posts/my-first-hugo-post/index.html

パスの説明

以下の概念は、プロジェクトの構成と、Web サイトの出力をビルドする際の Hugo のデフォルトの動作の関係について、より深く理解するのに役立ちます。

section

デフォルトのコンテンツタイプは、コンテンツアイテムが格納されるセクションによって決定されます。 section はプロジェクトの content ディレクトリ内の位置によって決まります。section はフロントマターで指定したりオーバーライドしたりすることは できません

slug

slug は URL パスの最後のセグメントで、ファイル名で定義され、オプションでフロントマターの slug 値で上書きされる。 詳細は、URL 管理 を参照してください。

path

コンテンツの path は、セクションのファイルへのパスによって決定されます。ファイルの path は、

  • コンテンツの場所へのパスに基づき、かつ
  • スラグを含みません

url

url は URL パス全体であり、ファイルパスによって定義され、オプションでフロントマターの url 値によって上書きされます。 詳細は、URL 管理 を参照してください。