Open external links in new tab with Goldmark markdown renderer in Hugo

28 May 2021 3 min read webdev

Goldmark doesn’t have this feature by default, but it’s easy to add.

Agrim Prasad explains it in this post, thanks Agrim.

TLDR: Create a file at themes/bilberry-hugo-theme/layouts/_default/_markup/render-link.html with the following content:

<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if strings.HasPrefix .Destination "http" }} target="_blank"{{ end }}>{{ .Text | markdownify }}</a>

Now for any markdown links you write, if the URL is absolute (i.e. starts with http* rather than just a relative link like /example) then the resulting HTML a tag will have the target="_blank" property. You can add other protocols if you commonly link to ftp://, for example.

Note the addition of | markdownify }} at the end. This is required if you want to style your links (e.g. bold, italics) inside your markdown.

comments powered by Disqus