HugoのRelated Contentを利用して関連記事を表示する

更新日:2023.05.05 作成日:2017.10.07
#Hugo #関連記事 #Blog

いつのまにかHugo 0.29から関連コンテンツ表示機能が追加されています。これによって他のCMSではプラグインで簡単にできていたのに、Hugoではできないというポイントが解消されました。もはや、Hugo最強説！！。

さっそくこのブログにも試してみました。

使い方は、ドキュメントを見ていただければ分かると思いますが、.Site.RegularPages.Relatedに関連ページが含まれているのでそれを表示するだけです。

{{ $related := .Site.RegularPages.Related . | first 10 }}
{{ with $related }}
<h3>See Also</h3>
<ul>
	{{ range . }}
	<li><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
	{{ end }}
</ul>
{{ end }}

そうすると、以下の通りいい感じで関連記事を出してくれます。関連記事表示のスニペットを入れたからといって、ビルド時間が遅くなったというのは感じられませんでした。(元々爆速なので）

Hugo 関連記事

関連記事をどのように抽出しているかは、おいおいドキュメントやソースを確認してみたいと思います。

Hugoで始める静的サイト構築入門　静的サイトジェネレーターで作る自作サイト (技術の泉シリーズ（NextPublishing）)
Hugoで始める静的サイト構築入門　静的サイトジェネレーターで作る自作サイト (技術の泉シリーズ（NextPublishing）)
インプレスR&D
AmazonKindle楽天市場Yahoo!ショッピング

Related contents