Markdownでリンクにtarget="_blank"を付けて別タブ表示にする

Markdownでリンクを作成する場合、

[アンカーテキスト](URL)

と書くだけなのでとても便利です。 しかし、リンク先を別タブで開きたい場合には 残念ながらMarkdownでは対応していません。

target="_blank"を付ける方法は２つあります。

  • 自分でアンカータグを記述する
  • jQueryを使って自動的にtarget="_blank"を付けるようにする

自分でアンカータグを記述する

自分で記述する場合は次のようになります。

<p><a href="https://sample.com/" target="_blank">アンカーテキスト</a></p>

jQueryでtarget="_blank" を付ける

ここではjQueryを使う方法を説明します。ブログやHTMLサイトの ヘッダーに以下のコードを追加するだけです。

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js”></script>
<script language="JavaScript">
$(document).ready( function () {
   $("a[href^='http']:not([href*='" + location.hostname + "'])").attr('target', '_blank');
})
</script>

これで自動的に別ドメインの場合だけ target="_blank" が付けられます。 同じドメインの場合は今までどおりtarget="_blank"は付きません。 とても簡単な設定なのでおすすめです。

jQueryのバージョンはその時点での最新バージョンを参照すれば大丈夫です。

Markdown入門