🔗

[Hugo] リンクに target="_blank" をつける

方法

config.toml に以下の設定を追加する。

config.toml
[blackfriday]
    hrefTargetBlank = true

blackfriday は、Markdown を HTML に変換するためのライブラリ (Markdown エンジン)。 この設定は md を HTML に変換するタイミングで、リンクに target="_blank" をつけてくれるみたい。

内部リンクはどうなるのか?

リンクが新しいタブで開くのはいいけれど、内部リンクまでそうなると困る。 hrefTargetBlank の仕様をドキュメントで確認してみる。

hrefTargetBlank

default: false

Blackfriday flag: HTMLHREFTARGET_BLANK

Purpose: true opens external links absolute links in a new window or tab. While the target=”_blank” attribute is typically used for external links, Blackfriday does that for all absolute links (ref).

━━Blackfriday Options

どうやら絶対パスは新しいタブで、相対パスは同じタブで開くらしい。 実際、以下のようになった。

[abs](http://localhost:1313/posts/) # 新しいタブで開く
[rel](/posts/)                      # 同じタブで開く

これでリンクを新しいタブで開けるようになったけど、これでは絶対パスと相対パスを混在させないといけない。 書き分ければいいだけの話なのだけど、かなり面倒。

できるだけ楽をしたいので、もう少し調べる。 ドキュメントをもう少し読み進めるとこんな記述が。

One needs to make note of this if they use absolute links throughout, for internal links too (for example, by setting canonifyURLs to true or via absURL).

━━Blackfriday Options

ドキュメントにしたがって、以下の設定を追加。

config.toml
canonifyURLs = true

canonifyURLs では、ページ内の相対パスをそのまま表示するか、絶対パスに書き換えて表示するかを設定できる。デフォルトでは false、つまり、相対パスのまま表示する。

これを絶対パスに書き換えると、絶対パスの内部リンクでも同じタブで開くようになった。もちろん、外部リンクは新しいタブで開く。