---
title: "Élément Formulaire : collecter des messages"
description: "Ajoutez un formulaire de contact ou de saisie à votre page ; les réponses de vos visiteurs remontent automatiquement dans la page Contacts."
url: https://docs.vivlab.com/editor/menu/form
---

# Formulaire

L'élément **Formulaire** crée un formulaire de contact ou de saisie de données sur votre page. Les réponses des visiteurs vous sont remontées et stockées dans la page [Contacts](https://docs.vivlab.com/sections/contacts.md).

## Liste des champs

La rubrique principale affiche la liste des champs du formulaire. Cliquez sur un champ pour le modifier, ou utilisez les actions pour le **dupliquer**, **supprimer** ou en ajouter un nouveau.

Pour chaque champ :

- **Type de champs** : choisissez parmi **Réponse courte**, **Réponse longue**, **Choix multiple**, **Choix unique**, **Téléphone** ou **Adresse e-mail**. Le type détermine la validation appliquée à la saisie du visiteur.
- **Nom du champs** : le libellé affiché au-dessus du champ.
- Pour **Choix multiple** et **Choix unique**, une liste secondaire vous permet de définir les options proposées au visiteur.
- **Champs obligatoire** : empêche l'envoi du formulaire si ce champ est vide.
- **Prendre toute la largeur** : étend le champ sur toute la largeur du formulaire au lieu d'une demi-largeur. Sur mobile, tous les champs prennent automatiquement toute la largeur.

<DocsScreenshot name="editor-form-field" alt="Un champ de réponse longue obligatoire, sur toute la largeur." :width="346" :height="233" />

<DocsScreenshot name="editor-form-types" alt="Les six types de champs disponibles dans un formulaire." :width="346" :height="326" />

## Style des champs

La rubrique **Style des champs** définit l'apparence des cases de saisie :

- **Couleur du texte** : couleur de la valeur tapée par le visiteur.
- **Couleur des champs** : couleur de fond des cases de saisie.
- **Couleur des bordures** : couleur du contour des cases.

## Style du bouton

La rubrique **Style du bouton** personnalise le bouton de validation du formulaire :

- **Texte du bouton** : son libellé (par exemple « Envoyer », « Valider », « M'inscrire »).
- **Couleur du bouton** : couleur du texte du bouton.
- **Couleur de fond du bouton** : couleur de remplissage.
- **Couleur des bordures** : couleur du contour.

## Style global

Le [panneau de style](https://docs.vivlab.com/editor/style/index.md) regroupe le [style du texte](https://docs.vivlab.com/editor/style/text.md) global, l'[arrière-plan](https://docs.vivlab.com/editor/style/background.md) du formulaire, les [bordures](https://docs.vivlab.com/editor/style/border.md), l'[arrondi des angles](https://docs.vivlab.com/editor/style/border-radius.md), l'[ombre](https://docs.vivlab.com/editor/style/box-shadow.md), les [marges intérieures](https://docs.vivlab.com/editor/style/padding.md), l'[alignement vertical](https://docs.vivlab.com/editor/style/align.md) et les [transitions](https://docs.vivlab.com/editor/style/transition.md).

## Suivi des réponses

Chaque envoi du formulaire déclenche un **e-mail** vers l'adresse de votre compte avec le contenu de la saisie, et alimente la page [**Contacts**](https://docs.vivlab.com/sections/contacts.md) où vous retrouvez le détail de chaque demande, la page d'origine et un raccourci pour répondre directement par e-mail.

## Alternatives externes

Si vous avez besoin d'un formulaire plus avancé (logique conditionnelle, calculs, intégration directe avec un CRM ou un outil d'e-mailing), vous pouvez intégrer un formulaire tiers à votre page via l'élément [Iframe](https://docs.vivlab.com/editor/menu/iframe.md).

- **Tally** ([tally.so](https://tally.so)) : outil de création de formulaires riches, avec logique conditionnelle et large choix de champs. Créez votre formulaire sur Tally, copiez le code d'intégration (`<iframe>`), puis collez-le dans un élément Iframe de votre page.
- **Brevo** ([brevo.com](https://www.brevo.com), anciennement Sendinblue) : plateforme d'e-mail marketing française, particulièrement adaptée pour l'inscription à votre newsletter. Brevo gère la conformité RGPD, la double confirmation et la gestion des listes. Récupérez le code d'intégration du formulaire dans Brevo, puis collez-le dans un élément Iframe.

Vous pouvez aussi remplacer le formulaire intégré par un simple [bouton](https://docs.vivlab.com/editor/menu/button.md) pointant vers l'URL hébergée du formulaire Tally ou Brevo.