Comment configurer les colonnes de votre formulaire

Avec un formulaire à plusieurs colonnes, les formulaires longs sont plus faciles à parcourir et à remplir. Le Générateur de formulaires de Jotform permet de créer facilement ce type de mise en page grâce à ses fonctionnalités intégrées.

Watch on youtube

How to insert two or more columns in a form

Réduire un champ

Par défaut, chaque champ ajouté à votre formulaire occupe une ligne complète. Réduire la largeur des champs vous permet en revanche d’afficher au moins deux champs par ligne. Voici comment procéder :

1. Accédez à votre formulaire dans le Générateur de formulaires, puis sélectionnez l’icône d’engrenage à droite de l’élément de formulaire dont vous souhaitez réduire la largeur.
2. Dans le volet Propriétés de l’élément qui s’ouvre à droite, sélectionnez l’onglet Avancé.
3. Activer le bouton Réduire.

Vous pouvez également sélectionner plusieurs éléments de votre formulaire et choisir d’activer l’option Réduire dans le menu contextuel.

Configurer trois colonnes ou plus

Pour afficher les champs de votre formulaire sur trois colonnes ou plus, voici la marche à suivre :

1. Dans le Générateur de formulaires, sélectionnez au moins trois éléments de votre formulaire avec Ctrl+Clic.
2. Faites un clic droit sur l’un des éléments mis en surbrillance.
3. Sélectionnez Réduire dans le menu contextuel.

4. Sélectionnez l’icône du rouleau à peinture dans le coin supérieur droit de l’écran afin d’ouvrir le Concepteur de formulaires.
5. Dans le volet Concepteur de formulaires qui s’ouvre à droite, sélectionnez Concepteur avancé en bas.

6. Dans le volet Outil de conception avancé, ouvrez la rubrique Mise en page du formulaire.
7. Activez l’option Activer les colonnes. Notez que cette option n’est disponible que si votre formulaire contient au moins un élément réduit.
8. Saisissez le nombre de colonnes souhaité dans la section Colonnes juste en-dessous.
9. Vos modifications sont automatiquement enregistrées.

Pour revenir au générateur de formulaires, sélectionnez le bouton Revenir au générateur en haut à droite de l’écran. Voici le résultat :

Déplacer un champ réduit sur une nouvelle ligne

Supposons que vous ayez un formulaire à trois colonnes et que vous n’ayez besoin d’afficher que deux champs sur une ligne spécifique au lieu de trois. Vous pouvez alors utiliser l’option Déplacer sur une nouvelle ligne. Voici comment procéder :

1. Dans le Générateur de formulaires, sélectionnez l’icône d’engrenage de votre élément de formulaire pour ouvrir le volet Propriétés.
2. Dans le volet Propriétés à droite, sélectionnez l’onglet Avancé.
3. Activez l’option Déplacer sur une nouvelle ligne.

Voici quelques points supplémentaires à prendre en compte lors de la configuration des colonnes de votre formulaire :

• Largeur du formulaire : assurez-vous que la largeur de votre formulaire est suffisante pour accueillir le nombre de colonnes souhaité.
• Largeur des champs : si vous devez créer un formulaire à deux colonnes et qu’un champ ne s’adapte pas à la largeur de l’autre champ, essayez d’en réduire la taille. En raison de la nature adaptative du formulaire, un champ trop long occuperait trop d’espace pour que l’autre champ s’affiche correctement à côté.
• Position de l’étiquette du champ : un champ dont l’étiquette est alignée à gauche sera plus large qu’un champ dont l’étiquette est alignée en haut.