Comment ajouter un lien de déconnexion WordPress dans le menu de navigation

L’ajout d’un lien de déconnexion dans le menu de navigation de votre site WordPress peut améliorer l’expérience utilisateur, notamment pour les sites de membres, les forums bbPress, les boutiques WooCommerce ou les plateformes d’apprentissage (LMS). Cela permet aux utilisateurs de se déconnecter rapidement et facilement.

Dans cet article, nous allons vous montrer comment ajouter un lien de déconnexion à votre menu de navigation WordPress, ainsi que d’autres emplacements stratégiques de votre site.

Ajouter un lien de déconnexion dans le menu de navigation WordPress

Par défaut, WordPress propose un lien de déconnexion situé dans la barre d’administration, accessible en survolant l’avatar de l’utilisateur connecté. Toutefois, si la barre d’administration est désactivée, ce lien ne sera pas visible.

Pour rendre ce lien plus accessible, vous pouvez l’ajouter directement dans le menu de navigation.

Étapes pour ajouter un lien de déconnexion au menu WordPress :

1. Accédez à la gestion des menus :

   • Allez dans votre tableau de bord WordPress et naviguez vers Apparence > Menus.

2. Ajoutez un lien personnalisé :

   • Dans la section Liens personnalisés, ajoutez l’URL suivante dans le champ URL :

     http://votresite.com/wp-login.php?action=logout

     Remplacez votresite.com par votre propre nom de domaine.

   • Dans le champ Texte du lien, entrez “Déconnexion”.
   • Cliquez sur Ajouter au menu.

3. Positionnez le lien dans le menu :

   • Faites glisser l’élément “Déconnexion” à l’endroit souhaité dans votre menu.

4. Enregistrez les modifications :

   • Cliquez sur Enregistrer le menu pour appliquer les changements.

Problème : Ce lien sera visible par tous les utilisateurs, connectés ou non. Pour le rendre dynamique et ne l’afficher qu’aux utilisateurs connectés, nous allons utiliser un plugin.

Afficher un lien de connexion/déconnexion dynamique

Le plugin Login or Logout Menu Item permet d’afficher dynamiquement un lien “Connexion” ou “Déconnexion” en fonction du statut de l’utilisateur.

Étapes pour configurer un lien dynamique :

1. Installez et activez le plugin Login or Logout Menu Item.
2. Allez dans Apparence > Menus.
3. Ajoutez l’option “Log In / Log Out” à votre menu.
4. Enregistrez les modifications.

Le lien affichera “Connexion” si l’utilisateur est déconnecté et “Déconnexion” s’il est connecté.

Ajouter un lien de déconnexion dans un widget WordPress

Une autre solution consiste à ajouter un lien de déconnexion dans la barre latérale via un widget.

Étapes pour insérer un lien de déconnexion dans un widget :

1. Allez dans Apparence > Widgets.
2. Ajoutez un widget Texte ou HTML personnalisé dans la zone souhaitée.
3. Ajoutez le code HTML suivant :

   <a href="http://votresite.com/wp-login.php?action=logout">Déconnexion</a>

   Remplacez votresite.com par votre nom de domaine.

4. Cliquez sur Enregistrer.

Ajouter un lien de déconnexion via une fonction PHP

Si vous préférez une solution sans plugin, vous pouvez ajouter dynamiquement un lien de connexion/déconnexion dans votre menu en insérant ce code dans le fichier functions.php de votre thème :

add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2);
function add_login_logout_link($items, $args) {
    if (is_user_logged_in()) {
        $items .= '<li><a href="' . wp_logout_url() . '">Déconnexion</a></li>';
    } else {
        $items .= '<li><a href="' . wp_login_url() . '">Connexion</a></li>';
    }
    return $items;
}

Conclusion

L’ajout d’un lien de déconnexion sur votre site WordPress améliore l’expérience utilisateur, notamment sur les sites où la connexion est fréquente. Que ce soit via le menu de navigation, un widget ou une fonction PHP, plusieurs solutions existent pour intégrer ce lien de manière efficace.

Articles connexes :

• Comment ajouter une page de connexion personnalisée sur WordPress
• Comment sécuriser la connexion WordPress avec CAPTCHA
• Comment désactiver les indices de connexion sur WordPress