【WordPress】Markdown記法でリンクをtarget=”_blank”にする方法

Markdown記法 リンク target blank

Markdown、使ってますか?

WordPressでもMarkdown記法が使えるんですけど、めっちゃ便利ですよね。

で、Markdown記法でリンクを作成した場合、target=”_blank”がつかずに全てのリンクが同タブで開いてしまうんですが、それを別タブで開くようにする方法を紹介します。

Markdownでリンクを作成する方法

Markdownでリンクを挿入する場合は以下のように書きます。

[link](URL)

これをHTMLにすると以下になります。

<a href="URL">link</a>

これだとどんなリンクも同タブで開いてしまいますね。

まぁ直にHTMLで書けばいいんですけど、Markdownに慣れるとまじで面倒なんですよね…

Markdownでリンクにtarget=”_blank”を付与する

Markdownで書いたリンクにtarget=”_blank”を付与するには、header.phpに以下を記載します

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script language="JavaScript">
$(document).ready( function () {
   $("a[href^='http']").attr('target', '_blank');
})
</script>

これだと全てのリンクにtarget=”_blank”が付きますが、同じドメイン内のリンクは新規タブで開きたくないという場合もあると思います。

そういう場合は以下を記載してください。

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

こうすると内部リンクは同タブで開き、外部リンクは新規タブで開く、という感じになります。


Markdownマンは是非活用してみてください。

『Web』カテゴリの人気記事