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 Render Hooks
という機能を使用して、レンダラの挙動をフックしている。
このフックでは、相対パスで記述されたURL(つまり、内部リンク)は同じタブで、フルパスで記述されたURLは別タブで開くようになる。