Éléments: formulaires.

C'est l'élément clef de la conversion. L'objectif est que le visiteur donne ses données.

Revisa siempre que el formulario sea fácil de entender y presente las instrucciones de forma clara y concisa.

Ajouter un formulaire à votre landing

1. Entraînez l'icone de l'élément formulaire dans votre aire de travail.

2. Une fenêtre s'ouvrira avec les options de l'élément formulaire.

Vous pourrez ici ajouter les champs du formulaire sous ses divers formats: input, textarea, check, radiobuttons, select et éléments hidden. Si vous souhaitez au contraire éditer en premier lieu les styles, vous pouvez fermer cette fenêtre et éditer les sytle à partir du bouton "Éditer".

Ci-dessous nous vous expliquons comment et à quoi sert chacun de ces éléments du formulaire.

Tous les champs du formulaire ont 3 paramètres

- Cache l'étiquette/tag: l'étiquette du champ en question ne sera pas montrée

- Champ obligatoire: s'il est activé, le champ devra être rempli pour pouvoir envoyer le formulaire.

- Message d'erreur: avertissement au cas où un champ soit obligatoire n'a pas été renseigné.

Ajouter des champs de texte dans le formulaire (input)

1. Cliquez sur l'icone Champ de texte (input)

Les options de l'élément champ de texte/ input apparaîtront.

Vous verrez apparaître à gauche une série d'options "Configuration de l'élément".

Le champ de texte ou input d'un formulaire a ses propres propriétés.

• Étiquette (label):  le titre ou légende de chacun des champs.
• Champ obligatoire: Un utilisateur ne pourra pas envoyer le formulaire s'il laisse le champ obligatoire vide.

- Dans le champ Étiquette vous pourrez ajouter le nom que vous souhaitez donner au champ de votre formulaire, par exemple Nom.

Si vous souhaitez que le champ soit obligatoire, cochez la case Champ obligatoire. Vous verrez automatiquement apparaître un astérisque à côté de l'étiquette.

Avec les sélecteurs  de flèches vous pourrez bouger vers le haut et vers le bas le champ le placer où vous le souhaitez dans le formulaire.

Si vous devez effacer un champ, cliquez sur l'icone Effacer .

-Si vous voulez qu'un/des mot/s apparaisse/nt dans le champ input, ajoutez le texte que vous souhaitez dans l'option "Texte par défaut", de la même façon que les labels mais dans le propre cadre du texte.

- Si de dans le query-string de la landing vous souhaitez indiquer un paramètre avec une valeur qui prenne un champ input, indiquez le nom de ce paramètres dans "Variable".

Ajouter des champs de texte multilignes dans le formulaire (textarea)

Un textarea est comme une case de texte simple type "text", mais dans laquelle nous offrons à l'utilisateur plus d'espace pour qu'il écrive un texte long. Utiles pour que l'utilisateur laisse de commentaires, suggestions, etc.

Donnez une hauteur à votre textarea en lui donnant la valeur que vous voulez:

Les listes d'option (check et radio)

Les listes d'options sont de grande utilité pour les formulaires dans lesquels nous souhaitons donner à l'utilisateur entre différentes options. 

Nous avons deux options:

• Check
• Radio

Les checkboxes permettent de choisir une ou plusieurs options dans une liste, alors que les radiobuttons permettent de ne choisir qu'une seule option entre plusieurs.

Check

Les listes de case type check permettent à l'utilisateur de sélectionner une ou plusieurs options

Les checkboxes ou "cases de vérification" permettent à l'utilisateur sélectionner et désélectionner les options individuellement. Bien que parfois plusieurs checkboxes sont montrées ensemble, chacune est complètement indépendante du reste. C'est pour cela elles sont utilisées lorsque l'utilisateur peut activer et désactiver plusieurs options qui ont une relation mais ne sont pas excluantes. 

Pour ajouter les options que vous souhaitez, écrivez le nom dans l'option Éléments du groupe.

Radio

Les contrôles du type radiobutton sont similaires au contrôles de type checkbox, mais permettent uniquement choisir une option entre les différentes qui sont présentées.

Chaque fois que vous sélectionnez une option, automatiquement sera désélectionnée celle qui était choisie auparavant.

Ajouter une liste déroulante

Ajoutez dans les éléments du groupe chacune des options dont vous avez besoin.

"Première valeur non valide" signifie que cette valeur est uniquement informative pour l'utilisateur, dans ce cas nous devrions ajouter un texte explicatif du style "Sélectionnez une option".

Añade en los elementos del grupo cada una de las opciones que necesites.Se pueden añadir todos los que se quieran utilizando el boton 

Ajoutez dans les éléments du groupe chacune des options dont vous avez besoin. Vous pouvez ajouter autant que vous voulez en utilisant le bouton 

La valeur de chaque élément est assignée avec le bouton 

Le nom de l'élément est celui qui apparaît dans la liste de sélection, alors que la valeur est la donnée qui sera enregistrée dans la base de données ou liste où elle est synchronisée.

Ajouter des champs masqués

Les champs masqués sont utilisés pour ajouter de l'information masquée dans le formulaire. Ce type de contrôle n'affice rien dans le formulaire, l'utilisateur ne le verra pas mais l'information nous parviendra.

Ceci s'avère utile lorsque, à partir du serveur, est générée une page dynamique par PHP et est enregistrée dans ce champ masquée une valeur qui sera recueillie au moment de charger le formulaire au serveur.

Ce champ a les propriétés

- Valeur: qui sera la valeur par défaut.

- Variable: Si dans le query-string de la landing vous souhaitez indiquer un paramètre avec une valeur qui prenne un champ masqué, indiquez le nom de ce paramètre dans "Variable".

Ajouter un champ pour l'acceptation des conditions (confidentialité)

Le champ de confidentialité est utilisé pour se conformer à la nouvelle loi GDPR (mai 2018) afin qu'un contact qui s'abonne accepte les termes et conditions, la confidentialité, et indique laquelle des communications que vous souhaitez recevoir.

L'étiquette indique le titre de cet élément et l'information est le texte explicatif de l'entreprise.

En utilisant le bouton "Télécharger le fichier HTML", vous pouvez télécharger un fichier avec les conditions et / ou la politique de confidentialité. Lors du téléchargement, MDirector affiche un message avec une fenêtre contextuelle dans laquelle vous pouvez copier et coller l'intégralité du lien.

en cliquant sur cette fenêtre le lien est copié de cette façon

[terms.html](/resources/249/terms_50760_terms.html)

où le texte qui apparaît entre crochets est le texte qui est affiché, et l'URL qui apparaît entre parenthèses est le lien cliquable. Avec ce format, vous pouvez l'utiliser n'importe où dans le formulaire pour lier, par exemple dans l'information ou dans l'une des options sélectionnables. Vous pouvez également créer un lien vers un lien externe, par exemple:

[Politique de confidentialité](https://www.mdirector.com/politique-de-confidentialite/)

Apparaissent ensuite les éléments de type case à cocher que le contact devra accepter dans chaque cas:

Dans chaque élément, le premier texte est celui qui sera affiché dans le formulaire, et les 3 boutons suivants seront utilisés:

</> pour ajouter la valeur qui est sauvegardée dans la base de données, par défaut la même chose que le texte affiché et pour indiquer si c'est une case qui doit être marquée pour compléter l'enregistrement.

(+) pour ajouter une autre valeur dans la liste des options

corbeille: pour supprimer cet élément de la liste d'options.

Ajouter des champs prédéfinis

Les champs prédéfinis servent à définir au préalable des valeurs par défaut. Il peut s'agir de champs déjà remplis comme par exemple les "Conditions générales", ou bien des champs dans lesquels vous proposez une série de variables prédéfinies comme les jours, mois et années, ce qui vous évitera de commettre des erreurs de format.

Pour rediriger à la page des conditions générales du service, vous devrez tout simplement saisir le texte que vous souhaitez afficher, avec le texte lié entre crochets, et l'URL vers laquelle vous redirigez entre parenthèses. Par exemple:

J'accepte les [conditions générales] (http://www.mdirector.fr/conditions-generales/)

Bouton d'envoi du formulaire

La plupart des formulaires disposent d'un bouton pour envoyer au serveur les données introduites par l'utilisateur.

Pour chaque formulaire, un bouton le complétera, que vous pourrez éditer pour lui donner le style que vous voudrez.

Éditer bouton

Accédez à al configuration du formulaire 

 

Dans la rubrique "Bouton" se trouvent les caractéristiques personnalisables. L'"Alignement" indique la position du bouton par rapport au formulaire. Si vous choisissez "Libre", le bouton pourra se placer dans n'importe quelle partie de la Landing Page