Hugoで構成ファイル(config.yml)に設定された情報を参照する方法
Hugoで構成ファイル(config.yml)に設定された情報を参照する方法を説明します。
構成ファイルの基本
Hugoサイトの一般設定はルートディレクトリに置き、次の構成ファイルのいずれかを使用する。ファイルが複数ある場合は、最初に見つかった内容が選択される。
| ファイル名 | 説明 |
|---|---|
config.toml |
TOML形式で記述(デフォルト) |
config.yaml |
YAML形式で記述 |
config.json |
JSON形式で記述 |
config.tomlの記述例
baseURL = "https://www.devkuam.com/"
languageCode = "ko-kr"
title = "私のブログ"
themesDir = "../hugo_themes"
theme = "devkuma"
設定可能なパラメータやそれぞれのデフォルト値は、以下に一覧がある。
設定値の参照
Hugoが定義したパラメータを参照する
構成ファイルで設定したパラメータは、テンプレートファイル内で.Site変数を使って参照できる。たとえば、config.tomlファイルで設定したtitleパラメータやbaseURLの値は次のように参照できる。
このサイトのタイトルは <b>{{ $.Site.Title }}</b> です。
このサイトの基本URLは <b>{{ $.Site.BaseURL }}</b> です。
パラメータ名の先頭は大文字になり、.Site.titleではなく.Site.Titleとなる。それぞれの設定値をどのプロパティ名で参照できるかは、下のSite変数一覧を見ると分かる。
パラメータが設定されているかどうかによって処理を分岐させるには、次のように記述する。
{{ with $.Site.GoogleAnalytics }}
Google AnalyticsのTracking IDは <b>{{ . }}</b> です。
{{ else }}
Google AnalyticsのTracking IDは設定されていません。
{{ end }}
上の例ではgoogleAnalyticsパラメータを使い、Google Analyticsの追跡IDが設定されているかを確認している。
ユーザー定義パラメータを参照する
構成ファイルでユーザー定義パラメータを設定するには、paramsセクションの下にパラメータを追加する。
config.toml
baseURL = "https://www.devkuam.com/"
languageCode = "ko-kr"
title = "私のブログ"
[params]
GitHubUser = "redfreek2c"
Twitter = "kimkc"
Subtitle = "技術共有"
Description = "ここではサイト詳細情報を記録する"
SidebarRecentLimit = 5
ListOfFoo = ["foo1", "foo2"]
ユーザー定義パラメータは、テンプレートファイル内から$.Site.Params.名前の形式で参照できる。
次の例では、ユーザー定義パラメータ変数のDescription値を参照する。
layouts/partials/head.html
<meta name="description" content="{{ if .IsHome }}{{ $.Site.Params.description }}{{ else }}{{ .Description }}{{ end }}" />
ここでは、メインの最初のページ(ホームページ)では構成ファイルの設定($.Site.Params.Description)を参照し、それ以外のページでは各ページのFront matterに設定されたdescriptionの値を参照するようになっている。