How to Add Links to Headings in A Hugo Post

I tried the render hooks for headings , a new feature released in Hugo 0.71. However, it didn’t work for me.

I then go back to the solution suggested by frerich . It worked.

I changed the ¶ to #.

According to frerich, what you need to do is to add add-header-anchors.html whose content is shown below to /layouts/partials.

{{ . | replaceRE "(<h[1-9] id=\"([^\"]+)\".+)(</h[1-9]+>)" `${1}<a href="#${2}" class="header-anchor" ariaLabel="Anchor">&para;</a>${3}` | safeHTML }}

Then, in /layouts/_default/single.html, replace {{ .Content }} with {{ .Content | partial "add-header-anchors" }}.

Last modified on 2020-10-05