やりたいこと

最近 HUGO でコーポレートサイトを作っています。

そのトップページに

「記事 & お知らせ一覧」

が必要になり、実装しました。

HUGO のセクション

セクションはカテゴリの上位概念で、

「WordPress で言うところの 投稿タイプ」

に相当するというように理解すると良さそうです。

HUGO は content 以下にディレクトリを作成すると、それをセクションとして認識してくれます。
めちゃくちゃ簡単です。

任意のセクションを、柔軟に追加できるのはとても便利ですね。


今回実装したサイトでは次のようにセクションわけを行いました。

page 固定ページ
post ブログ記事
info おしらせ

セクションひとつなら

例えば「ブログ記事の一覧」は、次のコードで表示できます。

1{{ $paginator := .Paginate (where .Data.Pages "Type" "post") }}
2{{ range $index, $element := $paginator.Pages }}
3  {{ .Render "article_item" }}
4{{ end }}

おおかたのテーマがこのように実装されていて、これは良いと思います。

複数セクションは ?

では、複数のセクションを混在させるにはどうすればよいでしょうか ?

それは Type in で複数セクションを指定するです。

複数セクションを扱うコード

config.toml に、セクションを定義します。

1# config.toml
2
3[params]
4frontPageSections = [
5  "post",
6  "info"
7]

テンプレートのコードを次のようにし、追加したセクションを指定します。

1{{ $paginator := .Paginate (where .Data.Pages "Type" "in" .Site.Params.frontPageSections) }}
2{{ range $index, $element := $paginator.Pages }}
3  {{ .Render "article_item" }}
4{{ end }}

これで OK です。


ポイントなのが セクションを config.toml などに定義しておくことですね。

テンプレートで

1"Type" "in" ["post", "info"]

のようなに直指定したかったのですが、これだとコンパイルできませんでした。

Golang 得意な方は楽勝案件かもですが。


この方法は公式のドキュメントの次を見て対応しました。

HUGO functions where
https://gohugo.io/functions/where/#mainsections

正規品 Hugo Vapor Rader Mage 218W TC Box MOD ハイエンド電子タバコ あいこす本体セット 電子タバコ かっこいい (黒)

2A急速充電 選択のためのさまざまなパターン 218W出力のデュアル18650セル VW / TC /カーブ/予熱をサポート ナイロンファイバーフレーム付き軽量ボックスモッズ

Amazonで詳細を見る