weForm
Vous aimez weForms pour sa puissance, mais dans un site Web construit par Elementor, il peut se sentir comme un étranger (s) coincé (s) dans son look par défaut, refusant de se fondre dans. Plus de compromis Master Addons weForms Element vous remet les clés du studio de design, Tirez n'importe quel weForm existant directement dans l'éditeur Elementor et stylisez chaque pièce de celui-ci Appliquez des mises en page professionnelles en un clic, puis tweetez tout, de l'ombre du conteneur à la couleur du texte de l'espace réservé Faites de vos formulaires de contact, enquêtes et formulaires d'enregistrement une belle extension transparente de votre marque Arrêtez de laisser vos formulaires briser la magie du design.
Préréglages de conception et de mise en page instantanés
Pourquoi partir d'une ardoise vierge ? touchez le sol en courant avec des préréglages de Design Layout organisés (Style One à Eleven).Chaque préréglage applique un ensemble coordonné de styles (styles One à Eleven) pour le conteneur, les champs et le bouton (« the curning ») qui vous donne instantanément une forme conçue par des professionnels Que vous ayez besoin d'une forme légère minimaliste, d'une carte noire audacieuse ou de quelque chose avec des bordures vibrantes, il y a un point de départ C'est le moyen le plus rapide de faire ressembler un weForm à ce qu'il était toujours censé faire partie de votre page Elementor.
- 11+ Styles prêts à l'emploi : Choisissez parmi une bibliothèque de mises en page prédéfinies comme “Style One”, “Style Two”, etc., pour un attrait visuel instantané.
- Systèmes de conception cohérents : chaque préréglage stylise l'ensemble de la forme de manière holistique : conteneur, champs, bouton : garantissant une correspondance parfaite.
- Point de départ parfait : utilisez un préréglage comme base, puis personnalisez davantage avec des commandes granulaires pour le rendre uniquement vôtre.
Architecture complète des conteneurs et des champs
Contrôlez le cadre même et les blocs de construction de votre formulaire Tout d'abord, concevez le conteneur de formulaire : définissez sa largeur, son alignement, son arrière-plan, son remplissage, et ajoutez des effets avancés comme Box Shadow et Border Radius pour le faire éclater ou se mélanger Ensuite, architecturez les champs de formulaire eux-mêmes Ajustez la largeur d'entrée et la largeur de la zone de texte indépendamment, définissez le fond du champ, le pavé interne et les bordures Vous pouvez même concevoir l'état de mise au point (focus State) (frontière) et ombre (shadow) lorsqu'un utilisateur clique dans un champ pour une sensation polie, interactive.
- Contrôle des dimensions du champ : définissez différentes largeurs pour les entrées standard et les champs de zone de texte (message).
- États de mise au point interactifs : définissez la couleur de bordure et l'ombre de boîte personnalisées pour les champs lorsque les utilisateurs cliquent dessus, améliorant ainsi la convivialité.
- Espacement et coins : rembourrage de champs affiné et rayon de bordure de tous les côtés pour chaque boîte de saisie.
Contrôle des couleurs et de la typographie
La typographie et la couleur sont l'âme de votre design Ici, vous les contrôlez pour chaque élément de texte séparément Stylez l'étiquette (comme “Email Address *”) avec sa propre couleur et typographie Définissez la couleur de la police de champ pour ce que les utilisateurs tapent. Fondamentalement, stylisez la couleur de la police de l'espace réservé souvent oubliée (“Your email...”). Utilisez des contrôles de typographie séparés pour les étiquettes et les champs de saisie pour créer une hiérarchie visuelle claire, garantissant que votre formulaire n'est pas seulement élégant mais lisible sans effort.
- Style de texte triple couche : définir indépendamment les couleurs des étiquettes, des polices de champ saisies et du texte de l'espace réservé.
- Typographie hiérarchique : Appliquez différentes familles de polices, tailles et poids à la typographie des étiquettes et à la typographie des champs de saisie.
- Clarté visuelle : utilisez des couleurs contrastées pour les étiquettes et les espaces réservés pour guider les utilisateurs intuitivement à travers le formulaire.
Soumettre la personnalisation du bouton
Le bouton soumettre est la dernière étape, la plus importante Ne le laissez pas comme rectangle gris par défaut Prenez la commande complète Contrôlez sa largeur et son alignement Stylez sa typographie Définissez la couleur du texte et la couleur de fond pour les états Normal et Hover Ajustez son Padding, Margin, Border, et Border Radius pour obtenir la forme et la taille parfaites Ajoutez un Box Shadow pour le faire décoller de la page Cela transforme une “Submit” banale en un déclencheur convaincant et digne d'un clic pour vos conversions.
- Contrôle de dimension complète : ajustez la largeur du bouton, le rembourrage, la marge et le rayon de bordure pour une géométrie de bouton parfaite.
- Liberté d'alignement : positionnez le bouton à gauche, au centre ou à droite dans le conteneur de formulaire.
- Effets avancés : appliquez Box Shadow et des types de bordures personnalisés pour faire de votre bouton un élément visuel remarquable.
Foire aux questions pour weForm
Comment connecter cet élément à mes weForms existants ?
C'est simple Dans l'onglet Contenu, vous verrez une liste déroulante “Select weForm” Cliquez dessus, et vous verrez une liste de tous les formulaires que vous avez créés dans le tableau de bord du plugin weForms Il suffit de sélectionner celui que vous souhaitez intégrer et concevoir L'élément tire dans vos champs de formulaire en direct (Nom, Email, etc) automatiquement.
Mon formulaire fonctionnera-t-il toujours et enverra-t-il des e-mails comme avant ?
Absolument, oui Cet élément ne modifie que la conception visuelle du formulaire dans Elementor Toutes les fonctionnalités principales de weForms (champ logique, notifications, routage des e-mails, confirmations et confirmations de données par e-mail) Cet élément reste intact à 100 % et fonctionne exactement comme vous l'avez configuré dans les paramètres du plugin weForms.
Puis-je utiliser différents styles pour différents formulaires sur le même site ?
Bien sûr ! chaque élément de Master Addons weForms que vous placez sur une page est stylisé indépendamment Vous pouvez avoir un formulaire de contact minimaliste dans votre pied de page (en utilisant Style Two) et un formulaire d'inscription audacieux et coloré dans votre section héros (en utilisant Style Seven) sans aucun conflit.
La forme conçue est-elle entièrement réactive sur mobile ?
Oui. L'élément est construit en gardant à l'esprit la réactivité La largeur du conteneur, les largeurs de champ, le remplissage et les tailles de police s'adapteront tous Pour un contrôle avancé, vous pouvez utiliser le mode réactif d'Elementor pour modifier les paramètres spécifiquement pour les vues des tablettes et des mobiles (comme empiler les champs ou ajuster la taille des boutons).
Que faire si je mets à jour les paramètres de mon champ dans le plugin principal weForms ?
Vos modifications (comme l'ajout d'un nouveau champ ou la modification d'une étiquette de champ) se synchroniseront automatiquement Vous devrez peut-être simplement actualiser la vue de l'éditeur Elementor (comme le suggère le texte de l'assistant) pour voir la structure de champ mise à jour Vos styles personnalisés s'appliqueront alors aux champs nouveaux ou mis à jour.
Puis-je toujours utiliser Conditional Logic et d'autres fonctionnalités avancées de weForms ?
Certainement. Puisque cet élément intègre votre véritable WeForm fonctionnel, toutes les fonctionnalités avancées telles que la logique conditionnelle, les formulaires multi-pages, les téléchargements de fichiers et les intégrations que vous avez configurées dans weForms fonctionneront parfaitement. Vous lui donnez simplement un nouveau et magnifique skin front-end.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
Duplicateur de messages/pages
