Voulez-vous personnaliser votre formulaire de réinitialisation de mot de passe WordPress ?
Qu'il s'agisse d'ajouter des feuilles de style CSS personnalisées ou d'installer différents plugins, les utilisateurs de WordPress ne sont pas étrangers à la personnalisation. C'est l'une des raisons pour lesquelles WordPress est si populaire.
En créant un formulaire de réinitialisation de mot de passe personnalisé, vous pouvez offrir une meilleure expérience à l'utilisateur en personnalisant ces pages utilisateur pour qu'elles correspondent à votre thème WordPress, qu'elles affichent votre logo et qu'elles offrent un contenu supplémentaire.
Dans cet article, nous allons vous guider pas à pas pour personnaliser votre formulaire de réinitialisation de mot de passe WordPress.
Personnalisez votre formulaire de réinitialisation de mot de passe dès maintenant
Comment réinitialiser mon mot de passe WordPress ?
Vous pouvez réinitialiser votre mot de passe WordPress en utilisant le lien "mot de passe perdu" dans WordPress. Vous recevrez un courriel contenant un lien sur lequel vous pourrez cliquer pour réinitialiser votre mot de passe.
Pour une meilleure expérience utilisateur, un formulaire de réinitialisation personnalisé vous permet de modifier l'apparence et le contenu de la notification par courriel. Nous allons vous montrer comment personnaliser votre formulaire de réinitialisation de mot de passe, envoyer l'utilisateur vers la page du formulaire de mot de passe et lui permettre de réinitialiser son mot de passe facilement.
Comment créer un formulaire de réinitialisation de mot de passe personnalisé dans WordPress
Pour créer un formulaire de réinitialisation de mot de passe personnalisé, vous devez souscrire à la version premium de WPForms. La licence Pro inclut l'addon User Registration qui vous permet de créer des formulaires personnalisés de réinitialisation de mot de passe, d'enregistrement d'utilisateur et de connexion pour votre site WordPress.
Dans cet article
- 1. Installer WPForms
- 2. Installer le module complémentaire d'enregistrement des utilisateurs
- 3. Utiliser le modèle de formulaire de réinitialisation du mot de passe
- 4. Configurer l'e-mail de réinitialisation du mot de passe
- 5. Publier votre formulaire de réinitialisation de mot de passe personnalisé
- 6. Ajouter le formulaire de réinitialisation du mot de passe au menu de navigation
- Facultatif : Ajouter une redirection vers le formulaire personnalisé de réinitialisation du mot de passe
C'est parti !
1. Installer WPForms
Tout d'abord, téléchargez et installez WPForms. Pour ce tutoriel, vous aurez besoin de la version pro au lieu de WPForms Lite. Si vous avez besoin d'aide, consultez ce guide d'installation des plugins WordPress.
Après avoir installé le plugin, connectez-vous à votre compte WPForms et cliquez sur l'onglet Téléchargements.
Il s'agit d'une page avec toutes les licences disponibles. Pour télécharger le plugin, cliquez sur le bouton Télécharger WPForms à côté de la licence pro. Un fichier zippé du plugin WPForms sera sauvegardé sur votre ordinateur.
Après avoir téléchargé votre fichier zip, rendez-vous sur votre site WordPress où vous souhaitez installer WPForms. Ensuite, dans le tableau de bord de l'administrateur, cliquez sur Plugins " Add New et ensuite sur le bouton Upload Plugin.
A partir de là, cliquez sur le bouton Choose File et sélectionnez le fichier zip WPForms que vous venez de télécharger.
Une fois votre fichier téléchargé, cliquez sur le bouton Installer maintenant.
Une fois le plugin installé, cliquez sur le bouton Activer le plugin pour activer WPForms sur votre site.
Après avoir activé le plugin, n'oubliez pas de vérifier votre clé de licence WPForms pour recevoir les mises à jour automatiques et le support du plugin. L'ajout de votre clé de licence vous permettra également d' installer et d'activer facilement les addons WPForms depuis votre tableau de bord WordPress.
2. Installer le module complémentaire d'enregistrement des utilisateurs
Nous allons maintenant installer l'addon dont nous avons besoin pour créer les formulaires de réinitialisation de mot de passe.
Dans votre zone d'administration WordPress, allez dans WPForms " Addons dans le menu latéral gauche.
Si vous ne voyez aucun addon pour votre niveau de licence, cliquez sur le bouton Actualiser les addons pour forcer une actualisation.
Pour rechercher un module complémentaire d'enregistrement d'utilisateur, tapez son nom dans le champ " Search Addons" situé dans le coin supérieur droit de la page.
Une fois que vous l'avez trouvé, il vous suffit de cliquer sur le bouton Installer le module complémentaire.
Cela installera et activera automatiquement l'addon pour vous. Tout addon installé et prêt à être utilisé affichera Status : Actif.
3. Utiliser le modèle de formulaire de réinitialisation du mot de passe
Pour créer votre formulaire de réinitialisation de mot de passe, allez dans WPForms " Add New. Recherchez "Password Reset" dans la bibliothèque de modèles, puis survolez l'option User Password Reset Form et cliquez sur Use Template.
Une fois que vous avez sélectionné le modèle, le formulaire de réinitialisation du mot de passe s'affiche sur votre écran.
Vous pouvez ensuite personnaliser le formulaire de réinitialisation du mot de passe en ajoutant autant de champs que vous le souhaitez. Vous pouvez même modifier le texte du bouton d'envoi.
Remarque : l'utilisateur ne verra que le champ Nom d'utilisateur/Email lors de la réinitialisation de son mot de passe. Le champ Mot de passe n'apparaîtra que lorsque l'utilisateur cliquera sur le lien de réinitialisation dans l'e-mail de réinitialisation du mot de passe, ce qui lui permettra de définir son nouveau mot de passe.
Ce n'est pas une bonne idée d'ajouter ou de supprimer des champs de ce modèle, car il remplit une fonction très spécifique de manière optimale.
L'étape suivante porte sur la réinitialisation des paramètres de l'e-mail.
4. Configurer l'e-mail de réinitialisation du mot de passe
Pour personnaliser l'e-mail de demande de réinitialisation du mot de passe, cliquez sur Paramètres dans la barre latérale, puis sur le menu Enregistrement de l'utilisateur.
Ici, vous pouvez personnaliser l'objet et le message de l'e-mail de réinitialisation ou utiliser le message par défaut tel quel.
Si vous souhaitez modifier le message de réinitialisation, veillez à ne pas supprimer le champ {user_registration_password_reset}
balise intelligente. Cette balise intelligente crée le lien de réinitialisation sur lequel l'utilisateur doit cliquer.
Faites défiler la page vers le bas et vous verrez une option permettant de masquer votre formulaire de réinitialisation de mot de passe aux utilisateurs connectés. Si vous activez cette option, vous pouvez modifier le message à afficher lorsqu'un utilisateur connecté ouvre le formulaire.
Excellent !
Une fois que vous avez personnalisé les paramètres, n'oubliez pas de cliquer sur Enregistrer en haut de la page.
Dans l'étape suivante, nous intégrerons le formulaire dans une nouvelle page.
5. Publier votre formulaire de réinitialisation de mot de passe personnalisé
WPForms dispose d'un assistant d'intégration pratique qui vous permet de placer votre formulaire à l'intérieur d'une page nouvelle ou existante directement depuis le générateur de formulaire.
Une fois votre formulaire enregistré, cliquez sur le bouton Embed.
Comme nous voulons intégrer notre formulaire dans une nouvelle page de réinitialisation de mot de passe, nous allons sélectionner l'option Créer une nouvelle page.
Donnez un nom approprié à votre page, puis cliquez sur " Let's Go".
Après cela, WPForms ouvrira l'éditeur de blocs de WordPress où vous trouverez votre formulaire de réinitialisation de mot de passe intégré.
Avant de publier votre formulaire, vous pouvez effectuer quelques personnalisations de style impressionnantes ici.
Il suffit d'utiliser les options du bloc WPForms sur la droite pour utiliser les fonctions de style du formulaire et personnaliser vos étiquettes, champs et boutons en quelques clics.
Lorsque vous êtes satisfait de votre formulaire, cliquez sur Publier pour le lancer.
Votre formulaire de réinitialisation de mot de passe est maintenant en ligne et prêt à être utilisé !
Mais nous n'avons pas encore terminé. Il est important de veiller à ce que ce formulaire soit facile à trouver pour vos utilisateurs, au cas où ils auraient besoin de réinitialiser leur mot de passe.
Dans l'étape suivante, nous ajouterons le formulaire de réinitialisation du mot de passe à la navigation principale de votre site.
C'est une bonne pratique que de rendre la page de réinitialisation du mot de passe facile à trouver pour les utilisateurs.
Pour ce faire, nous ajouterons la page de formulaire nouvellement créée à la barre de navigation supérieure de votre site.
C'est facile à faire. Ouvrez simplement votre tableau de bord WordPress et allez dans Apparence " Menus.
Vous avez peut-être déjà ajouté un menu de navigation à votre site. Dans ce cas, il vous suffira d'ajouter la page de réinitialisation du mot de passe au menu.
Une fois dans l'écran Menus, cliquez sur votre formulaire de réinitialisation du mot de passe dans la colonne de gauche, puis appuyez sur Ajouter au menu.
La page de réinitialisation du mot de passe sera alors ajoutée à la pile de pages figurant actuellement dans votre menu de droite.
Appuyez sur le bouton Enregistrer le menu pour le mettre à jour.
La procédure de création d'un menu pour la première fois est presque similaire. Il vous suffit de donner un nom à votre menu, puis d'appuyer sur le bouton bleu Créer un menu en bas de l'écran.
Ensuite, vous pouvez ajouter des pages à votre menu en suivant les étapes indiquées ci-dessus.
Voici un exemple de navigation :
Il ne nous reste plus qu'à ajouter une redirection pour que les visiteurs qui tentent d'accéder à votre page de réinitialisation par défaut de WordPress soient automatiquement redirigés vers votre nouvelle page de réinitialisation de mot de passe personnalisée.
Facultatif : Ajouter une redirection vers le formulaire personnalisé de réinitialisation du mot de passe
Si vous créez un formulaire personnalisé pour réinitialiser les mots de passe sur votre site web, il peut être judicieux de créer également un formulaire de connexion personnalisé pour votre site, ainsi qu'une redirection pour remplacer la page de connexion par défaut de WordPress par la nouvelle page personnalisée.
Mais si votre page de connexion par défaut est toujours accessible, vous devez ajouter une redirection vers le formulaire de réinitialisation du mot de passe.
Ainsi, si un utilisateur clique sur le bouton "Lost your password?
"de la page de connexion de WordPress, ils seront redirigés vers la page de réinitialisation de mot de passe que vous venez de créer ci-dessus au lieu du formulaire de réinitialisation de mot de passe par défaut de WordPress.
Ne vous inquiétez pas, c'est plus facile qu'il n'y paraît.
Tout d'abord, nous allons installer le plugin WordPress gratuit WPCode. Sur votre tableau de bord WordPress, allez dans Plugins " Ajouter un nouveau.
De là, recherchez WPCode et cliquez sur Installer maintenant.
Une fois que vous avez cliqué sur Activate, il est temps d'ajouter notre code. Sur votre tableau de bord WordPress, cliquez sur Code Snippets " + Add Snippet.
Après avoir cliqué sur ce bouton, vous verrez la bibliothèque prédéfinie avec différentes options de code que vous pouvez choisir. Cliquez sur Use Snippet sous l'option Add Your Custom Code (New Snippet),
Après avoir intitulé votre extrait (nous avons choisi "New Password Reset Page"), cliquez sur le menu déroulant "Code Type" à droite de l'aperçu du code et sélectionnez " PHP Snippet".
Vous pouvez maintenant copier et coller le code suivant dans l'éditeur :
N'oubliez pas de remplacer reset-password
dans le code ci-dessus avec le slug de votre nouvelle page personnalisée de réinitialisation de mot de passe.
Ensuite, faites défiler la page jusqu'à la section Insertion, où vous pouvez spécifier la méthode et l'emplacement d'insertion. Nous vous recommandons de conserver la sélection d'emplacement par défaut Exécuter partout et Insertion automatique pour la méthode d'insertion.
Lorsque vous avez terminé, cliquez sur le bouton Enregistrer l'extrait en haut à droite. Cliquez ensuite sur l'interrupteur à bascule situé à côté pour activer l'extrait de code.
C'est excellent ! Désormais, les utilisateurs arriveront toujours sur votre page personnalisée de réinitialisation de mot de passe lorsqu'ils cliqueront sur le lien de mot de passe perdu.
Passer d'un formulaire standard de réinitialisation de mot de passe WordPress à un formulaire personnalisé de réinitialisation WPForms vous apporte de nombreux avantages en plus de l'amélioration de l'image de marque.
Par exemple, vous pouvez ajouter des fonctionnalités de protection contre le spam en utilisant l'anti-spam intégré de WPForms ainsi que des options utiles comme la définition d'un délai minimum pour soumettre un formulaire afin de tenir les spambots à distance.
Pour plus de détails, vous pouvez suivre notre guide pour empêcher les réinitialisations de mot de passe non autorisées dans WordPress, et éliminer ces demandes de spam !
Et voilà, c'est fait ! Vous êtes maintenant prêt à créer et à lancer un formulaire de réinitialisation de mot de passe personnalisé dans WordPress.
Ensuite, personnalisez votre page de réinitialisation du mot de passe
Une fois que vous avez intégré votre formulaire de réinitialisation de mot de passe à votre nouvelle page, vous devez lui donner une image de marque.
Pourquoi ? En marquant votre formulaire et votre page de réinitialisation de mot de passe, vous renforcez l'idée que vous êtes une entreprise légitime et vous augmentez la crédibilité globale de votre marque.
Suivez notre guide complet pour créer et personnaliser des pages de formulaire sur WordPress.
En outre, vous souhaiterez peut-être apprendre à personnaliser une page protégée par un mot de passe dans WordPress.
Consultez également notre guide sur la façon de personnaliser les couleurs de votre thème WordPress et d'adapter vos formulaires aux couleurs de votre marque.
Enfin, vous pouvez consulter cette liste des meilleurs services d'envoi d'e-mails transactionnels.
Créez votre formulaire WordPress maintenant
Prêt à construire votre formulaire ? N'oubliez pas de vous inscrire à WPForms Pro qui inclut l'addon User Registration, de nombreux modèles gratuits, et une garantie de remboursement de 14 jours.
Si cet article vous a aidé, n'hésitez pas à nous suivre sur Facebook et Twitter pour d'autres tutoriels et guides gratuits sur WordPress.
Lorsque je clique sur le lien de réinitialisation du mot de passe envoyé par e-mail, le champ du mot de passe du formulaire ne s'affiche pas.
Hey Ayomikun - Nous serions heureux de vous aider ! Quand vous en aurez l'occasion, écrivez-nous dans le support pour que nous puissions vous aider.
Si vous avez une licence WPForms, vous avez accès à notre support par email, veuillez donc soumettre un ticket de support.
Sinon, nous fournissons une assistance gratuite limitée dans le forum d'assistance WPForms Lite WordPress.org.
Merci 🙂 .
C'est la même chose ici. Avez-vous trouvé une solution à ce problème ?
Hey Wagner - Nous serions heureux de vous aider ! Lorsque vous en aurez l'occasion, envoyez-nous un message dans le support pour que nous puissions vous aider.
Si vous avez une licence WPForms, vous avez accès à notre support par email, veuillez donc soumettre un ticket de support.
Sinon, nous fournissons une assistance gratuite limitée dans le forum d'assistance WPForms Lite WordPress.org.
Merci 🙂 .