Comment ouvrir un lien dans un nouvel onglet sur WordPress

Ouvrir des liens dans un nouvel onglet sur WordPress est une pratique courante qui peut grandement améliorer l’expérience utilisateur, en particulier pour les liens externes. Cela permet aux visiteurs de continuer à naviguer sur votre site tout en explorant d’autres contenus dans un nouvel onglet. Cet article vous explique comment configurer cette option avec l’éditeur Gutenberg, via du code HTML, ou à l’aide de plugins pour automatiser le processus.


1. Pourquoi ouvrir des liens dans un nouvel onglet ?

L’ouverture de liens dans un nouvel onglet présente plusieurs avantages importants, en particulier pour les liens externes qui pourraient distraire vos visiteurs de votre contenu principal.

  • Meilleure rétention des visiteurs : Ils peuvent explorer d’autres contenus sans quitter votre page, augmentant ainsi leur temps passé sur votre site.
  • Amélioration de la fluidité : L’utilisateur reste concentré sur votre site tout en consultant une nouvelle ressource dans un autre onglet.
  • Optimisation de l’UX : Cette pratique est utile pour les liens externes, évitant que l’utilisateur ne quitte accidentellement votre site.

⚠️ Remarque sur l’accessibilité : Cette pratique peut parfois perturber les utilisateurs de technologies d’assistance. Pour améliorer l’expérience, il est conseillé d’ajouter un indicateur visuel ou textuel pour informer l’utilisateur que le lien s’ouvrira dans un nouvel onglet.


2. Comment ouvrir un lien dans un nouvel onglet avec Gutenberg ?

Configurer un lien pour qu’il s’ouvre dans un nouvel onglet avec Gutenberg est un processus simple. Voici comment le faire :

  1. Sélectionnez le texte ou l’image que vous souhaitez lier.
  2. Cliquez sur l’icône « Lien » ou utilisez le raccourci clavier Ctrl + K (ou Cmd + K sur Mac).
  3. Entrez l’URL du lien.
  4. Activez l’option « Ouvrir dans un nouvel onglet » en bas de la boîte de dialogue des liens.
  5. Cliquez sur Appliquer, et le lien sera configuré pour s’ouvrir dans un nouvel onglet.

💡 Astuce : Vous pouvez utiliser cette méthode pour tous les blocs dans Gutenberg qui supportent les liens, y compris les boutons et les images.


3. Ouvrir les liens de menus dans un nouvel onglet

Pour configurer vos liens de menu pour qu’ils s’ouvrent dans un nouvel onglet, suivez ces étapes simples :

  1. Allez dans le tableau de bord WordPress, puis cliquez sur Apparence > Menus.
  2. En haut à droite, cliquez sur Options d’écran et cochez la case Cible du lien.
  3. Dans la section des éléments de menu, une nouvelle option « Ouvrir dans un nouvel onglet » sera disponible pour chaque lien.
  4. Cochez cette option pour chaque lien du menu qui doit s’ouvrir dans un nouvel onglet.

4. Utiliser du code HTML pour ouvrir un lien dans un nouvel onglet

Si vous préférez travailler directement avec du code HTML, voici comment vous pouvez forcer l’ouverture d’un lien dans un nouvel onglet en ajoutant l’attribut target="_blank".

Exemple de code :

<a href="https://exemple.com" target="_blank">Visitez notre site partenaire</a>
  • Cette méthode est utile si vous souhaitez avoir un contrôle précis sur le comportement de vos liens dans l’éditeur HTML de Gutenberg ou dans les fichiers de votre thème.
  • N’oubliez pas d’ajouter l’attribut rel="noopener noreferrer" pour des raisons de sécurité et pour éviter les problèmes de « tabnabbing » (prise de contrôle de l’onglet ouvert).

Exemple sécurisé :

<a href="https://exemple.com" target="_blank" rel="noopener noreferrer">Visitez notre site partenaire</a>

5. Utilisation de plugins pour automatiser l’ouverture des liens dans un nouvel onglet

Gérer manuellement tous les liens de votre site peut devenir fastidieux, surtout si vous gérez un site avec beaucoup de contenu ou plusieurs contributeurs. Voici deux plugins populaires qui vous permettront d’automatiser l’ouverture des liens externes dans un nouvel onglet.

  1. External Links : Ce plugin permet de configurer facilement tous vos liens externes pour qu’ils s’ouvrent dans un nouvel onglet. Il offre des options avancées, comme l’ajout automatique de nofollow ou d’icônes pour les liens externes.
    • Avantages : Personnalisation avancée, gestion automatique des liens sortants.
    • Inconvénients : Configuration initiale nécessaire.
  2. WP External Links (nofollow, noopener & new window) : Un autre excellent plugin qui non seulement gère l’ouverture dans un nouvel onglet, mais ajoute également des mesures de sécurité comme noopener et noreferrer.
    • Avantages : Sécurité renforcée, interface simple.
    • Inconvénients : Peut être trop complexe pour les petits sites.

💡 Recommandation : Utiliser un plugin est particulièrement utile pour les sites à grande échelle ou lorsque vous avez plusieurs contributeurs qui oublient de configurer manuellement les liens.


6. Accessibilité, SEO et bonnes pratiques

Lorsque vous configurez des liens pour s’ouvrir dans un nouvel onglet, voici quelques recommandations supplémentaires à garder en tête :

  • Accessibilité : Les utilisateurs de technologies d’assistance peuvent être déconcertés par l’ouverture d’un nouvel onglet. Pensez à ajouter une indication comme une icône ou un texte précisant que le lien s’ouvrira dans un nouvel onglet.
  • SEO : Ouvrir des liens externes dans un nouvel onglet n’a pas d’impact direct sur le SEO. Cependant, l’ajout d’attributs rel="nofollow" ou rel="noopener noreferrer" est recommandé pour améliorer la sécurité et éviter les risques liés au « tabnabbing ».
  • Pratiques d’UX : Ne forcez pas systématiquement l’ouverture des liens dans un nouvel onglet. Réservez cette option aux liens externes et donnez à l’utilisateur le choix pour les liens internes.

FAQ

Comment activer l’ouverture d’un lien dans un nouvel onglet avec Gutenberg ?
Dans l’éditeur Gutenberg, sélectionnez le texte ou l’image à lier, insérez le lien, et activez l’option « Ouvrir dans un nouvel onglet ». Cela garantit une navigation plus fluide pour les utilisateurs.

Puis-je configurer les liens du menu pour s’ouvrir dans un nouvel onglet sur WordPress ?
Oui, dans « Apparence > Menus », activez l’option « Cible du lien » dans les Options d’écran. Ensuite, cochez l’option « Ouvrir dans un nouvel onglet » pour chaque lien de votre menu.

Existe-t-il des plugins pour automatiser l’ouverture des liens dans un nouvel onglet ?
Oui, il existe des plugins comme External Links ou WP External Links qui permettent d’automatiser cette tâche pour les liens externes sans intervention manuelle.


Ouvrir des liens dans un nouvel onglet est une fonctionnalité simple mais puissante qui peut améliorer l’expérience utilisateur et la navigation sur votre site WordPress. Que vous utilisiez Gutenberg, les menus ou des plugins, il existe une solution adaptée à chaque besoin. N’oubliez pas de tenir compte des aspects d’accessibilité et de sécurité pour garantir la meilleure expérience possible à vos utilisateurs.