J’utilise couramment le script jQuery ci-dessus pour ouvrir automatiquement un lien externe dans un nouvel onglet en y ajoutant l’attribut target _blank.
Il ne s’agit pas d’une solution très propre, car la cible _blank peut entraîner des problèmes de sécurité, d’accessibilité et de performance. Je n’ai en revanche pas trouvé de contre-indication majeure à utiliser un script dans la mesure où l’utilisateur peut le faire manuellement. Le seul souci à mes yeux concerne l’accessibilité qui peut-être un peu dégradée.
Notez tout de même que depuis WordPress 4.7+ les attributs rel= »noopener noreferrer » sont automatiquement ajoutés aux liens externes, le problème de sécurité est maintenant derrière nous (à priori).
jQuery(document).ready( function($) {
// Open all external link in a new tab
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if (!a.test(this.href)) {
// This is an external link
$(this).attr("target","_blank");
// Remove after your tests
console.log($(this));
}
});
});
Si vous n’êtes pas sur WordPress, vous pouvez modifier la fonction pour ajouter au moins l’attribut rel noopener de la même manière que pour le target.
jQuery(document).ready( function($) {
// Open all external link in a new tab
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if (!a.test(this.href)) {
// This is an external link
$(this).addClass('external').attr('target','_blank').attr('rel','noopener');
}
});
});
Enfin, si vous utilisez un plugin lightbox tel que Fancybox, vous pouvez vouloir ouvrir des liens vers des images externes directement à partir de votre page. Si c’est le cas, vous pouvez essayer ce qui suit.
jQuery(document).ready( function($) {
// Open all external link in a new tab
$("a:not([href$='.jpg']):not([href$='.jpeg']):not([href$='.gif']):not([href$='.png'])").each(function() {
var a = new RegExp('/' + window.location.host + '/');
if (!a.test(this.href)) {
// This is an external link
$(this).addClass('external').attr('target','_blank').attr('rel','noopener');
}
});
});
Voici un bon article de blog d’Ali Kamalizade sur medium qui traite du sujet.
