Hugo RSS Improvements

Posted on November 22, 2022 • 2 minutes • 362 words

This site is generated with hugo which I love, but the default RSS template is very basic. I wanted to make the RSS feed better for people using readers and share what I did.

My goals were:

Make the RSS feed include the full article text
Add banner images
Add a feed thumbnails

The default hugo RSS template is good enough to get started, but didn’t have these things and I wanted the experience to be better for the 9 of you who subscribe.

What I ended up with was first adding the <image> tag to the template which is a default RSS element and when you load a feed in a reader should fetch the image.

<image>
    <url>{{ $.Site.BaseURL }}img/profile.png</url>
    <title>{{ if eq  .Title  .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}}{{ end }}{{ end }}</title>
    <link>{{ $.Site.BaseURL }}</link>
</image>

The frontmatter of my posts all have a thumbnail parameter with the main image which shows up at the top of the page and as the open graph image when you share it on social media. Feedly documentation says it will use an open graph image, but it doesn’t appear to be working for my feed so I added the image manually.

<description>
   {{ printf "<![CDATA[<img src=\"%s\"/> ]]/>" $.Params.thumbnail }}
   {{ .Content | html }}
</description>

Now when you read the feed you see thumbnail images and full pictures for each item.

Instead of using {{ .Summary }} I used {{ .Content }} which puts the full article text directly in the feed.

Finally, I found some additional integrations with Feedly , but I’m not sure how widely they’re supported.

<webfeeds:cover image="{{ $.Site.BaseURL }}img/og-image.png" />
<webfeeds:icon>{{ $.Site.BaseURL }}img/profile.png</webfeeds:icon>
<webfeeds:accentColor>DBEAFE</webfeeds:accentColor>
<webfeeds:related layout="card" target="browser"/>

This gave me a nice thumbnail icon for the feed itself. I haven’t noticed the accent color working, but maybe I’m missing something, or it’s the fact that I’m color blind.

I found some of these tips from their article about improving reader experience and if you know about other RSS extensions like webfeeds I’d love to hear about them.

You can check out my full RSS template here and you can subscribe in any RSS reader here