hugo

HUGOのscriptタグ内のURLがエスケープされないようにする方法

: 2023-05-13 | : 2023-07-15

Hugo で JSON-LD を実装していたのですが、script タグ内の URL がエスケープされ、正常な値が設定されていませんでした。script タグ内の URL がエスケープされないようにする方法をメモします。

““を除外する

出力する値を"“で囲っている場合、それを除外することで、URL がエスケープされずに出力されます。

<script type="application/ld+json">
  {
    "@context": "http://schema.org/",
    "@type": "Blog",
    "name": "{{ .Site.Title }}",
    "creator": {
      "@type": "Person",
      "name": "{{ .Site.Params.Author }}"
    },
    "image": {{ $logoURL }}, // ←""で囲まない
    "url": {{ .Site.BaseURL }}, // ←""で囲まない
    "description": "{{ with .Description }}{{ . }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}",
    "license": "https://creativecommons.org/licenses/by-nc-sa/3.0/us/deed.en_US"
  }
</script>

注意点

Hugo のウェブサイトを本番環境にビルドする際、--minifyオプションを付与して圧縮するケースがあると思います。

hugo --gc --minify

その場合、with や if などを直接 JSON-LD の設定値に用いるとエラーが発生し、ビルドに失敗します。

↓ 例: エラーになるパターン

<script type="application/ld+json">
  {
    "@context": "http://schema.org/",
    "@type": "Blog",
    "name": "{{ .Site.Title }}",
    "creator": {
      "@type": "Person",
      "name": "{{ .Site.Params.Author }}"
    },
    "image": {{ with hogehgoe }}{{ . }}{{ end }}, // ←""で囲まないとエラーになってしまう。
    "url": {{ .Site.BaseURL }},
    "description": "{{ with .Description }}{{ . }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}",
    "license": "https://creativecommons.org/licenses/by-nc-sa/3.0/us/deed.en_US"
  }
</script>

このエラーを回避するには、変数に代入したあとにその変数を JSON-LD に設定します。

HUGOのscriptタグ内のURLがエスケープされないようにする方法

““を除外する

注意点

参考

コメントを残す

関連記事