Comment personnaliser le formulaire de réinitialisation de mot de passe WordPress

Le formulaire de réinitialisation de mot de passe WordPress par défaut est assez basique. Il fait le travail, mais il ne crie pas exactement « professionnel » ou ne correspond pas à l'apparence de votre marque.

Sans une solution de formulaire de mot de passe personnalisé pour WordPress, vous manquez de maintenir la cohérence de votre marque. De plus, vous ne pouvez pas ajouter d'instructions utiles ou personnaliser les messages pour guider les utilisateurs en douceur tout au long du processus de réinitialisation.

C'est là que l'addon d'inscription d'utilisateurs WPForms s'avère utile. Il vous permet de créer un formulaire de réinitialisation de mot de passe entièrement personnalisé qui ressemble à ce qu'il devrait être sur votre site.

Vous pouvez faire correspondre les couleurs, les polices et la conception générale de votre site Web tout en fournissant des instructions claires et utiles. Alors, sans plus tarder, suivez les étapes de ce guide pour personnaliser votre formulaire de réinitialisation de mot de passe WordPress !

Créez votre formulaire de réinitialisation de mot de passe personnalisé dès maintenant ! 🚀

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 devrez vous abonner à la version premium de WPForms. La licence Pro inclut le module complémentaire d'inscription d'utilisateurs qui vous permet de créer des formulaires de réinitialisation de mot de passe, d'inscription d'utilisateurs et de connexion personnalisés pour votre site Web WordPress. Commençons !

Étape 1 : Installer le plugin 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.

Une fois le plugin installé, connectez-vous à votre compte WPForms et cliquez sur l'onglet Téléchargements. Il s'agit d'une page répertoriant toutes vos licences disponibles.

Pour télécharger le plugin, cliquez sur le bouton Télécharger WPForms à côté de la licence pro. Cela enregistrera un fichier zippé du plugin WPForms sur votre ordinateur.

Une fois votre fichier zip téléchargé, rendez-vous sur votre site WordPress où vous souhaitez installer WPForms. Ensuite, sur le tableau de bord d'administration, cliquez sur Plugins » Ajouter, puis sur le bouton Téléverser un plugin.

À partir de là, cliquez sur le bouton Choisir un fichier 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 modules complémentaires WPForms depuis votre tableau de bord WordPress.

Étape 2 : Activer le module complémentaire d'inscription d'utilisateurs

Maintenant que WPForms est prêt, vous aurez besoin du module complémentaire d'inscription d'utilisateurs pour créer des formulaires de réinitialisation de mot de passe personnalisés. Dans votre espace d'administration WordPress, allez dans WPForms » Modules complémentaires dans le menu latéral gauche.

Si vous ne voyez aucun module complémentaire pour votre niveau de licence, cliquez sur le bouton Actualiser les modules complémentaires pour forcer une actualisation.

Pour rechercher le module complémentaire d'inscription d'utilisateurs, tapez son nom dans le champ Rechercher des modules complémentaires situé en haut à droite de la page.

Une fois que vous l'avez trouvé, cliquez simplement sur le bouton Installer le module complémentaire.

Cela installera et activera automatiquement le module complémentaire pour vous. Tout module complémentaire installé et prêt à l'emploi affichera Statut : Actif.

Étape 3 : Utiliser le modèle de formulaire de réinitialisation de mot de passe

Il est maintenant temps de créer votre formulaire de réinitialisation de mot de passe personnalisé dans WordPress. Allez dans WPForms » Ajouter dans votre tableau de bord pour commencer à créer votre nouveau formulaire.

Recherchez « Réinitialisation du mot de passe » dans la bibliothèque de modèles, puis survolez l'option Formulaire de réinitialisation du mot de passe utilisateur et cliquez sur Utiliser le modèle.

Une fois que vous avez sélectionné le modèle, le formulaire de réinitialisation du mot de passe s'affichera sur votre écran. Ce modèle est spécialement conçu pour la fonctionnalité de réinitialisation du mot de passe et inclut tous les champs essentiels déjà configurés.

Le formulaire comprend automatiquement un champ E-mail où les utilisateurs peuvent saisir leur adresse e-mail enregistrée. C'est le composant principal qui permet au processus de réinitialisation du mot de passe de fonctionner.

Je personnalise toujours le titre et la description du formulaire pour qu'ils correspondent à l'image de marque du site Web. Cliquez sur le titre du formulaire en haut pour le modifier. Vous pourriez le changer du défaut en quelque chose comme « Réinitialisez votre mot de passe » ou « Mot de passe oublié ? ».

Il n'est pas conseillé d'ajouter ou de supprimer des champs de ce modèle car il remplit un objectif très spécifique de manière optimale. Examinons les paramètres de l'e-mail de réinitialisation à l'étape suivante.

Étape 4 : Configurer votre e-mail de réinitialisation de mot de passe

Il est maintenant temps d'affiner le fonctionnement de votre processus de réinitialisation de mot de passe. Rendez-vous dans Paramètres » Inscription utilisateur dans votre constructeur de formulaires pour accéder à toutes les options de réinitialisation de mot de passe.

La première chose que vous voudrez faire est d'activer la fonctionnalité Réinitialisation du mot de passe. Je m'assure toujours que ce commutateur est activé, sinon vos utilisateurs ne pourront pas réinitialiser leur mot de passe via votre formulaire personnalisé.

Une fois cela activé, vous pouvez personnaliser la ligne d'objet de l'e-mail de réinitialisation. Le défaut pourrait fonctionner, mais je préfère qu'il corresponde à la voix de ma marque. Quelque chose comme « Réinitialisez votre mot de passe [Nom du site] » semble plus personnel qu'un texte générique.

Si vous souhaitez modifier le message de l'e-mail de réinitialisation, assurez-vous de ne pas supprimer la balise intelligente {user_registration_password_reset}. Cette balise intelligente crée le lien de réinitialisation sur lequel l'utilisateur doit cliquer.

Faites défiler plus bas et vous verrez une option pour 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, assurez-vous de cliquer sur Enregistrer en haut. À l'étape suivante, nous intégrerons le formulaire sur une nouvelle page.

Étape 5 : Personnaliser l'apparence du formulaire de réinitialisation de mot de passe

Votre formulaire de réinitialisation de mot de passe est fonctionnel, mais il est maintenant temps de le rendre attrayant. Un formulaire bien conçu inspire confiance et rend le processus de réinitialisation plus professionnel.

WPForms dispose d'un assistant d'intégration pratique qui vous permet de placer votre formulaire dans une page nouvelle ou existante directement depuis le constructeur de formulaires, puis vous pouvez personnaliser son apparence directement dans l'éditeur de blocs.

Une fois votre formulaire enregistré, cliquez sur le bouton Intégrer. Comme nous voulons intégrer notre formulaire dans une nouvelle page de réinitialisation de mot de passe, nous sélectionnerons l'option Créer une nouvelle page .

Donnez un nom approprié à votre page, puis cliquez sur C'est parti. Ensuite, WPForms ouvrira l'éditeur de blocs WordPress où vous trouverez votre formulaire de réinitialisation de mot de passe intégré.

Maintenant, utilisez les options de bloc WPForms à droite pour utiliser les fonctionnalités de style de formulaire et personnaliser vos étiquettes, champs et boutons en quelques clics.

Lorsque vous êtes satisfait de votre formulaire, appuyez sur Publier pour le lancer. Votre formulaire de réinitialisation de mot de passe est maintenant en ligne et prêt à l'emploi !

Mais nous n'avons pas encore terminé. Il est important de s'assurer que ce formulaire est facile à trouver pour vos utilisateurs au cas où ils auraient besoin de réinitialiser leur mot de passe. Dans la prochaine étape, nous ajouterons le formulaire de réinitialisation de mot de passe à la navigation principale de votre site.

Étape 6 : Ajouter le formulaire de réinitialisation de mot de passe au menu de navigation

C'est une bonne pratique de rendre votre page de réinitialisation de mot de passe facile à trouver pour vos utilisateurs. Nous le ferons en ajoutant la page de formulaire nouvellement créée à la barre de navigation de votre site en haut.

C'est facile à faire. Ouvrez simplement votre tableau de bord WordPress et allez dans Apparence » Menus. Vous avez peut-être déjà un menu de navigation ajouté à votre site.

Dans ce cas, il vous suffira d'ajouter la page de réinitialisation de mot de passe au menu. Une fois dans l'écran des Menus, cliquez sur votre formulaire de réinitialisation de mot de passe dans la colonne de gauche, puis appuyez sur Ajouter au menu.

Avec cela, la page de réinitialisation de mot de passe sera ajoutée à la pile de pages actuellement dans votre menu à droite. Appuyez sur le bouton Enregistrer le menu pour le mettre à jour.

Le processus de création d'un menu pour la première fois est presque similaire. Il vous suffira de nommer votre menu d'abord, puis d'appuyer sur le bouton bleu Créer le menu en bas.

Une fois que vous avez fait cela, vous pouvez ajouter des pages à votre menu en utilisant les étapes décrites ci-dessus. Voici un exemple de ce à quoi ressemble la navigation pour nous :

Tout ce que nous avons à faire maintenant est d'ajouter une redirection afin que les visiteurs qui essaient d'accéder à votre page de réinitialisation WordPress par défaut soient automatiquement redirigés vers votre nouvelle page personnalisée de réinitialisation de mot de passe.

Facultatif : Ajouter une redirection vers le formulaire de réinitialisation de mot de passe personnalisé

Si vous créez un formulaire personnalisé pour réinitialiser les mots de passe sur votre site Web, il pourrait être judicieux de créer également un formulaire de connexion personnalisé et de marque pour votre site.

Assurez-vous également d'ajouter une redirection pour remplacer la page de connexion WordPress par défaut par la nouvelle page personnalisée. Mais si votre page de connexion par défaut est toujours accessible, vous devriez ajouter une redirection vers le formulaire de réinitialisation de mot de passe.

De cette façon, si un utilisateur clique sur le lien « Mot de passe perdu ? » depuis la page de connexion WordPress, il sera redirigé vers la page personnalisée 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 WordPress par défaut.

Ne vous inquiétez pas ; c'est plus facile que cela en a l'air. D'abord, nous allons installer le plugin WordPress gratuit WPCode. Sur votre tableau de bord WordPress, allez dans Plugins » Ajouter.

À partir de là, recherchez WPCode et cliquez sur Installer maintenant.

Une fois que vous avez cliqué sur Activer, il est temps d'ajouter notre code. Sur votre tableau de bord WordPress, cliquez sur Extraits de code » + Ajouter un extrait.

Après avoir cliqué dessus, vous verrez la bibliothèque prédéfinie avec différentes options de code parmi lesquelles choisir. Cliquez sur Utiliser l'extrait sous l'option Ajouter votre code personnalisé (Nouvel extrait),

Une fois que vous avez nommé votre extrait (nous avons choisi « Nouvelle page de réinitialisation de mot de passe »), cliquez sur le menu déroulant Type de code à droite de l'aperçu du code et sélectionnez Extrait PHP.

Maintenant, vous pouvez copier et coller le code suivant dans l'éditeur :

N'oubliez pas de remplacer reset-password dans le code ci-dessus par le slug de votre nouvelle page de réinitialisation de mot de passe personnalisée.

Ensuite, faites défiler jusqu'à la section Insertion, où vous pouvez spécifier la méthode et l'emplacement d'insertion.

Je recommande 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 le commutateur à côté pour activer l'extrait de code.

Excellent ! Désormais, les utilisateurs arriveront toujours sur votre page de réinitialisation de mot de passe personnalisée lorsqu'ils cliqueront sur le lien « mot de passe oublié ».

Passer d'un formulaire de réinitialisation de mot de passe WordPress standard à un formulaire de réinitialisation personnalisé WPForms vous apporte de nombreux avantages au-delà d'une image de marque améliorée.

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 temps 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 !

FAQ sur la façon de personnaliser le formulaire de réinitialisation de mot de passe

Voici quelques questions courantes que l'on me pose sur la personnalisation du formulaire de réinitialisation de mot de passe WordPress avec WPForms.

Puis-je personnaliser le modèle d'e-mail de réinitialisation de mot de passe ?

Oui, vous pouvez personnaliser l'e-mail de réinitialisation de mot de passe que les utilisateurs reçoivent. Dans les paramètres de Notifications de votre formulaire, vous pouvez modifier la ligne d'objet, le contenu de l'e-mail, et même ajouter votre propre image de marque.

J'inclus généralement des instructions claires et je définis les attentes quant à ce qui se passera ensuite. Vous pouvez utiliser les balises intelligentes pour personnaliser le message avec le nom de l'utilisateur ou d'autres détails de sa soumission.

Comment rediriger les utilisateurs après qu'ils aient soumis le formulaire de réinitialisation de mot de passe ?

Vous avez plusieurs options pour cela. Allez dans Paramètres » Confirmations dans votre constructeur de formulaire et choisissez Afficher la page ou Aller à l'URL (Redirection).

Je redirige souvent les utilisateurs vers une page personnalisée « vérifiez votre e-mail » qui leur donne les prochaines étapes claires. Cela semble plus professionnel que de simplement afficher un message de succès générique.

Puis-je ajouter des champs supplémentaires au formulaire de réinitialisation de mot de passe ?

Absolument. Bien que la réinitialisation de mot de passe de base ne nécessite qu'un champ e-mail, vous pouvez ajouter des questions de sécurité, des numéros de téléphone ou d'autres champs de vérification en utilisant l'un des types de champs disponibles de WPForms.

N'oubliez pas qu'ajouter trop de champs pourrait décourager les utilisateurs de remplir le formulaire. J'essaie de rester simple tout en obtenant la vérification dont j'ai besoin.

Que se passe-t-il si un utilisateur saisit une adresse e-mail qui n'est pas enregistrée ?

Le module complémentaire d'inscription des utilisateurs gérera cela automatiquement. Si quelqu'un saisit une adresse e-mail qui n'existe pas dans votre base de données d'utilisateurs, il ne recevra pas d'e-mail de réinitialisation, mais il ne recevra pas non plus de message d'erreur (cela empêche les gens de pêcher des adresses e-mail valides).

Du point de vue de l'utilisateur, il verra le même message de confirmation. C'est une fonctionnalité de sécurité que j'apprécie vraiment.

Comment puis-je styliser le formulaire de réinitialisation de mot de passe pour qu'il corresponde à mon thème ?

WPForms vous offre plusieurs options de style directement dans le constructeur de formulaires. Cliquez sur votre formulaire intégré dans l'éditeur de page pour accéder au panneau de style, où vous pouvez choisir parmi des thèmes prédéfinis ou personnaliser les couleurs, les polices et l'espacement.

Pour une personnalisation plus avancée, vous pouvez ajouter du CSS personnalisé à votre thème. Je trouve que les options de style intégrées gèrent la plupart des cas sans avoir besoin de code.

Puis-je désactiver la réinitialisation de mot de passe par défaut de WordPress et n'utiliser que mon formulaire personnalisé ?

Oui, mais cela nécessite un travail technique. Vous devrez ajouter du code personnalisé au fichier functions.php de votre thème pour remplacer le comportement de réinitialisation de mot de passe par défaut de WordPress.

Je recommande généralement de garder les deux options disponibles. Votre formulaire personnalisé de réinitialisation de mot de passe WordPress peut être la méthode principale, tandis que la réinitialisation par défaut de WordPress sert de sauvegarde pour les utilisateurs qui en ont besoin.

Comment puis-je empêcher les soumissions de spam sur mon formulaire de réinitialisation de mot de passe ?

WPForms inclut plusieurs fonctionnalités anti-spam que vous pouvez activer. Activez le champ Captcha personnalisé ou activez hCaptcha dans l'onglet Paramètres » Général de votre formulaire.

Vous pouvez également limiter les soumissions de formulaires par adresse IP ou activer la fonctionnalité honeypot. J'ai constaté que ces méthodes fonctionnent bien ensemble pour arrêter la plupart des spams sans frustrer les vrais utilisateurs.

Puis-je suivre le nombre de demandes de réinitialisation de mot de passe que je reçois ?

Oui, WPForms enregistre automatiquement toutes les entrées du formulaire, y compris les demandes de réinitialisation de mot de passe. Accédez à WPForms » Entrées pour voir les détails de soumission, les dates et les informations utilisateur.

Si vous avez besoin d'analyses plus détaillées, vous pouvez connecter votre formulaire à Google Sheets à l'aide du module complémentaire Google Sheets pour suivre les tendances au fil du temps. Cela m'aide à repérer une activité inhabituelle ou à identifier si les utilisateurs rencontrent des difficultés avec certaines parties du processus.

Ensuite, personnalisez votre page de réinitialisation de mot de passe

Après avoir intégré votre formulaire de réinitialisation de mot de passe sur votre nouvelle page, vous voudrez la personnaliser.

Pourquoi ? En personnalisant votre formulaire et votre page de réinitialisation de mot de passe, vous renforcerez l'idée auprès de votre client que vous êtes une entreprise légitime et augmenterez la crédibilité globale de votre marque.

Suivez notre guide complet pour créer et personnaliser des pages de formulaire sur WordPress. De plus, vous voudrez peut-être apprendre comment personnaliser une page protégée par mot de passe dans WordPress.

Consultez également notre guide sur la façon de personnaliser les couleurs de votre thème WordPress et de styliser vos formulaires pour qu'ils correspondent aux couleurs de votre marque.

Créez votre formulaire WordPress maintenant

Prêt à créer votre formulaire ? Commencez dès aujourd'hui avec le plugin de création de formulaires WordPress le plus simple.  WPForms Pro inclut de nombreux modèles gratuits et offre une garantie de remboursement de 14 jours.

Si cet article vous a aidé, suivez-nous sur Facebook et Twitter pour plus de tutoriels et de guides WordPress gratuits.