Création de formulaire de connexion et d’inscription pour Elementor

Si vous souhaitez créer un site Web d'adhésion sur lequel les gens s'inscrivent pour bénéficier de fonctionnalités spéciales, vous devriez alors créer une page de connexion et d'inscription dédiée. Cela vous permettra de rendre votre site Web beaucoup plus professionnel, de demander des informations supplémentaires sur les utilisateurs lors de la procédure d'inscription, et bien plus encore.

Nous avons donc élaboré un didacticiel détaillé pour vous aider à créer une page de connexion et d'inscription personnalisée à l'aide du plugin de création de pages Elementor .

plugin de création de pages les plus populaires et les plus riches en fonctionnalités pour WordPress. La version gratuite du plugin est livrée avec des tonnes de blocs et de widgets pour la construction de base du site. Alors qu'il existe une version pro du plugin offrant des widgets et des blocs plus avancés.

Désormais, le widget de création de formulaire fourni avec Elementor est verrouillé dans sa version professionnelle. Cependant, au lieu d'obtenir Elementor Pro pour créer votre formulaire d'inscription, nous vous recommandons d'opter plutôt pour le plugin Ultimate Addon for Elementor (UAE), car il est livré avec de nombreux blocs et widgets puissants par rapport à Elementor Pro.

Table des matières

• Avantages de la création d'une page d'inscription personnalisée
• 1. Personnalisez les pages d'inscription des utilisateurs
• 2. Collectez toutes les informations requises à partir d'un seul formulaire
• 3. Personnaliser l'expérience utilisateur
• 4. Lutte contre le spam et renforcement de la sécurité
• 5. Parfaitement adapté au style de votre marque
• Comment créer un formulaire d'inscription d'utilisateur personnalisé à l'aide d'Elementor ?
• Étape 1 : Créez un formulaire d'inscription d'utilisateur à l'aide du Plugin UAE (Ultimate Addon for Elementor)
• Étape 2 : Configurez les paramètres de votre formulaire
• Nouveau rôle d'utilisateur
• Choisir après les actions d'inscription
• Étape 3 : Ajoutez le formulaire d'inscription d'utilisateur à votre site Web
• Conclusion:

Avantages de la création d'une page d'inscription personnalisée

En termes de fonctionnalité uniquement, il n’y a aucun problème à utiliser une page d’inscription d’apparence générique sur votre site Web. Mais si vous faites cela, vous manquerez les nombreux avantages offerts par une page d’inscription conçue sur mesure pour votre site Web.

voici un aperçu de certains des principaux avantages de la création d'une page d'inscription personnalisée pour vous donner une idée :

1. Personnalisez les pages d'inscription des utilisateurs

À l'aide de pages d'inscription personnalisées, vous pouvez créer des formulaires d'inscription avec des champs personnalisés et les concevoir selon vos besoins. Vous pouvez personnaliser les formulaires en fonction de vos besoins et exigences afin qu'ils correspondent à votre idée d'entreprise et à votre site Web.

Le widget Formulaire d'inscription utilisateur peut être utilisé pour les éléments suivants :

• Une solution élégante pour devenir membre d'une boutique en ligne
• Un formulaire d'inscription WordPress personnalisé pour refléter votre entreprise
• Un formulaire sécurisé pour les forums et sites e-learning
• Un formulaire d'inscription personnalisé pour les sites d'adhésion

2. Collectez toutes les informations requises à partir d'un seul formulaire

Si vous souhaitez collecter une information particulière auprès de vos membres, vous pouvez l’inclure dans votre formulaire d’inscription.

Il ne s'agit donc pas seulement d'un nom d'utilisateur et d'un mot de passe qu'un utilisateur peut choisir, et c'est tout. Vous pouvez ajouter d'autres champs de formulaire tels que le nom, l'adresse e-mail, les coordonnées, etc. Vous pouvez créer des formulaires complets avec élégance à l’aide de champs personnalisés dans lesquels vous pouvez intégrer une partie de votre formulaire d’inscription.

3. Personnaliser l'expérience utilisateur

Vous pouvez offrir une expérience utilisateur personnalisée à vos membres. Cela peut rediriger les utilisateurs vers une page spécifique, les aider à se connecter automatiquement à leurs comptes ou envoyer un e-mail dans leur boîte de réception.

4. Lutte contre le spam et renforcement de la sécurité

Avec l'ajout de Honeypot et ReCaptcha, vous pouvez lutter contre les spammeurs et empêcher les fausses inscriptions.

5. Parfaitement adapté au style de votre marque

Un formulaire d’inscription doit ressembler aux autres pages de votre site Web. Avec les formulaires d'inscription personnalisés, vous pouvez créer des formulaires qui correspondent à votre entreprise.

Comment créer un formulaire d'inscription d'utilisateur personnalisé à l'aide d'Elementor ?

Maintenant que vous avez une compréhension de base de la façon dont un formulaire d'inscription d'utilisateur personnalisé peut aider votre entreprise, voici un guide complet, étape par étape, sur la façon d'utiliser Elementor et le module complémentaire UAE pour vous aider à créer votre propre expérience de connexion utilisateur personnalisée.

Voici un guide en trois étapes sur la façon dont vous pouvez créer un formulaire d'inscription d'utilisateur pour votre site Web.

Remarque : Avant de continuer, assurez-vous d'avoir activé l' Adhésion en vous rendant sur Tableau de bord > Paramètres > Général > Adhésion : Activée .

L’activation de l’option d’adhésion permettra à tout utilisateur de s’inscrire sur votre site Web.

Étape 1 : Créez un formulaire d'inscription d'utilisateur à l'aide du Plugin UAE (Ultimate Addon for Elementor)

Pour créer un formulaire d'inscription utilisateur personnalisé, assurez-vous que vous disposez de la version mise à jour du plugin UAE , avec le bloc activé.

Une fois que vous vous êtes assuré des prérequis pour créer une page de connexion, vous devez créer ou ajouter une nouvelle page. Et modifiez la page où vous souhaitez joindre le formulaire d’inscription de l’utilisateur.

Si vous faites glisser et déposez le widget, vous pouvez voir les champs de formulaire par défaut.

Vous pouvez jouer avec les champs : vous pouvez supprimer un champ dont vous n'avez pas besoin ou ajouter d'autres champs tels que le nom d'utilisateur, le prénom, etc.

Il existe une option pour gérer la largeur requise et la largeur des colonnes sur les champs de formulaire individuels.

Vous pouvez également gérer la taille d'entrée, les étiquettes des champs (que vous souhaitiez les afficher ou les masquer), ou la marque obligatoire.

Étape 2 : Configurez les paramètres de votre formulaire

Après avoir couvert les bases, vous pouvez configurer les paramètres du formulaire en visitant la Paramètres généraux . Vous pouvez exécuter les fonctions suivantes à partir d'ici :

• Nouveau rôle d'utilisateur
• Choisissez « Actions après l'inscription »

Voici un compte rendu détaillé des deux :

Nouveau rôle d'utilisateur

Si vous disposez d'un site d'adhésion qui nécessite qu'un utilisateur l'enregistre sur votre site Web, vous attribuez par défaut le « rôle d'utilisateur » en tant qu'abonné .

Vous pouvez définir un rôle d'utilisateur par défaut pour vos membres, et le rôle attribué sera défini pour tous les nouveaux utilisateurs lors de leur inscription sur votre site Web.

Choisir après les actions d'inscription

Un utilisateur peut sélectionner les actions suivantes qu'il peut effectuer après s'être inscrit sur un site d'adhésion, à l'aide du widget Formulaire d'inscription de l'utilisateur :

• Connexion automatique : avec cette option, vous pouvez permettre à l'utilisateur de se connecter automatiquement à votre site Web. Après avoir fourni les informations d'identification pour la première fois, l'utilisateur n'aura pas besoin de se reconnecter car il sera automatiquement connecté au site Web après l'inscription réussie.
• Redirection après inscription : avec cette option, vous pouvez rediriger les utilisateurs vers une page d'accueil ou une page de connexion - après une inscription réussie. Vous pouvez définir une page de redirection en collant l'URL de la page souhaitée dans le champ URL sous cette option.
• Envoyer un email : lorsque l'utilisateur s'inscrit avec succès sur votre site, cette option lui enverra un email confirmant son inscription. Le contenu de l'e-mail est personnalisable et vous pouvez personnaliser ces e-mails pour plus de chaleur. Mais si vous souhaitez envoyer le même e-mail à tous vos utilisateurs, vous pouvez également le faire en explorant cette option.

• Masquer après l'inscription : Parfois, vous souhaiterez peut-être masquer le formulaire d'inscription de l'utilisateur une fois qu'il s'est inscrit avec succès sur votre site. Avec l'option « Masquer après l'inscription », vous pouvez masquer le formulaire d'inscription tout en les dirigeant vers une page de connexion ou simplement l'affichage du message « Réussite » après leur avoir fourni un lien pour visiter la page de connexion et accéder au site Web. Vous pouvez trouver cette option dans la section Paramètres généraux de l'onglet Contenu du widget.

Ensuite, vous pouvez concevoir et styliser le formulaire d'inscription de l'utilisateur à l'aide de l'onglet Style du widget.

Après cela, vous avez terminé le processus de création et de configuration du widget Formulaire d'inscription de l'utilisateur. Le formulaire est prêt à être mis en ligne sur le site Web en direct.

Étape 3 : Ajoutez le formulaire d'inscription d'utilisateur à votre site Web

Cette partie est assez basique et simple. Vous pouvez directement glisser-déposer pour ajouter ce widget, comme n'importe quel autre widget Elementor. Vous pouvez également enregistrer la section contenant le widget et récupérer la section enregistrée dans la page d'inscription requise.

Ci-dessous, nous avons élaboré quelques façons supplémentaires d'ajouter n'importe quel widget dans l'éditeur Elementor.

par exemple pour le formulaire d'inscription d'utilisateur sur une page WooCommerce

Si vous souhaitez créer une page WooCommerce personnalisée, c'est-à-dire une page Mon compte, sous le nom de Page de compte personnalisée, vous pouvez simplement :

En cliquant sur le bouton « Modifier avec Elementor », vous accéderez à l'éditeur Elementor.

Nous pouvons créer un autre formulaire d'inscription comme celui-ci et l'enregistrer pour l'utiliser sur la page du compte personnalisé en suivant les mêmes étapes mentionnées ci-dessus.

Enfin, pour définir la page comme « Page Mon compte », accédez au tableau de bord WordPress. Et suivez le chemin suivant sous l’option WooCommerce :

WooCommerce > Paramètres > Avancé > Mise en page > Page Mon compte > Page Mon compte > sélectionnez Page de compte personnalisée

Vous pouvez voir la page contenant des Émirats arabes unis sur la page du compte WooCommerce.

Conclusion:

Vous pouvez créer un formulaire d'inscription élégant, avec la préférence d'option de votre choix, pour votre site Web en utilisant Elementor et UAE .

En suivant les étapes indiquées dans cet article, vous pouvez enregistrer des utilisateurs à l'aide du widget Formulaire d'inscription des utilisateurs des Émirats arabes unis . Il s'agit d'une solution simple et élégante pour créer un formulaire d'inscription d'utilisateur élégant pour vos nouveaux utilisateurs.