独学者Fossa

独学していることなど

Hugo Data Templates (4)

Hugo
Hugo

使用環境

Name Version
Hugo v0.121.2-extended

前書き

fossa-hobby.hatenablog.com

前回から、ずっと気になっていたことが、2つあります。

1つ目は、Data Templatesのデータは、どんな感じなのか?

2つ目は、Data Templatesのデータに、似たデータを作ってみたい。

準備(1)

dataディレクトリに、下記のファイルを設置します。*1

  • data/components/cards.yml
  • data/components/forms.yml

cards.ymlの中身は、下記の通りです。*2

filename: cards
title: Card

準備(2)

contentディレクトリに、下記のファイルを設置します。

  • content/components/cards.md
  • content/components/forms.md

cards.mdの中身は、下記の通りで、フロントマターのみで、コンテンツはありません。*3

---
title: "Cards"
---

本題

1.Data Templatesのデータを見てみる

{{ $items := index .Site.Data "components" }}

<pre>
  <code>
    {{ $items | jsonify (dict "indent" "  ") }}
  </code>
</pre>
{
  "cards": {
    "filename": "cards",
    "title": "Card"
  },
  "forms": {
    "filename": "forms",
    "title": "Form"
  }
}

2.似たようなデータを作る

Data Templatesと似たようなデータにしておけば、indexで取り出しやすいと思いました。

早速、試してみました。

{{- $rows := slice -}}
{{- $components := where $.Site.RegularPages "Section" "components" -}}

{{- range $components -}}
  {{- $filename := .File.BaseFileName -}}
  {{- $rows = merge $rows (dict (slice $filename "filename") $filename) -}}
  {{- $rows = merge $rows (dict (slice $filename "title") .Title) -}}
{{- end -}}

<pre>
  <code>
    {{ $rows | jsonify (dict "indent" "  ") }}
  </code>
</pre>

結果

{
  "cards": {
    "filename": "cards",
    "title": "Card"
  },
  "forms": {
    "filename": "forms",
    "title": "Form"
  }
}

下記のように、indexが使えるようになります。

{{ index $rows "cards" }}

ポイント

ポイントは2つあります。

  • mergeを使う
  • dict (slice "cards" "title") "Card" と記述する

後書き

後日、書きます。

参考文献

*1:不要になれば削除します

*2:forms.ymlは、推測してください

*3:forms.mdは、推測してください