Hugoで関連記事を表示する方法
目次
関連記事の一覧表示
Hugoには関連記事を表示させる機能がデフォルトで備わっているため、テンプレートを修正すれば関連記事を表示させることが可能です。
関連記事を表示させる方法
関連記事用のHTMLファイル作成
Hugoのテーマフォルダー内のlayouts/partials
フォルダーに関連記事用のHTMLファイル(related.html
)を作成します。
|
|
singleページテンプレート修正
Hugoのテーマフォルダー内のlayouts/_default/single.html
の関連記事を表示させたい部分に{{ partial "related.html" . }}
を追記します。
|
|
表示される関連記事の調整
Hugoはデフォルトで関連記事を取得する設定が行われていますが、表示する記事を調整したい場合はhugo.toml
に[related]
設定を追加します。
|
|
tags
やcategories
などに重み(weight
)を設定し、重みがしきい値(threshold
)を超えると関連記事として表示されるようになります。
[related]
設定で使用されるオプションは以下の通りです。
トップレベルの設定オプション
オプション | 内容 |
---|---|
includeNewer |
true を設定すると現在のページよりも新しいページを関連記事に含める |
threshold |
関連記事を表示させるしきい値(0 - 100 の値を設定) |
toLower |
true を設定するとキーワードを小文字にして比較する |
インデックスごとの設定オプション
オプション | 内容 |
---|---|
name |
マッピングに使用する値(tags , keywords , date など)を指定 |
weight |
パラメーターの重みを設定(負の値も設定可能) |
pattern |
"2006" を設定すると同じ年、"200601" を設定すると同じ年月に重みが加わる( date のみで有効) |
toLower |
true を設定するとキーワードを小文字にして比較する |