Hugoの基本文法チートシート【入門編】

2020-03-11

Hugoの公式ページにある基本文法をメモしておきます。この文法で書かれたコンテンツをGolangテンプレートと呼ぶようです。

以下にイントロダクションが記載されています。

≫ Introduction to Hugo Templating | Hugo

イントロダクションの冒頭に以下のような記載があります。

Golang templates are HTML files with the addition of variables and functions. Golang template variables and functions are accessible within {{ }}.

つまりmarkdownで書かれたコンテンツに対し{{ }}を使ってに部分的にコードを埋め込むことで、Hugoのコンパイルに対応したコンテンツを作ることが出来ます。

以下で解説する文法一覧はここにあります。

≫ Functions Quick Reference | Hugo

変数と基本的な型

変数の代入と表示

以下のコードで定義済みの変数fooにアクセスできます。

{{ foo }}

加算は以下のように行います。以下は１＋２を表しています。

{{ add 1 2 }}

ページ内パラメータ として定義したbarにアクセスするには以下のように.をつけます。

{{ .Params.bar }}

以下は変数に文字列を代入したのち、表示させるサンプルです。

{{ $address := "123 Main St."}}
{{ $address }}

$が先頭につくと変数として扱われます。代入は:=の演算子を用いることで実現できます。変数の内容を表示するには２行目のように単純に呼び出せばOKです。

条件分岐

if文とor

if文にorの条件をつけたサンプルです。

{{ if or (isset .Params "alt") (isset .Params "caption") }} Caption {{ end }}

.Paramsにaltまたはcaptionの文字列が設定されていればCaptionの表示を有効にします。 issetは第２引数に指定された変数の値が第３変数と一致すればtrueを返します。

else if

上記のif文はelse ifを使って以下のようにも記述できます。

{{ if isset .Params "alt" }}
    {{ index .Params "alt" }}
{{ else if isset .Params "caption" }}
    {{ index .Params "caption" }}
{{ end }}

with

ifの代わりにwithを使うことも出来ます。 withは引数に指定された値があれば表示、なければスキップできます。以下は.Params.titleに値があればh4タグを表示させる例です。

{{ with .Params.title }}<h4>{{ . }}</h4>{{ end }}

andとor

andとorを組み合わせた例は次のようになります。

{{ if and (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}}

.Paramsにattrがあり、かつtitleまたはcaptionがあれば上記の判定は有効になります。うーん、、見づらいですね。。

比較

eq ( == )

eqは一致を判定します。以下の例では.Sectionの値がblogでならばcurrentを出力します。

{{ if eq .Section "blog" }}current{{ end }}

ne ( != )

neはおそらくNot equalの略ですね。不一致を判定します。以下の例では.Sectionの値がblogでなければcurrentを出力します。

{{ if ne .Section "blog" }}current{{ end }}

gt ( > )

gtはGrater thanですかね？以下の例では10は５より大きいのでtrueが出力されます。

{{ if gt 10 5 }}true{{ end }}

ge ( >= )

geはgreater than or equal toの略でしょうか。以下の例では10は５以上なのでtrueが出力されます。

{{ if gt 10 5 }}true{{ end }}

lt ( < )

ltはless thanですね。以下の例では5は10より小さいのでtrueが出力されます。

{{ if lt 5 10 }}true{{ end }}

le ( <= )

leはless than or equal toですね。以下の例では5は10以下なのでtrueが出力されます。

{{ if le 5 10 }}true{{ end }}

比較のまとめ

記号	意味
eq	==	equal
ne	!=	not equal
gt	>	greater than
ge	>=	greater than or equal to
lt	<	less than
le	<=	less than or equal to