Hugo v0.62以降で、新しいタブで外部リンクを開くようにする方法

このWebサイトは目下のところ、Hugoというフレームワークを使用して作られているのだが、 ずっと気になることがあった。

Markdown記法で外部リンクを以下のように記述すると、同じタブでリンクが開くようになってしまう。

[Google](http://google.com)

これは、.md.htmlに変換される際に、target="_blank"属性がつかないせいである。

このWebサイトで外部リンクを貼る場合は、ほとんどが参考情報的に貼る場合なので、 外部リンクを別タブで開くようにすることにはインセンティブがある。

いくつか日本語でやり方を探してみたが、私の環境では使えない少し昔のやり方が多かったので、 ここに現状動作する方法をメモする。

Google検索でヒットする方法がなぜ私の環境で使えなかったかというと、 実は、Hugoの既定のマークダウンレンダラがHugo version 0.62でBlackfridayからGoldmarkに変更されたからだ。

Blackfridayでは、config.tomlに数行追加するのだが、Goldmarkではそうではない。

Goldmarkでは、以下のようにする。

layouts/_default/_markup/render-link.htmlというファイルを作成し、以下の内容を記述する。

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

Agrim Prasad氏の投稿がまとまっている。

hugo-goldmark-markdown

HugoのデフォルトのレンダラがGoldmarkに変更されたと同時に導入された、 Markdown Render Hooks という機能を使用して、レンダラの挙動をフックしている。

このフックでは、相対パスで記述されたURL(つまり、内部リンク)は同じタブで、フルパスで記述されたURLは別タブで開くようになる。