Roman Böhm

Use Raw HTML in Hugo’s Markdown

2023-01-02

Problem

I want the link to this blog in my Mastodon profile to be “verified” (green) link. This is done by adding a custom anchor element somewhere on the site:

<a rel='me' href='https://mastodon.social/@romanboehm'>Mastodon</a>

By default, however, Hugo, the static site generator of my choice, does not permit this.

Solution

If you don’t like to activate the renderer’s unsafe mode in order to be able to insert raw html, you can achieve this with so-called shortcodes:

1. Create an HTML file under layouts/shortcodes. I called it rawhtml.html.
2. Put just the text {{.Inner}} as the file’s content.
3. Use it like {{< rawhtml >}}<b>foo</b>{{< /rawhtml >}}.

Or, for the case of adding the “verifiable” link:

{{< rawhtml >}}<a rel='me' href='https://mastodon.social/@romanboehm'>Mastodon</a>{{< /rawhtml >}}

(Note the single quotes for the attribute values)

You can view the whole commit on GitHub.