PlatoForms User Guide
Ctrl+K

  • Form Builder

    Creating an Online Form for an Existing PDF

  • Custom Domain

    With Builder you can build three types of forms: online web forms, online PDF forms, and master forms.

  • Master Form Builder

    you will arrive at the Form Builder. On the form Builder, there are three main sections:

What's new? API Docs

Concevoir des formulaires web et PDF web

Sur cette page

Utilisez Aperçu & Design pour personnaliser l’apparence de votre formulaire. Le même concepteur est utilisé pour les formulaires Web, les formulaires PDF Web et les formulaires maîtres. Vous pouvez :

  • Appliquer un thème et le prévisualiser immédiatement.
  • Ajouter un logo et personnaliser les couleurs, les polices, les espacements et la mise en page.
  • Enregistrer votre conception comme un thème d’équipe partagé ou mettre à jour un thème existant.
  • Utiliser du CSS ou JavaScript personnalisé pour des modifications avancées.

Accéder au concepteur de formulaires

  1. Ouvrez votre formulaire PDF web existant depuis le Tableau de bord.

  2. Cliquez sur le bouton Aperçu & Conception dans le créateur de formulaires en haut à gauche.

    Ouvrir le concepteur de formulaires

    Cela ouvre un aperçu où vous pouvez ajuster la conception de votre formulaire.

Appliquer un thème

Les thèmes vous permettent de changer rapidement l’apparence générale de votre formulaire.

  1. Dans Aperçu & Conception, cliquez sur Concevoir le formulaire dans le coin supérieur droit.

    Bouton Concevoir le formulaire dans Aperçu et Conception

  2. Dans le panneau de gauche, cliquez sur Parcourir les thèmes.

    Parcourir les thèmes dans le panneau Concevoir le formulaire

  3. Choisissez un thème. L’aperçu à droite se met à jour immédiatement.

Enregistrer une conception comme thème de formulaire partagé

Enregistrez votre conception actuelle comme un nouveau thème que d’autres membres de votre équipe peuvent utiliser.

  1. Dans Aperçu & Conception, cliquez sur Concevoir le formulaire et personnalisez le formulaire.

  2. En bas du panneau de gauche, cliquez sur Partager.

    Partager la conception actuelle du formulaire comme thème d’équipe

  3. Dans la boîte de dialogue Partager le thème, entrez un Nom de thème, puis cliquez sur Enregistrer.

    Le nouveau thème partagé apparaît dans Parcourir les thèmes.

Mettre à jour ou supprimer un thème partagé

Utilisez les contrôles sur la carte d’un thème partagé pour le mettre à jour ou le supprimer.

  1. Dans Concevoir le formulaire, cliquez sur Parcourir les thèmes.

  2. Trouvez le thème partagé et cliquez sur son icône rouge d’édition.

    Mettre à jour un thème de formulaire partagé existant

  3. Changez le Nom de thème si nécessaire, puis cliquez sur Enregistrer. Cela met à jour le thème partagé avec la conception actuelle du formulaire.

Pour supprimer un thème partagé, cliquez sur l’icône rouge de la corbeille sur sa carte et confirmez la suppression.

Personnaliser la conception du formulaire

Vous pouvez également apporter plus de personnalisations aux styles du formulaire. Toutes les modifications sont prévisualisées instantanément.

  1. Dans Aperçu & Conception, cliquez sur Concevoir le formulaire dans le coin supérieur droit.

  2. Modifiez la conception selon vos besoins.

    Note

    Découvrez les options de personnalisation disponibles dans la section Propriétés de conception de formulaire.

  3. Après avoir effectué vos modifications souhaitées, cliquez sur Enregistrer. Cela enregistre la conception pour le brouillon et l’aperçu ; le formulaire en ligne ne change qu’après avoir cliqué sur Publier dans le constructeur.

Propriétés de conception de formulaire

Propriété Description
Apparence Personnalisez le thème visuel du formulaire :

  • Système Auto : S’adapte aux paramètres de l’appareil de l’utilisateur.
  • Mode Clair Uniquement : Assure un aspect lumineux et clair avec un thème de couleur claire cohérent.
  • Mode Sombre Uniquement : Utilise un schéma de couleurs sombres pour réduire la fatigue oculaire dans les environnements peu éclairés.
Lorsque Système Auto est sélectionné, utilisez les boutons Clair et Sombre pour prévisualiser l’apparence du formulaire dans différents modes.
Logo Téléchargez une image PNG, JPG ou WebP (max 5 Mo) pour afficher un logo sur le formulaire.

  • Logo Intégré : Redimensionne automatiquement et intègre le logo dans le formulaire.
  • Fond de Logo : Personnalisez la couleur de fond derrière le logo.
  • Taille du Logo : Si Logo Intégré est désactivé, ajustez manuellement la taille. Le placement par défaut est à l’extérieur du formulaire, dans le coin supérieur gauche.
  • Emplacement du Logo : Choisissez l’alignement : Gauche, Centre ou Droite.
Barre de Navigation Si votre formulaire comporte plusieurs pages, activer la barre de navigation ajoute un menu supérieur, permettant aux utilisateurs de naviguer entre les pages.

Remarque : Pour ajouter des pages, utilisez Ajouter une page dans le constructeur de formulaires Web, ou insérez un Saut de Page dans un formulaire PDF Web ou un formulaire maître.
Style de la Barre de Navigation Une fois la Barre de Navigation activée, sélectionnez un style qui correspond à la conception de votre formulaire. Les options sont Style 1 à Style 4.
Texte d’Aide Si vous avez ajouté du texte d’aide pour les champs de formulaire, choisissez où il apparaît :

  • Sous le Champ : Place le texte d’aide sous la boîte de saisie.
  • Sous l’Étiquette : Positionne le texte d’aide sous l’étiquette du champ.
Formulaire RTL Affiche le formulaire dans une mise en page de droite à gauche, adaptée aux langues telles que l’arabe, l’hébreu et le persan. Ce paramètre affecte l’alignement du texte et la direction générale du formulaire.
Coin Arrondi Ajoute des coins arrondis aux éléments du formulaire pour une apparence plus douce et moderne.
Style Matériel Utilise un design minimaliste à lignes droites pour les champs de saisie, similaire au Material Design.
Largeur du Formulaire Ajuste la largeur globale du formulaire. Les options incluent :

  • S (Petit) : Mise en page compacte.
  • M (Moyen) : Largeur équilibrée.
  • L (Grand) : Élargit le formulaire pour les écrans plus larges.
  • Plein : Étend le formulaire à toute la largeur du conteneur.
Marge du Formulaire Définit l’espacement autour des bords du formulaire. Les options incluent :

  • Aucune : Pas d’espacement supplémentaire.
  • S (Petit) : Remplissage minimal.
  • M (Moyen) : Espacement modéré pour un aspect plus structuré.
Police Choisissez une police dans la liste, ou collez un code d’importation Google Fonts pour utiliser une police Google.
Taille de la Police Ajustez la taille du texte pour assurer sa lisibilité. Options : XS, S, M, L, ou XL.
Espacement des Lignes Contrôle l’espacement entre les lignes de texte. Options : XS, S, M, L, ou XL pour une lisibilité optimale.
Disposition des Étiquettes Définit l’agencement des étiquettes par rapport aux champs de saisie. Si Personnalisé est sélectionné, retournez au panneau Propriétés de chaque champ pour ajuster les positions individuelles des étiquettes.
Largeur de l’Étiquette Spécifie la largeur des étiquettes de champ pour assurer un alignement cohérent entre les éléments du formulaire.

Plus de Styles Personnalisés

Vous pouvez personnaliser davantage l’apparence et le comportement de votre formulaire en utilisant la fonctionnalité Plus de Styles Personnalisés.

  1. Dans Aperçu & Design, cliquez sur Concevoir le formulaire, puis cliquez sur le bouton Plus de styles personnalisés.

    Formulaire du concepteur

  2. Choisissez parmi trois options de personnalisation :

    • Onglet Conception : Changez les images de fond, ajustez la taille de la bannière, et modifiez les éléments de mise en page.
    • Onglet CSS : Ajoutez du CSS personnalisé pour styliser les polices, les couleurs et les espacements.
    • Onglet JS : Utilisez JavaScript pour personnaliser les étiquettes, ajouter de la logique, et contrôler le comportement du formulaire.
    Note

    JavaScript fonctionne uniquement sur un plan payant (pas l’essai gratuit) avec un domaine de formulaire personnalisé connecté, pour maintenir la sécurité. Sans cela, le script n’est pas servi.

  3. Après avoir effectué les ajustements, cliquez sur Enregistrer. Comme pour les autres paramètres de conception, le formulaire en ligne ne change qu’après avoir cliqué sur Publier.

Bon à savoir :

  • JavaScript personnalisé est limité à 16 Ko.
  • Les styles Classique et Conversationnel d’un formulaire conservent des CSS et JavaScript séparés.
  • Le CSS personnalisé modifie uniquement le formulaire en ligne ; il n’affecte pas le PDF généré.

Tutoriel vidéo

Vous préférez regarder plutôt que lire ? Ce guide vidéo est fait pour vous.

Is the content helpful?
Give feedback about this article