Comment créer un formulaire de contact ?

Bonjour,

Dans cette vidéo, je vais vous expliquer comment créer un formulaire de contact. C’est très simple : rendez-vous dans la partie communication, puis sélectionnez “formulaire”. Vous y trouverez des formulaires de démonstration, dont un formulaire de contact par défaut, “Contact Form Demo”, fourni avec l’application.

Vous avez deux options : éditer ce formulaire existant ou en créer un nouveau de A à Z. Pour éviter de modifier le formulaire existant, qui est en anglais, nous allons en créer un nouveau en français. Retournons donc à l’accueil des formulaires et cliquons sur “Add New Form”. Sélectionnez “New Blank Form” pour démarrer.

Une fois le formulaire créé, il suffit de glisser-déposer les champs disponibles sur la droite. Demandez le nom, le prénom, l’adresse email, le sujet de contact et le message. Vous pouvez opter pour un formulaire plus avancé en utilisant, par exemple, une liste déroulante pour le sujet avec des options prédéfinies.

Pour éditer un champ, sélectionnez-le et renommez-le. Par exemple, renommez “text” en “Sujet” et “textarea” en “Message”. Laissez les autres champs comme “Prénom”, “Nom”, et “Adresse Email” par défaut.

Intégrez ensuite votre formulaire avec Elementor, qui offre des options pour personnaliser l’apparence de votre formulaire. Vous pourriez choisir d’afficher les étiquettes des champs directement à l’intérieur de ceux-ci pour un style plus moderne.

Nommez votre formulaire, par exemple “Formulaire de Contact”, et sauvegardez-le. Dans les réglages, décidez du message affiché une fois le formulaire soumis ou redirigez l’utilisateur vers une page de remerciement ou une URL externe.

Pour voir à quoi ressemble votre formulaire, cliquez sur “prévisualisation”. Après soumission, un message de remerciement apparaît par défaut, mais vous pouvez le personnaliser ou rediriger l’utilisateur comme vous le souhaitez.

Ensuite, pour publier votre formulaire de contact, créez une nouvelle page intitulée, par exemple, “Contact Test”. Éditez cette page avec Elementor, ajoutez une section, recherchez “Fluent Form” (le widget de formulaire Fluent, traduit automatiquement), et sélectionnez votre formulaire de contact dans les options.

Vous pouvez styliser davantage votre formulaire directement dans Elementor, en ajustant par exemple la position du bouton “Envoyer”, sa largeur, et d’autres éléments pour que le formulaire s’intègre parfaitement à votre design.

C’est tout pour ce tutoriel. Vous savez maintenant comment créer et personnaliser un formulaire de contact pour votre site.