Posso creare collegamenti con 'target = "_ blank"' in Markdown?

462

C'è un modo per creare un collegamento in Markdown che si apre in una nuova finestra? In caso contrario, quale sintassi mi consiglia di fare questo. Lo aggiungerò al compilatore di markdown che uso. Penso che dovrebbe essere un'opzione.

html  hyperlink  markdown  target  new-window 
— ma11hew28
fonte
Quindi, come sottolineato nelle risposte, non è una caratteristica nel markdown. Se vuoi rendere questo un sito predefinito per il collegamento, David Morrow ha la risposta . O se volevi semplicemente farlo in un'istanza, la risposta di Matchu dice che devi effettivamente scriverlo in HTML.
— JGallardo,
— Serge Stroobandt,
La tua domanda non è specifica su cosa stai facendo, ma alcuni motori di markdown o browser (non sono sicuri di quale) riconoscono quando il link che stai creando punta a un dominio diverso e li apriranno in una nuova scheda. Per me, ci sono volte in cui la rimozione di sda https:è abbastanza per ottenere la funzionalità che desidero.
— Josh Gust

Risposte:

379

Per quanto riguarda la sintassi Markdown, se vuoi ottenere questo dettaglio, dovrai solo usare HTML.

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

La maggior parte dei motori Markdown che ho visto consentono un semplice vecchio HTML, solo per situazioni come questa in cui un generico sistema di markup del testo non lo taglierà. (Il motore StackOverflow, ad esempio.) Quindi eseguono l'intero output attraverso un filtro whitelist HTML, indipendentemente dal fatto che anche un documento solo Markdown può contenere facilmente attacchi XSS. Pertanto, se tu o i tuoi utenti volete creare _blankcollegamenti, probabilmente possono ancora farlo .

Se questa è una funzione che utilizzerai spesso, potrebbe avere senso creare la tua sintassi, ma in genere non è una funzione vitale. Se voglio lanciare quel link in una nuova finestra, ctrl-clic io stesso, grazie.

— Matchu
fonte
19
Sai una cosa? Sono d'accordo con te e alex . Ho deciso di non usare _blankaffatto. È un'esperienza utente migliore per mantenere le cose in un browser. Possono semplicemente rispondere o fare clic sui comandi (utente Mac qui :)), come dici tu.
— ma11hew28,
1
Ho javascript eseguito sulla pagina che aggiunge _blank a tutti i link al di fuori del mio dominio. come @alex ha nella prossima risposta
— David Silva Smith
3
Suggerirei (nel desiderio di essere esplicito e inline readable) la seguente sintassi: [Visit this page](http::/link.com(per avere l'idea di apertura .
— Augustin Riedinger,
4
Target semplice = "_ blank" può essere pericoloso! Aggiungi anche rel = "noopener" nel tag! ( sites.google.com/site/bughunteruniversity/nonvuln/… )
— Max Vyaznikov
1
@MaxVyaznikov Interessante. Pensi che sarebbe più sicuro se i browser fornissero una finestra pop-up sopra il bordo per l'accesso? Separare l'interfaccia utente di accesso per i siti Web da un'interfaccia utente di accesso falsa e falsa creata da pagine Web "simili". Potrebbe essere più possibile ora dove era più difficile in passato.
— 1,21 gigawatt
351

Kramdown lo supporta. È compatibile con la sintassi Markdown standard, ma ha anche molte estensioni. Lo useresti così:

[link](url){:target="_blank"}
— farnoy
fonte
7
Questo non sembra funzionare usando il motore Markdown su Mac :-(
— Netsi1964
49
Funziona alla grande con jekyll!
— bholagabbar,
1
La sintassi di kramdown : [nome link] (url_link) {: target = "_ blank"} può essere analizzata in HTML usando l'editor online di kramdown: http://trykramdown.herokuapp.com/ L' ho usato perché ne avevo già parecchi riferimenti kramdown e volevo evitare di riscriverli.
— algoquante
4
C'è un modo in jekyll di impostare questo come predefinito? Vorrei che tutti i collegamenti nei post del mio blog target="_blank"
— fossero
10
Non funziona Rende solo {: target = "_ blank"} come testo.
— Benny
113

Non penso che ci sia una funzione di markdown.

Sebbene possano essere disponibili altre opzioni se si desidera aprire collegamenti che puntano automaticamente all'esterno del proprio sito con 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 .

Se stai usando jQuery è un po 'più semplice ...

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

jsFiddle .

— alex
fonte
1
sono d'accordo con te ma in occasione della tua partecipazione a un iframe devi saltare fuori dalla cornice con il link.
— David Morrow,
2
Trovo che l'unica volta in cui costringo le persone a una nuova finestra sia quando sono a metà di una frase che collega un punto esterno e voglio fornire fonti per i miei commenti senza interrompere il flusso. Questo frammento di js è l' ideale per lo scopo - grazie, votato :)
— tehwalrus
14
Penso che la citazione di Jakob Nielson non si applichi più qui. Si lamenta dell'apertura di nuove finestre, ma oggigiorno target = "_ blank" si apre in una nuova scheda. Personalmente non mi piace quando i collegamenti ad altri domini non si aprono in nuove schede.
— Alexander Rechsteiner,
3
Inoltre: perché dire Jakob Nielsen says you shouldn't do thatè un argomento terribile.
— Ola Tuvesson,
2
Aggiungerò qui che QUESTO è preferibile anche come soluzione globale. Mantiene pulito il tuo Markdown, che è il punto di Markdown.
— Adam Michael Wood,
47

Con Markdown-2.5.2, puoi usare questo:

[link](url){:target="_blank"}
— meduvigo
fonte
2
Ho provato questo e non ha funzionato per me. Usando con django 1.6
— joel goldstick il
5
Funziona con Jekyll v2.4.0 (potrebbe funzionare anche con le versioni precedenti)
— nicksuch
5
Questo è kramdown (e poiché Jekyll usa kramdown, funziona con Jekyll).
— z3ntu,
1
Non riesco a far funzionare questa sintassi in GitLab. Non sono sicuro di quale versione di Markdown sia attualmente in uso.
— Rockin4Life33,
C'è un modo per renderlo predefinito, quindi non devo specificarlo per ogni link?
— Connel,
8

Una soluzione globale è quella di inserire <base target="_blank"> l' <head>elemento della tua pagina . Ciò aggiunge effettivamente un obiettivo predefinito a ogni elemento di ancoraggio. Uso markdown per creare contenuti sul mio sito Web basato su Wordpress e il mio personalizzatore di temi mi consentirà di iniettare quel codice nella parte superiore di ogni pagina. Se il tuo tema non lo fa, c'è un plug-in

— aholub
fonte
8

Sto usando Grav CMS e questo funziona perfettamente:

Corpo / Content:
Some text[1]

Corpo / Riferimento:
[1]: http://somelink.com/?target=_blank

Assicurati solo che l'attributo target sia passato per primo, se ci sono attributi aggiuntivi nel link, copiali / incollali alla fine dell'URL di riferimento.

Funziona anche come collegamento diretto:
[Go to this page](http://somelink.com/?target=_blank)

— Peter Danshov
fonte
Per riferimento, ecco il capitolo relativo alla documentazione .
— domsson,
7

Per il markdown dei fantasmi usare:

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

Trovato qui: https://cmatskas.com/open-external-links-in-a-new-window-ghost/

— Guya
fonte
1
mi piace la tua soluzione. come l'ho provato con diverse configurazioni sembra che funzioni solo nel collegamento in linea . forse c'è un modo per collegarsi con collegamenti di riferimento . qualcosa come: [open new window][1] \n [1]: (https://abc.xyz" target="_blank). forse sbaglio qualcosa o non è un modo di lavorare in quel modo?
— MrIsaacs,
7

Pertanto, non è del tutto vero che non è possibile aggiungere attributi di collegamento a un URL di markdown. Per aggiungere attributi, controlla con il parser di markdown sottostante utilizzato e quali sono le loro estensioni.

In particolare, pandocha un'estensione da abilitare link_attributes, che consente il markup nel collegamento. per esempio

[Hello, world!](http://example.com/){target="_blank"}
  • Per chi proviene da R (ad esempio utilizzando rmarkdown, bookdown, blogdowne così via), questa è la sintassi che si desidera.
  • Per coloro che non utilizzano R , potrebbe essere necessario abilitare l'interno della chiamata pandoccon+link_attributes

Nota: questo è diverso dal kramdownsupporto del parser, che è una delle risposte accettate sopra. In particolare, nota che kramdown differisce dal pandoc poiché richiede i due punti - :- all'inizio delle parentesi graffe - {}, ad es.

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

In particolare:

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

# Kramdown
{: attribute1="value1" attribute2="value2"}
 ^
 ^ Colon
— senza cappotto
fonte
Questo ha funzionato per me nel nostro ambiente di markdown personalizzato. Grazie!
— Klewis,
6

Puoi farlo tramite il codice javascript nativo in questo modo:

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

JSFiddle Code

— MrPenguin Pablo
fonte
6

Nel mio progetto lo sto facendo e funziona benissimo:

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

collegamento

Ma non tutti i parser ti permettono di farlo.

— user5036455
fonte
Quasi funziona, ma anche il tuo esempio viene visualizzato con url codificato nel titolo attr, piuttosto che come nuovi attr (visualizza la fonte o modifica il nodo come html): <a href="https://example.org/" rel="nofollow" title="title&quot; target=&quot;_blank">Link</a>
— Graham P Heath
6

Non esiste un modo semplice per farlo, e come ha notato @alex, dovrai usare JavaScript. La sua risposta è la soluzione migliore ma per ottimizzarla, potresti voler filtrare solo i link post-content.

<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>

Il codice è compatibile con IE8 + e puoi aggiungerlo in fondo alla tua pagina. Tieni presente che dovrai modificare il ".post-content a" nella classe che stai utilizzando per i tuoi post.

Come visto qui: http://blog.hubii.com/target-_blank-for-links-on-ghost/

— midudev
fonte
0

Ho riscontrato questo problema durante il tentativo di implementare il markdown usando PHP.

Poiché l'utente ha generato i collegamenti creati con il markdown devono essere aperti in una nuova scheda ma i link del sito devono rimanere nella scheda, ho modificato il markdown per generare solo i collegamenti che si aprono in una nuova scheda. Quindi non tutti i link sulla pagina si collegano, solo quelli che usano markdown.

Nel markdown ho cambiato tutto l'output del link in modo <a target='_blank' href="...">che fosse abbastanza facile usando find / sostituisci.

— user3167223
fonte
0

Non sono d'accordo sul fatto che sia una migliore esperienza utente rimanere all'interno di una scheda del browser. Se vuoi che le persone rimangano sul tuo sito o tornino per terminare di leggere quell'articolo, inviale in una nuova scheda.

Sulla base della risposta di @ davidmorrow, lancia questo javascript nel tuo sito e trasforma solo i collegamenti esterni in collegamenti con 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>
— Danny
fonte
0

Per alex completo risposto (13 dic '10)

Un obiettivo di iniezione più intelligente potrebbe essere fatto con questo codice:

/*
 * 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');

È possibile modificare le eccezioni regexp con l'aggiunta di più estensioni nel (?!html?|php3?|aspx?)costrutto di gruppo (comprendere questa regexp qui: https://regex101.com/r/sE6gT9/3 ).

e per una versione senza jQuery, controlla il codice qui sotto:

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';
        } 
    }
}
— Bruno Lesieur
fonte
0

Automatizzato solo per collegamenti esterni, usando GNU sed & make

Se uno vorrebbe farlo sistematicamente per tutti i collegamenti esterni, CSS non è un'opzione . Tuttavia, è possibile eseguire il sedcomando seguente dopo aver creato l'HTML (X) da Markdown:

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

Questo può essere ulteriormente automatizzato aggiungendo il sedcomando sopra a a makefile. Per i dettagli, vedere GNU makeo vedere come l'ho fatto sul mio sito Web .

— Serge Stroobandt
fonte
-3

Questo funziona per me: [Link alla pagina] (il tuo URL qui "(target | _blank)")

— Jose Espin
fonte
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.