Comment ajouter un champ de formulaire et un élément de formulaire à votre page

Dans cet article, vous apprendrez comment ajouter un champ de formulaire et un élément de formulaire à votre page.

Pour commencer, vous aurez besoin de :

• un compte systeme.io
• une page d'un tunnel en mode édition

Ajouter un champ de formulaire

Dans l'éditeur de page, faites glisser l'élément "Champ de formulaire" depuis la barre latérale de gauche et déposez-le sur votre page.

Cliquez sur le champ qui vient d'être ajouté.

Sélectionnez ensuite une option dans le menu déroulant "Type de données".

Exemple : si vous sélectionnez « Email » comme type de donnée, le contact sera ajouté à votre liste de contacts lorsque le client aura validé le formulaire.

Dans l'éditeur situé à gauche, vous trouverez de nombreux paramètres permettant de personnaliser les champs de votre formulaire, tels que la police de texte, les couleurs, l'alignement, et bien plus encore (faites défiler vers le bas pour découvrir d'autres options).

Ajouter un élément Formulaire

Pour collecter facilement des prospects dans votre tunnel de vente, vous pouvez utiliser l'élément "Formulaire". Au lieu d'ajouter séparément des champs de saisie et des boutons, cet élément fait office de conteneur unique qui regroupe vos champs de saisie, vos cases à cocher et votre bouton de validation. Cela vous permet de créer en toute fiabilité plusieurs formulaires indépendants sur une même page.

Lorsque vous cliquez sur l'élément "Formulaire", vous pouvez le configurer entièrement à l'aide du panneau de menu situé à gauche de l'éditeur :

a. Dans l'onglet "Éléments" :

• Gérer les champs standard : supprimez facilement les champs de saisie standard (tels que « Prénom » ou « Nom de famille ») en passant la souris sur le champ que vous souhaitez supprimer ; une icône représentant une corbeille (1) apparaîtra.

Vous pouvez également modifier les champs standard en cliquant simplement dessus ; vous pouvez modifier le texte par défaut, le rendre facultatif en cochant la case "Facultatif", ajouter une icône et modifier son design.

• Ajouter un nouveau champ : faites défiler vers le bas et cliquez sur le bouton (+) (2) pour ajouter instantanément de nouveaux champs.

Vous pouvez choisir parmi les champs proposés par défaut, tels que le code postal, le nom de l'entreprise, etc. Vous pouvez également ajouter une case à cocher supplémentaire (3).

Ou ajoutez un champ personnalisé (4).

Une fois vos champs ajoutés, vous pouvez les organiser en les faisant glisser et en les déposant dans l'ordre de votre choix.

b. Dans l'onglet "Design" :

• Personnaliser le design : vous pouvez personnaliser la mise en page, l'espacement entre les lignes, la couleur d'arrière-plan, les bordures, l'espacement, la position et bien d'autres paramètres (faites défiler vers le bas pour découvrir d'autres options). Cependant, certains paramètres, tels que la typographie, sont hérités des paramètres de la page pour l'élément "Formulaire".

c. Dans l'onglet "Actions" :

Règles de redirection (après l'envoi) : choisissez ce qui se passe une fois le formulaire envoyé.

• Pas de redirection (5) : vous pouvez choisir de garder les visiteurs sur la même page et d'afficher un message de confirmation simple.

• URL personnalisée (6) : vous pouvez choisir de rediriger les visiteurs vers une autre page.

• L'étape suivante du tunnel (7) : vous pouvez choisir de rediriger les visiteurs vers l'étape suivante du tunnel.

• Double opt-in (8) : Il suffit de cocher la case pour activer la procédure de double opt-in pour vos nouveaux abonnés.

• Automatisations dans l'éditeur (9) : ajoutez des règles d'automatisation directement dans l'éditeur de page. Vous pouvez facilement déclencher des actions spécifiques (comme ajouter un tag, inscrire un utilisateur à une campagne ou envoyer un email) dès qu'un utilisateur valide le formulaire.

Cliquez sur "Sauvegarder" (10) pour enregistrer les modifications.

En dehors de l'éditeur de page, vous pouvez également sélectionner un élément de formulaire spécifique lorsque vous configurez un déclencheur "Inscription sur la page (optin)" dans votre compte :

Les règles d'automatisation :

Les Workflow :