Show related content in Hugo

Hugo has a built-in related content feature. To list up to 3 related pages include this partial in your single page template. It will match up pages based on common tags and will show the three most likely.

Add sample code in layouts/partials/related.html.

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

And then include this partial template in one of your default template that you want to show. For example you can show related content in your _default/single.html, so it appears on every blog post.

Hugo’s related content default configuration ( config.yaml):

related:   
includeNewer: false
indices:
- name: keywords
weight: 100
- name: date
weight: 10
threshold: 80
toLower: false

Originally published at https://ronaldsvilcins.com on February 13, 2022.

--

--

I drink a lot of tea and build beautiful websites. If you are looking to work together or just start a conversation 👉 https://www.ronaldsvilcins.com/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ronalds Vilcins

I drink a lot of tea and build beautiful websites. If you are looking to work together or just start a conversation 👉 https://www.ronaldsvilcins.com/