Puis-je créer des liens avec 'target=' blank ' dans Markdown?
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.
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 .
avec Markdown-2.5.2, vous pouvez utiliser ceci:
[link](url){:target="_blank"}
dans mon projet je fais ceci et cela fonctionne très bien:
[Link](https://example.org/ "title" target="_blank")
mais tous les parsers ne te laissent pas faire ça.
[Google](https://google.com" target="_blank)
L'a trouvé ici: https://cmatskas.com/open-external-links-in-a-new-window-ghost /
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=");
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 /
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
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)
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,blogdownet 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 à
pandocavec+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
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.
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>
vous pouvez ajouter des attributs en utilisant {[attr]="[prop]"}
par exemple [Google] ( http://www.google.com ) {target=" _blank"}
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';
}
}
}
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 .