> For the complete documentation index, see [llms.txt](https://nanoxi.gitbook.io/starterkitv4/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nanoxi.gitbook.io/starterkitv4/formulaires/creation-parametrage.md). # Création, paramètrage Umbraco Forms permet de créer rapidement et simplement des formulaires. Ces formulaires peuvent être des formulaires de contact, de quiz, de satisfaction, etc. Pour en créer un, rendez-vous dans la section « Formulaires », faites un clic droit sur « Forms » puis cliquez sur « Créer... ».

Ensuite, vous pouvez choisir un modèle par défaut de formulaire. Sélectionnez celui qui vous convient le mieux.

Comme pour certains widgets, les formulaires ont deux onglets, l'un est « Design » et le deuxième est « Paramètres » . ## Onglet « Design » L'onglet Design permet de gérer les divers champs du formulaire, leur titre, ordre, type et propriété. ### Ajout d'une question Cliquez sur le bouton « Ajouter une question » situé en bas d'un groupe de question ou d'une page.

Vous devez ensuite choisir entre les [différents types de champs](#type-de-champs-disponible) disponibles, indiquer l'intitulé de la question, son alias (identifiant unique), un éventuel texte d'aide, et des propriétés propres au type de champs choisi. ### Groupe de questions Dans le but d'avoir une meilleure structure sur votre formulaire et pour que l'utilisateur ne soit pas perdu, vous avez également la possibilité de grouper les questions. Pour le faire, vous pouvez cliquer sur le bouton « Ajouter un nouveau groupe » au fond de chaque page de votre formulaire. Vous pouvez aussi émettre un titre pour chaque groupe comme par exemple "Informations personnelles", "Préférences". ### Séparer le formulaire en plusieurs pages Vous avez la possibilité de séparer votre formulaire en plusieurs pages si celui-ci est trop grand. Pour le faire, vous avez juste à descendre au fond de votre formulaire et de cliquer sur le bouton « Ajouter une nouvelle page ».

### Ajout d'une condition sur un champ Les conditions sont utiles dans le cas où plus de détails sont nécessaires. Par exemple, si une personne répond favorablement à une question dans une case à cocher, comme "Possédez-vous le permis ?", et si l'utilisateur répond oui, un nouveau champ apparaît demandant des détails tels que la catégorie (B1, C, A, D, ..). Pour ce faire, descendez au bas des paramètres de la question désirée et activez les conditions. Ensuite, vous pouvez choisir d'afficher ou de cacher cette question si toutes les conditions sont remplies. Sélectionnez également le champ qui servira de test à la condition et la valeur testée. Pour notre exemple, il s'agit de la question « Possédez-vous le permis de conduire ? » avec un test pour vérifier si la réponse de l'utilisateur contient « Oui ».

### Établir des colonnes Dans les groupes, vous avez la possibilité de diviser les questions en plusieurs colonnes, avec un maximum de douze colonnes. Pour le faire, il vous suffit de vous rendre sur l'icône d'engrenage (paramètre) située en haut à droite du groupe de questions. Ensuite, vous pouvez définir le nombre de colonnes. Par défaut, ce nombre est réglé sur un. ### Modification de l'ordre des champs Cliquez sur le bouton bleu « Réorganiser » situé à droite de la fenêtre et en dessous des deux onglets.

Ensuite, vous pouvez adapter l'ordre des champs ou des groupes de champ via l'icône en forme de croix située à gauche des éléments. Il suffit de maintenir le clic sur l'icône d'un élément et de le déplacer selon vos désirs.

## Type de champs disponible

Type	Description
Short answer	Une zone de saisie de texte normale Convient pour un nom, prénom, e-mail, adresse, ...
Long answer	Une zone de saisie de texte de grande taille Convient pour un message, une description, un biographie, ...
Date	Un calendrier permettant de choisir une date
Checkbox	Case à chocher ayant un choix unique Convient pour un vrai/faux, mineur/majeur, ...
File upload	Sélection d'un fichier
Password	Une zone de saisie de texte normale mais avec sont contenu caché
Multiple choice	Une liste de case à cocher à choix multiple
Data Consent	Affiche un checkbox permettant de consentir à un règlement, une politique ou à des conditions
Dropdown	Affiche une liste déroulante
Single Choice	Une liste de case à cocher à choix unique
Title and description	Un titre et une description
Rich text	Une zone de saisie de grande taille avec un éditeur de contenu riche Voir la signification des boutons de l'éditeur de contenu
Hidden	Un champ caché Convient pour des tokens, des identifiants
reCAPTCHA v2	Affiche le reCAPTCHA visible de Google (anti-robot)
reCAPTCHA v3 with score	Affiche également le reCAPTCHA de Google mais sans être visible. Le contrôle anti-robot est fait avec un score en fonction des mouvements des actions de l'utilisateur

## Onglet « Paramètres » Cet onglet permet de configurer les paramètres globaux du formulaire tels que l'autocomplétion, l'éventuel message d'erreur, la modération, ... #### Store records Permet de stocker les enregistrements du formulaire dans la base de données. Si cette option n'est pas cochée, vous ne pouvez plus visionner les entrées directement depuis l'interface d'administration d'Umbraco, mais seulement depuis l'e-mail envoyé par le workflow configuré. #### Captions Légendes du formulaire pour les boutons d'envoi, de suivant et de précédent. #### Styling Applique une classe CSS supplémentaire au formulaire (pour le design) et, via le deuxième champ, permet également de désactiver le style par défaut du formulaire à l'aide de la case à cocher. #### Validation Les deux premiers champs de l'onglet Validation servent à personnaliser le message d'erreur lorsque l'utilisateur a soit oublié de remplir un champ du formulaire, soit s'est trompé sur un champ en y insérant, par exemple, un numéro de téléphone à la place d'une adresse e-mail. La notation « {0} » dans le contenu des deux champs sera remplacée par Umbraco par le champ en question. Par exemple, si l'utilisateur oublie de remplir le champ prénom, le « {0} » sera substitué, et le message deviendra « Veuillez remplir le champ Prénom ». Ensuite, vous avez la possibilité de personnaliser l'indicateur des champs obligatoires en le modifiant par un autre caractère que « \* », en le désactivant, ou en marquant seulement les champs facultatifs. #### Autocomplete Ajoute un attribut qui permet l'autocomplétion ou non du formulaire. #### Moderation Active ou non la modération sur le formulaire. Cette option est utile pour des formulaires où le contenu inscrit par l'utilisateur est affiché publiquement, comme pour les commentaires sur des articles. Il permet de filtrer le contenu et d'éviter d'avoir du contenu offensant. #### Fields displayed Personnalise les champs affichés sur la page des entrées du formulaire afin de pouvoir présenter les champs les plus importants ou d'obtenir une meilleure structure d'affichage. {% content-ref url="/pages/gEtdS8lSfbsHo6Ove4hP" %} [Entrées](/starterkitv4/formulaires/entrees.md) {% endcontent-ref %} #### Data retention Permet de choisir la période de conservation des entrées sur le formulaire. C'est une option pratique pour être en accord avec des réglementations telles que le RGPD en Europe ou la nLPD en Suisse, qui évite de conserver les données indéfiniment.