web-dev-qa-db-ja.com

Markdownで 'target = "_ blank"'のリンクを作成できますか？

新しいウィンドウで開くリンクをMarkdownで作成する方法はありますか？そうでない場合は、どのような構文を使用することをお勧めします。私が使用するマークダウンコンパイラにそれを追加します。私はそれが選択肢であるべきだと思います。

htmlhyperlinkmarkdowntargetnew-window
357
ma11hew28

Markdownの構文に関しては、それを詳細に知りたいのであれば、HTMLを使用するだけです。

<a href="http://example.com/" target="_blank">Hello, world!</a>

私がこれまで見たほとんどのMarkdownエンジンは、一般的なテキストマークアップシステムではうまくいかないような単純なHTMLを許可しています。 （たとえばStackOverflowエンジン）Markdownのみの文書でもXSS攻撃を簡単に含むことができるので、これらは関係なく、HTMLのホワイトリストフィルタを介して出力全体を実行します。そのため、あなたやあなたのユーザーが_blankリンクを作りたいのであれば、おそらくそれでも可能です。

それがあなたが頻繁に使用することになる機能であるなら、それはあなた自身の構文を作成することは理にかなっているかもしれませんが、それは一般的に重要な機能ではありません。そのリンクを新しいウィンドウで起動したい場合は、Ctrlキーを押しながらクリックしてください。

298
Matchu

Kramdown がそれをサポートします。標準のMarkdown構文と互換性がありますが、多くの拡張もあります。あなたはこのようにそれを使うでしょう：

[link](url){:target="_blank"}
296
farnoy

マークダウン機能はないと思います。

あなたが自分のサイトの外側にあるリンクをJavaScriptで自動的に開くには、他に利用可能なオプションがあるかもしれませんが。

var links = document.links;

for (var i = 0, linksLength = links.length; i < linksLength; i++) {
   if (links[i].hostname != window.location.hostname) {
       links[i].target = '_blank';
   } 
}

jsFiddle 。

あなたがjQueryを使っているなら、それは少し単純です...

$(document.links).filter(function() {
    return this.hostname != window.location.hostname;
}).attr('target', '_blank');

jsFiddle 。

100
alex

Markdown-2.5.2では、これを使うことができます。

[link](url){:target="_blank"}
43
meduvigo

私のプロジェクトではこれをやっていてそれはうまくいきます：

[Link](https://example.org/ "title" target="_blank")

リンク

しかし、すべてのパーサーがそれを可能にするわけではありません。

6
user5036455

あなたはそのようなネイティブのJavaScriptコードを通してこれをすることができます：

 
var pattern = /a href=/g;
var sanitizedMarkDownText = rawMarkDownText.replace(pattern,"a target='_blank' href=");

JSFiddleコード

6
MrPenguin Pablo

私はGrav CMSを使っていますが、これは完璧に動作します。

本文/コンテンツ
Some text[1]

ボディ/参照：
[1]: http://somelink.com/?target=_blank

ターゲット属性が最初に渡されることを確認してください。リンクに追加の属性がある場合は、それらを参照URLの末尾にコピー/貼り付けします。

直接リンクとしても機能します。
[Go to this page](http://somelink.com/?target=_blank)

6
Peter Danshov

ゴーストマークダウンの場合：

[Google](https://google.com" target="_blank)

ここでそれを見つけた： https://cmatskas.com/open-external-links-in-a-new-window-ghost/

6
guya

1つのグローバルな解決策はあなたのページの<base target="_blank">要素に<head>を入れることです。それは事実上すべてのアンカー要素にデフォルトのターゲットを追加します。私はWordpressベースのWebサイト上にコンテンツを作成するためにマークダウンを使用しています、そして私のテーマカスタマイザはすべてのページのトップにそのコードを注入させるでしょう。あなたのテーマがそれをしない場合、 プラグインがあります

5
aholub

簡単な方法はありません。@alexがJavaScriptを使用する必要があると述べているように。彼の答えは最善の解決策ですが、それを最適化するためには、ポストコンテンツリンクのみにフィルタをかけたいと思うかもしれません。

<script>
    var links = document.querySelectorAll( '.post-content a' );  
    for (var i = 0, length = links.length; i < length; i++) {  
        if (links[i].hostname != window.location.hostname) {
            links[i].target = '_blank';
        }
    }
</script>

このコードはIE8 +と互換性があり、ページの下部に追加できます。 ".post-content a"をあなたがあなたの投稿に使っているクラスに変更する必要があることに注意してください。

ここに見られるように： http://blog.hubii.com/target-_blank-for-links-on-ghost/

4
midudev

そのため、Markdown URLにリンク属性を追加できないのは事実ではありません。属性を追加するには、使用されている基礎となるマークダウンパーサーとその拡張機能を確認してください。

特に、 pandoc には、マークアップを可能にする link_attributes を有効にする拡張機能があります。リンクに。例えば.

[Hello, world!](http://example.com/){target="_blank"}
  • Rから来た人（例えばrmarkdown、bookdown、blogdownなどを使う）の場合、これはあなたが望む構文です。
  • Rを使用していない人のために、+link_attributesを使ってpandocを呼び出すときに 拡張子 を有効にする必要があるかもしれません

注：これは、 kramdown パーサーのサポートとは異なります。特に、kramdownは中括弧 - :の先頭にコロン - {} - を必要とするため、pandocとは異なります。

[link](http://example.com){:hreflang="de"}

特に：

# Pandoc
{ attribute1="value1" attribute2="value2"}

# Kramdown
{: attribute1="value1" attribute2="value2"}
 ^
 ^ Colon
3
coatless

これは私のために働く：[ページリンク]（ここにあなたのURLは "（ターゲット| _blank）"）

0
Jose Espin

GNU sed＆makeを使用して、外部リンクに対してのみ自動化されています

すべての外部リンクに対して体系的にこれを実行したい場合は、 CSSを選択することはできません 。ただし、Markdownから（X）HTMLが作成されたら、次の sed コマンドを実行できます。

sed -i 's|href="http|target="_blank" href="http|g' index.html

これは、上記のsedコマンドをmakefileに追加することでさらに自動化できます。詳細については、GNU make または 自分のやり方を参照してください / - 自分のWebサイト .

0
Serge Stroobandt

私はそれが1つのブラウザタブ内に留まることがより良いユーザーエクスペリエンスであることに同意しません。あなたが他の人にあなたのサイトにとどまって欲しいなら、あるいはその記事を読み終えるために戻ってきたいなら、彼らを新しいタブで送りなさい。

@ davidmorrowの答えに基づいて、このJavaScriptをあなたのサイトに投げ入れ、ただ外部リンクをtarget = _blankのリンクに変えてください。

    <script type="text/javascript" charset="utf-8">
      // Creating custom :external selector
      $.expr[':'].external = function(obj){
          return !obj.href.match(/^mailto\:/)
                  && (obj.hostname != location.hostname);
      };

      $(function(){
        // Add 'external' CSS class to all external links
        $('a:external').addClass('external');

        // turn target into target=_blank for elements w external class
        $(".external").attr('target','_blank');

      })

    </script>
0
Danny

完成したアレックスは答えました（Dec 13 '10）

このコードを使用して、よりスマートなインジェクションターゲットを作成できます。

/*
 * For all links in the current page...
 */
$(document.links).filter(function() {
    /*
     * ...keep them without `target` already setted...
     */
    return !this.target;
}).filter(function() {
    /*
     * ...and keep them are not on current domain...
     */
    return this.hostname !== window.location.hostname ||
        /*
         * ...or are not a web file (.pdf, .jpg, .png, .js, .mp4, etc.).
         */
        /\.(?!html?|php3?|aspx?)([a-z]{0,3}|[a-zt]{0,4})$/.test(this.pathname);
/*
 * For all link kept, add the `target="_blank"` attribute. 
 */
}).attr('target', '_blank');

あなたは(?!html?|php3?|aspx?)グループ構造でより多くの拡張子を追加することによって正規表現の例外を変更することができます（ここでこの正規表現を理解してください： https://regex101.com/r/sE6gT9/3 ）。

そしてjQueryがないバージョンの場合は、以下のコードをチェックしてください。

var links = document.links;
for (var i = 0; i < links.length; i++) {
    if (!links[i].target) {
        if (
            links[i].hostname !== window.location.hostname || 
            /\.(?!html?)([a-z]{0,3}|[a-zt]{0,4})$/.test(links[i].pathname)
        ) {
            links[i].target = '_blank';
        } 
    }
}
0
Bruno Lesieur

{[attr] = "[prop]"}を使って任意の属性を追加できます

例えば[Google]（ http://www.google.com ）{target = "_blank"}

0
leonardli

PHPを使用してマークダウンを実装しようとしたとき、私はこの問題に遭遇しました。

ユーザーがマークダウンで作成されたリンクを新しいタブで開く必要がありますが、サイトリンクはタブ内に留まる必要があるため、マークダウンを変更して新しいタブで開くリンクのみを生成します。そのため、ページ上のすべてのリンクがリンクアウトするわけではなく、マークダウンを使用するリンクだけがリンクアウトされます。

マークダウンで、私はすべてのリンク出力を<a target='_blank' href="...">に変更しました。これはfind/replaceを使って十分に簡単でした。

0
user3167223