Puis-je créer des liens avec 'target=' blank ' dans Markdown?

Est-il un moyen de créer un lien dans Markdown qui s'ouvre dans une nouvelle fenêtre? Si non, que la syntaxe ne vous recommandons faire cette. Je l'ajouterai au compilateur markdown que j'utilise. Je pense que ça devrait être une option.

304
demandé sur Flip 2010-12-13 04:33:05

16 réponses

en ce qui concerne la syntaxe Markdown, si vous voulez obtenir ce détail, vous aurez juste à utiliser HTML.

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

la plupart des moteurs de Markdown que j'ai vu permettent le vieux HTML simple, juste pour des situations comme celle-ci où un système de markup générique de texte ne sera tout simplement pas couper. (Le moteur à effet de débordement, par exemple.) Ils exécutent alors la totalité de la sortie à travers un filtre de liste blanche HTML, peu importe, puisque même un document Markdown-seul peut facilement contenir des attaques XSS. En tant que tel, si vous ou vos utilisateurs voulez créer des liens _blank , alors ils peuvent probablement encore.

Si c'est une fonctionnalité que vous allez utiliser souvent, il peut être judicieux de créer votre propre syntaxe, mais ce n'est généralement pas une caractéristique essentielle. Si je veux lancer ce lien dans une nouvelle fenêtre, je vais ctrl-cliquez dessus moi-même, merci.

254
répondu Matchu 2010-12-13 01:40:35

Kramdown le supporte. Il est compatible avec la syntaxe standard de Markdown, mais possède aussi de nombreuses extensions. Vous l'utiliseriez comme ceci:

[link](url){:target="_blank"}
262
répondu farnoy 2018-05-26 14:43:38

Je ne pense pas qu'il y ait une fonctionnalité de markdown.

bien qu'il puisse y avoir d'autres options disponibles si vous voulez ouvrir des liens qui pointent à l'extérieur de votre propre site automatiquement avec 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 .

si vous utilisez jQuery, c'est un peu plus simple...

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

jsFiddle .

94
répondu alex 2013-10-22 21:34:11

avec Markdown-2.5.2, vous pouvez utiliser ceci:

[link](url){:target="_blank"}
41
répondu meduvigo 2015-01-22 12:54:12

dans mon projet je fais ceci et cela fonctionne très bien:

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

Lien

mais tous les parsers ne te laissent pas faire ça.

7
répondu user5036455 2015-06-22 20:08:28
"151910920 Pour ghost markdown:

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

L'a trouvé ici: https://cmatskas.com/open-external-links-in-a-new-window-ghost /

6
répondu guya 2016-08-10 01:24:41

vous pouvez le faire via le code javascript natif comme suit:

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

Code JSFiddle

5
répondu MrPenguin Pablo 2014-06-10 23:47:26

il n'y a pas de moyen facile de le faire, et comme @alex a noté que vous aurez besoin d'utiliser JavaScript. Sa réponse est la meilleure solution mais afin de l'optimiser, vous pourriez vouloir filtrer seulement aux liens de post-contenu.

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

le code est compatible avec IE8+ et vous pouvez l'ajouter au bas de votre page. Notez que vous aurez besoin de changement ".post-content" à la classe que vous utilisez pour vos messages.

Comme on le voit ici: http://blog.hubii.com/target-_blank-for-links-on-ghost /

4
répondu miduga 2015-08-28 11:41:30

une solution globale est de mettre <base target="_blank"> dans l'élément <head> de votre page. Cela ajoute effectivement une cible par défaut à chaque élément d'ancrage. J'utilise markdown pour créer du contenu sur mon site Wordpress, et mon thème customizer me permettra d'injecter ce code dans le haut de chaque page. Si votre thème ne fait pas cela, il y a un plug-in

4
répondu aholub 2018-01-26 21:14:34

j'utilise Grav CMS et cela fonctionne parfaitement:

Corps / Contenu:

Some text[1]

Corps/Référence:

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

assurez-vous simplement que l'attribut cible est passé en premier, s'il y a des attributs supplémentaires dans le lien, copiez-les/collez-les à la fin de l'URL de référence.

fonctionne aussi comme lien direct:

[Go to this page](http://somelink.com/?target=_blank)

4
répondu Peter Danshov 2018-03-26 19:23:05

ainsi, il n'est pas tout à fait vrai que vous ne pouvez pas ajouter des attributs de lien à une URL de Markdown. Pour ajouter des attributs, vérifiez avec l'analyseur markdown sous-jacent utilisé et quelles sont leurs extensions.

en particulier, pandoc dispose d'une extension pour activer link_attributes , qui permettent le markup dans le lien. par exemple

[Hello, world!](http://example.com/){target="_blank"}
  • pour ceux venant de R (p.ex. en utilisant rmarkdown , bookdown , blogdown et ainsi de suite), c'est la syntaxe que vous voulez.
  • pour ceux qui n'utilisent pas R , vous pouvez avoir besoin de activer l'extension dans l'appel à pandoc avec +link_attributes

Note: ce qui est différent du kramdown parser's support, qui est l'un des les réponses ci-dessus. En particulier, notez que kramdown diffère du pandoc puisqu'il nécessite un colon -- : -- au début des crochets bouclés -- {} , par exemple

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

en particulier:

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

# Kramdown
{: attribute1="value1" attribute2="value2"}
 ^
 ^ Colon
2
répondu coatless 2018-05-24 01:50:32

j'ai rencontré ce problème en essayant d'implémenter markdown en utilisant PHP.

étant donné que les liens générés par l'utilisateur avec markdown doivent s'ouvrir dans un nouvel onglet mais que les liens du site doivent rester dans l'onglet, j'ai modifié markdown pour ne Générer que des liens qui s'ouvrent dans un nouvel onglet. Donc, pas tous les liens sur la page lien, juste ceux qui utilisent markdown.

dans markdown j'ai changé toute la sortie de lien pour être <a target='_blank' href="..."> qui était assez facile en utilisant trouver/remplacer.

0
répondu user3167223 2014-01-06 23:28:49

Je ne suis pas d'accord que c'est une meilleure expérience utilisateur de rester dans un onglet de navigateur. Si vous souhaitez que les gens restent sur votre site, ou revenir pour finir de lire cet article, envoyez-les dans un nouvel onglet.

en S'appuyant sur la réponse de @davidmorrow, jetez ce javascript dans votre site et transformez juste les liens externes en liens avec 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
répondu Danny 2014-02-21 11:52:41

vous pouvez ajouter des attributs en utilisant {[attr]="[prop]"}

par exemple [Google] ( http://www.google.com ) {target=" _blank"}

0
répondu leonardli 2014-10-14 09:28:00

Pour alex répondu (Dec 13 '10)

un objectif d'injection plus intelligent pourrait être fait avec ce code :

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

vous pouvez modifier les exceptions regexp en ajoutant plus d'extension dans (?!html?|php3?|aspx?) construction de groupe (comprendre cette regexp ici: https://regex101.com/r/sE6gT9/3 ).

et pour une version sans jQuery, cochez le code ci-dessous:

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
répondu Bruno Lesieur 2015-02-04 10:48:07

Automatisé pour les liens externes seulement, à l'aide de GNU sed & make

si l'on veut le faire systématiquement pour tous les liens externes, CSS n'est pas une option . Cependant, on pourrait exécuter la commande suivante sed une fois que le HTML (X)a été créé à partir de Markdown:

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

cette commande peut être automatisée en ajoutant la commande sed à la commande makefile . Pour plus de détails, voir GNU make ou voir comment j'ai fait que sur mon site web .

0
répondu Serge Stroobandt 2018-09-16 11:28:07