Hugo のスニペット集

このページは、Hugo のスニペットなどをまとめる予定のページです。

目次

注意

  • コードのライセンスは CC0 (クレジット表示不要、改変可、商用可) です。

スニペット

URLフィンガープリント

※ resources.Get で取得するファイルは /themes/***/assets 内に配置されている必要があります。

CSS

{{- $css := resources.Get "test.css" -}}
{{- $secureCSS := $css | resources.Fingerprint "sha512" -}}
<link rel="stylesheet" href="{{ $secureCSS.Permalink }}" integrity="{{ $secureCSS.Data.Integrity }}">

JavaScript

{{- $js := resources.Get "test.js" -}}
{{- $secureJS := $js | resources.Fingerprint "sha512" -}}
<script src="{{ $secureJS.Permalink }}" integrity="{{ $secureJS.Data.Integrity }}"></script>

JSON 読み込み

{{- $json := getJSON "data/test.json" -}} <!-- サイトのルートフォルダからのパスを指定してファイル読み込み -->
{{ $json }} <!-- ダンプ確認 -->
{{- range $key, $val := $json -}} <!-- ループ (Mapの場合) -->
    {{ $key }} {{ $value }}
{{- end -}}

JSON出力

1. config.toml に出力形式の設定を追加します。 (例: meta)

[outputFormats.meta]
baseName = "meta"
isPlainText = true
mediaType = "application/json"
notAlternative = true

[outputs]
home = [ "HTML", "RSS", "meta" ]

2. themes/***/layouts/_default/list.形式名.json を配置します。

{{- $.Scratch.Add "index" slice -}}
{{- range .Data.Pages -}}
  {{- if and (not .Draft) (not .Params.private) -}}
    {{- $item := newScratch -}}
    {{- $item.SetInMap "item" "objectID" .UniqueID -}}
    {{- $item.SetInMap "item" "date" .Date.UTC.Unix -}}
    {{- $item.SetInMap "item" "title" .Title -}}
    {{- $item.SetInMap "item" "description" .Description -}}
    {{- $item.SetInMap "item" "permalink" .Permalink -}}
    {{- $item.SetInMap "item" "publishdate" .PublishDate -}}
    {{- $item.SetInMap "item" "url" .URL -}}
    {{- $item.SetInMap "item" "tags" .Params.Tags -}}
    {{- $item.SetInMap "item" "categories" .Params.Categories -}}
    {{- $item.SetInMap "item" "content" .Plain -}}
    {{- $.Scratch.Add "index" ($item.Get "item") -}}
  {{- end -}}
{{- end -}}
{{- $.Scratch.Get "index" | jsonify -}}

3. hugo server 実行後、http://localhost:1313/形式名.json を開いて出力されているか確認します。