Le formulaire de connexion WooCommerce par défaut se trouve sur la page Mon compte de votre thème. Il ressemble à toutes les autres boutiques et ne porte pas votre image de marque. Custom Login for WooCommerce le remplace par une page de connexion dédiée et personnalisée sur /login, et y redirige automatiquement les visiteurs non connectés.
À la fin, vous aurez une page de connexion personnalisée sur /login, la redirection de Mon compte fonctionnelle, et votre logo en place. Les options de modèle, de couleur et de contenu promotionnel se trouvent dans d'autres onglets et ont leurs propres articles.
Prérequis
| Exigence | Détails |
|---|---|
| WordPress | Version 5.8 ou ultérieure |
| WooCommerce | Version 6.0 ou ultérieure, installée et active |
| PHP | Version 7.4 ou ultérieure |
| Accès | Un compte qui peut gérer les paramètres WooCommerce |
| Fichier logo | Une image PNG ou JPG (ou l'adresse d'un SVG déjà en ligne). Le plugin recommande 200x60px |
Étape 1 : Activer le plugin
Installez et activez Custom Login for WooCommerce de la même manière que n'importe quel autre plugin WordPress. Une fois actif, un élément Custom Login apparaît sous le menu WooCommerce dans la barre latérale de votre administration. Vous pouvez également cliquer sur Réglages sous le nom du plugin dans l'écran Plugins.
Lors de l'activation, le plugin crée une page publiée intitulée Login avec le slug login, à moins qu'une page avec ce slug n'existe déjà. Votre page de connexion est alors accessible à l'adresse votreboutique.com/login.
Étape 2 : Activer votre licence
Après l'activation, le plugin affiche une notification d'administration rouge vous demandant d'activer votre licence. Une licence vous donne accès aux mises à jour du plugin et au support.
- Allez dans WooCommerce → Custom Login.
- Cliquez sur l'onglet Licence.
- Entrez votre Clé de licence et l'Email d'activation que vous avez utilisé pour l'achat.
- Cliquez sur Activer la licence.
Étape 3 : Vérifiez votre page de connexion
Déconnectez-vous de votre site, ou ouvrez une fenêtre de navigateur privée. Visitez ensuite votreboutique.com/login.
La page de connexion du plugin s'affiche à la place de la mise en page de votre thème. Le design par défaut est Classic Split, avec le formulaire de connexion à gauche et un panneau promotionnel à droite. Le formulaire comprend les champs Adresse e-mail et Mot de passe (les clients peuvent se connecter avec leur nom d'utilisateur ou leur adresse e-mail), une case à cocher Se souvenir de moi, et un lien Mot de passe oublié ?. Vous pouvez renommer ces étiquettes plus tard dans l'onglet Design.
Si vous êtes déjà connecté lorsque vous visitez /login, le plugin vous redirige directement vers votre page Mon compte.
Étape 4 : Vérifiez la redirection de Mon compte
Vous n'avez rien à configurer pour la redirection. Pour la voir fonctionner, ouvrez votre page Mon compte dans une fenêtre de navigateur privée. Vous arrivez sur /login. Une fois le plugin actif, la redirection fonctionne comme suit :
Visiteurs déconnectés. Toute personne qui ouvre votre page Mon compte sans être connectée est redirigée vers /login. Le plugin transmet une valeur redirect_to, afin qu'ils reviennent à Mon compte après s'être connectés.
Liens de mot de passe oublié. La page Mot de passe oublié ? s'ouvre toujours normalement, afin que les clients puissent réinitialiser un mot de passe sans être renvoyés vers la page de connexion.
Déconnexion. Le lien de déconnexion renvoie les clients vers /login avec le message « Vous avez été déconnecté avec succès. »
Après la connexion. Les clients arrivent sur Mon compte, sauf s'ils provenaient d'une autre page qui avait sa propre valeur redirect_to.
Étape 5 : Ajoutez votre logo à la médiathèque
Votre logo apparaît au-dessus du titre de connexion. Le plugin n'a pas de bouton de téléchargement, vous devez donc d'abord ajouter l'image à votre médiathèque, puis la spécifier dans le plugin à l'étape 6.
- Allez dans Média → Ajouter un fichier média dans votre administration WordPress.
- Téléchargez votre logo en tant que fichier PNG ou JPG.
- À côté du fichier téléchargé, cliquez sur Modifier.
- Copiez l'URL du fichier.
Étape 6 : Spécifiez votre logo dans le plugin
- Allez dans WooCommerce → Custom Login.
- Cliquez sur l'onglet Design.
- Sous Logo et titre, collez l'adresse dans le champ URL du logo.
- Cliquez sur Enregistrer les paramètres.
Visitez à nouveau /login dans une fenêtre privée pour vérifier le résultat. Le plugin affiche votre logo avec une hauteur maximale de 50px, donc une image large et courte fonctionne mieux. Si vous laissez URL du logo vide, la page de connexion n'affiche aucun logo.
Dépannage
https://, dans le champ URL du logo, et que vous avez cliqué sur Enregistrer les paramètres. Ouvrez ensuite l'adresse seule dans un onglet de navigateur. Si l'image ne se charge pas là, téléchargez-la à nouveau dans votre médiathèque et copiez une nouvelle URL du fichier.Et ensuite
- Comment choisir un modèle de page de connexion pour WooCommerce
- Comment personnaliser les couleurs de votre page de connexion WooCommerce
- Comment configurer le panneau promotionnel sur votre page de connexion WooCommerce
Questions fréquemment posées
/login.login lorsque vous l'activez. Si la page existe déjà, le plugin la laisse telle quelle.Besoin d'aide ?
Custom Login for WooCommerce est un plugin premium, donc si vous rencontrez des problèmes, ouvrez un ticket de support et notre équipe vous aidera à vous installer.
