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

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.

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.

Mise en évidence de la flèche dans l'onglet Téléchargements de WPForms

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.

Télécharger le bouton WPForms

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.

Bouton de téléchargement du plugin sur WordPress

A partir de là, cliquez sur le bouton Choose File et sélectionnez le fichier zip WPForms que vous venez de télécharger.

Flèche rouge pointant vers le bouton Choisir un fichier

Une fois votre fichier téléchargé, cliquez sur le bouton Installer maintenant.

Installer maintenant wpforms

Une fois le plugin installé, cliquez sur le bouton Activer le plugin pour activer WPForms sur votre site.

Flèche rouge pointant vers le bouton "Activer le plugin".

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.

WPForms addons

Si vous ne voyez aucun addon pour votre niveau de licence, cliquez sur le bouton Actualiser les addons pour forcer une actualisation.

Une flèche rouge pointant vers le bouton orange "Actualiser les modules complémentaires".

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 flèche mettant en évidence le champ "Search Addons" dans WPForms

Une fois que vous l'avez trouvé, il vous suffit de cliquer sur le bouton Installer le module complémentaire.

Une flèche rouge pointant vers le bouton d'installation de l'addon

Cela installera et activera automatiquement l'addon pour vous. Tout addon installé et prêt à être utilisé affichera Status : Actif.

Flèche rouge indiquant que le plugin d'enregistrement de l'utilisation est 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.

Mise en évidence du bouton "Utiliser le modèle".

Une fois que vous avez sélectionné le modèle, le formulaire de réinitialisation du mot de passe s'affiche sur votre écran.

Formulaire de réinitialisation du mot de passe

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.

Paramètres du formulaire de réinitialisation du mot de passe

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.

Courriel de réinitialisation du mot de passe

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.

Réinitialiser le lien étiquette intelligente

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.

Masquer le formulaire pour les utilisateurs connectés

Excellent !

Une fois que vous avez personnalisé les paramètres, n'oubliez pas de cliquer sur Enregistrer en haut de la page.

Bouton d'enregistrement pour sauvegarder le formulaire

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.

Intégrer un bouton de formulaire

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.

Intégrer un formulaire dans une nouvelle page

Donnez un nom approprié à votre page, puis cliquez sur " Let's Go".

Intégrer dans une page

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.

Personnalisation des styles pour le formulaire de réinitialisation du mot de passe

Lorsque vous êtes satisfait de votre formulaire, cliquez sur Publier pour le lancer.

Publier le formulaire de réinitialisation du mot de passe

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.

6. Ajouter le formulaire de réinitialisation du mot de passe au menu de navigation

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.

Menu de navigation

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.

Ajouter une page 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.

Sauvegarder le menu

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.

Créer un nouveau menu

Ensuite, vous pouvez ajouter des pages à votre menu en suivant les étapes indiquées ci-dessus.

Voici un exemple de navigation :

Menu 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.

ajouter un nouveau plugin wordpress

De là, recherchez WPCode et cliquez sur Installer maintenant.

Plugin WPCode

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.

Ajouter un extrait

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),

Ajoutez votre code personnalisé

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".

Extrait PHP

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.

Options d'insertion du code WPC

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.

Activation et sauvegarde des snippets par WPCode

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.

Divulgation: Notre contenu est soutenu par les lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, il se peut que nous recevions une commission. Voyez comment WPForms est financé, pourquoi c'est important, et comment vous pouvez nous soutenir.

Renée DeCoskey

Renee DeCoskey blogue depuis 2001 et utilise WordPress depuis 2007. Lorsqu'elle n'écrit pas sur les plugins WordPress, elle se plonge dans un livre ou s'amuse au Rotary.En savoir plus

Le meilleur plugin WordPress de construction de formulaires par glisser-déposer

Facile, rapide et sécurisé. Rejoignez plus de 6 millions de propriétaires de sites web qui font confiance à WPForms.

Veuillez activer JavaScript dans votre navigateur pour remplir ce formulaire.

4 comments on "Comment personnaliser le formulaire de réinitialisation du mot de passe de WordPress"

  1. 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.

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de confidentialité et que tous les liens ne sont pas suivis. N'utilisez PAS de mots-clés dans le champ du nom. Engageons une conversation personnelle et constructive.

Ce formulaire est protégé par le tourniquet de Cloudflare et la politique de confidentialité et les conditions de service de Cloudflare s'appliquent.