Le bloc de formulaire de contact vous permet d'ajouter facilement des formulaires de contact à vos pages SeedProd. Ce bloc s'intègre parfaitement avec WPForms, l'un des constructeurs de formulaires WordPress les plus populaires, vous permettant de créer et de gérer des formulaires de contact professionnels sans aucun codage.
Avec le bloc de formulaire de contact, vous pouvez intégrer n'importe quel formulaire de contact WPForms directement dans vos pages de destination, vos pages "bientôt disponibles" ou vos pages en mode maintenance. Cela permet à vos visiteurs de vous contacter facilement tout en conservant le beau design de vos pages SeedProd.
Ajouter le bloc de formulaire de contact à vos pages
Suivez ces étapes pour ajouter un bloc de formulaire de contact à votre page SeedProd :
Étape 1 : Ajouter le bloc
Sous Design > Blocs, faites glisser le bloc Formulaire de contact dans la section souhaitée de votre page.
Localisez le bloc Formulaire de contact dans le panneau des blocs et faites-le glisser à l'emplacement souhaité sur la page.
Étape 2 : Configurer les paramètres de contenu
Une fois ajouté, cliquez sur le bloc Formulaire de contact pour ouvrir ses paramètres. Dans l'onglet Contenu, vous pouvez sélectionner le formulaire de contact WPForms à afficher.
Formulaire :
- Sélectionner un formulaire : Choisissez parmi tous les formulaires de contact que vous avez précédemment créés dans WPForms. Le menu déroulant affiche tous les formulaires disponibles de votre bibliothèque WPForms
- + Nouveau formulaire : Créez un nouveau formulaire de contact WPForms directement depuis l'éditeur SeedProd. Cela ouvre l'éditeur WPForms où vous pouvez concevoir votre formulaire, puis revenir pour le sélectionner
Sélectionnez votre formulaire de contact WPForms dans le menu déroulant ou créez un nouveau formulaire.
Étape 3 : Personnaliser le design
Dans l'onglet Avancé, vous pouvez personnaliser l'apparence visuelle de votre bloc Formulaire de contact :
Styles avancés :
- Typographie : Personnalisez la famille de polices, la taille, l'épaisseur, la hauteur de ligne et l'espacement des lettres pour le texte du formulaire. Cliquez sur Modifier pour accéder aux contrôles typographiques détaillés pour les étiquettes et le texte des champs du formulaire
- Couleur du texte : Définissez la couleur des étiquettes et du texte du formulaire pour qu'elle corresponde à la conception de votre page
Espacement :
- Marge : Contrôlez l'espacement extérieur autour de votre bloc Formulaire de contact (Haut, Droite, Bas, Gauche). Cela détermine l'espace entre le formulaire et les éléments environnants
- Rembourrage : Ajustez l'espacement intérieur de votre bloc Formulaire de contact (Haut, Droite, Bas, Gauche). Cela crée un espace entre le contenu du formulaire et les bords du bloc
Attributs :
- ID CSS : Affiche l'identifiant unique généré automatiquement pour votre bloc Formulaire de contact. Cet ID est créé automatiquement par SeedProd pour le style personnalisé ou le ciblage JavaScript
- Classe personnalisée : Ajoutez des classes CSS personnalisées pour appliquer des styles spécifiques de votre thème ou de votre CSS personnalisé
- Attributs personnalisés : Ajoutez tous les attributs HTML à l'élément wrapper du formulaire. Entrez chaque attribut sur une nouvelle ligne en utilisant le format : nom-attribut|valeur (par exemple, data-tracking|formulaire-de-contact)
Visibilité de l'appareil :
- Masquer sur ordinateur : Masquer le bloc Formulaire de contact sur les écrans d'ordinateur
- Masquer sur tablette : Masquer le bloc Formulaire de contact sur les appareils tablettes
- Masquer sur mobile : Masquer le bloc Formulaire de contact sur les appareils mobiles
Effets d'animation :
- Animation d'entrée : Choisissez parmi divers effets d'animation qui s'affichent lorsque le Formulaire de contact défile dans la vue. Les options incluent Bounce, Fade In, Zoom In, Rotate In, et bien d'autres. Cela permet d'attirer l'attention sur votre formulaire de contact et de créer un intérêt visuel.
Personnalisez la typographie, l'espacement et les paramètres d'affichage dans l'onglet Avancé.
Étape 4 : Enregistrez vos modifications
Une fois que vous avez terminé de configurer le bloc Formulaire de contact et de personnaliser son apparence, assurez-vous de sauvegarder votre travail.
Vous avez ajouté avec succès un bloc Formulaire de contact à votre page ! Le bloc Formulaire de contact facilite la collecte d'informations sur les visiteurs, la réponse aux questions et l'établissement de relations avec votre public. Expérimentez avec différents designs et options de style WPForms pour créer un formulaire de contact qui correspond à votre marque et encourage l'engagement des visiteurs.