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を設定するとキーワードを小文字にして比較する |