Landing pages - Partie 4 : Ajouter un formulaire et utiliser des options avancées

💡 Bon à savoir
Les landing pages sont disponibles avec les offres Business et Entreprise.

Dans cet article, nous allons vous expliquer comment ajouter un formulaire à votre landing page et comment utiliser les options avancées disponibles dans l'éditeur de landing page. 

Nous avons créé une série d’articles pour vous aider à créer des landing pages :

Bon à savoir

Le nouvel éditeur de landing page propose certaines options qui peuvent être différentes de l’éditeur de landing page classique. Assurez-vous de consulter le bon onglet en fonction de l’éditeur de landing page que vous utilisez :

mceclip6.png

mceclip5.png

Nouvel éditeur de landing page

Éditeur de landing page classique

Ajouter un élément de formulaire

Les formulaires vous permettent de récupérer des informations spécifiques sur vos contacts et de les ajouter automatiquement à votre liste de contacts dans Brevo.

Pour ajouter un élément Formulaire à votre landing page :

Nouvel éditeur Éditeur classique
Vous pouvez ajouter une nouvelle section à partir de Sections > Filtrer les sections préconçues > Formulaires et choisir une section préconçue qui peut être modifiée pour répondre à vos besoins. Vous pouvez aussi partir de zéro en ajoutant un nouvel élément Formulaire à votre landing page.

Configurer votre formulaire

Une fois que vous avez ajouté un élément de formulaire à votre landing page, vous pouvez choisir comment le configurer :

Alignement

Ce paramètre n’est disponible que dans le nouvel éditeur de landing page.

Le paramètre Alignement est décrit dans la section Paramètres communs de la partie 3 : Modifier les paramètres de tous les éléments de votre landing page.

Gérer les champs

Les paramètres Gérer les champs vous permettent de choisir où stocker les contacts que vous collectez avec le formulaire et les informations que vous souhaitez obtenir de leur part. Vous pouvez également configurer le formulaire lui-même : ajouter des champs et les trier, rendre des champs obligatoires ou non, ajouter un texte d’aide, etc.

Pour accéder aux paramètres Gérer les champs, cliquez sur votre formulaire dans l’éditeur de landing page.

Choisir votre liste de contacts

 
  1. Dans le formulaire, cliquez sur Modifier le formulaire.
  2. Depuis le paramètre Gérer les champs, sélectionnez dans quel dossier et liste les contacts que vous collectez seront stockés dans votre compte Brevo :
    • Sélectionnez un dossier de liste dans la première liste déroulante.
    • Sélectionnez une liste de contacts dans la deuxième liste déroulante.
❗️ Important
Si vous souhaitez mettre à jour les contacts existants de votre liste lorsqu’ils soumettent le formulaire, assurez-vous de cocher l’option Mettre à jour les contacts existants lors de la soumission d'un formulaire dans Commandes d'abonnement au formulaire.

Configurer les champs

Ajoutez et organisez les différents champs de contact avec les informations que vous souhaitez collecter avec votre formulaire. 

  1. Ajouter un champ de contact : ajoutez les attributs du contact préexistants à votre formulaire.
  2. Créer un nouveau champ : si l’attribut du contact n’existe pas encore, vous pouvez en créer un à partir d’ici.
  3. Réorganiser les champs : cliquez sur l’icône = et faites glisser et déposez un champ pour le réorganiser.
    Supprimer un champ : cliquez sur l’icône de la corbeille pour supprimer un champ.

    Cliquez sur un champ pour sélectionner ses paramètres :
  4. Libellé : affichez le libellé au-dessus du champ.
  5. Masqué : choisissez si le champ doit être masqué ou visible dans le formulaire.
    Vous pouvez ajouter un champ de formulaire masqué lorsque vous souhaitez que les données soient remplies automatiquement en passant les données dans l’URL avec les paramètres de requête.
  6. Obligatoire : choisissez si le champ est obligatoire ou non pour soumettre le formulaire.
  7. Selon le champ que vous avez sélectionné, vous aurez différents paramètres :

    • Libellé : changez le nom du libellé qui s’affiche au-dessus du champ.
    • Placeholder : entrez le texte qui s’affiche dans votre champ. Par défaut, il s’agit du même texte que votre libellé.
    • Texte d’aide : entrez le texte qui s’affiche sous votre champ. Cela peut être utile pour des suggestions.
    • Valeur par défaut : entrez la valeur qui sera synchronisée dans votre liste de contacts Brevo si votre visiteur ne renseigne pas le champ.
    • Paramètres URL : entrez la valeur qui sera automatiquement insérée dans le champ du formulaire. Votre contact peut la remplacer si nécessaire. Pour en savoir plus, consultez notre article dédié Préremplir le formulaire d'une landing page avec les attributs des contacts.
❗️ Important
Si vous ajoutez un numéro de téléphone dans votre formulaire, le seul format fonctionnel sera le format international avec un signe + et un indicatif de pays : +447911123456 pour le Royaume-Uni, +12025550101 pour les États-Unis ou +33655678834 pour la France. Utilisez un placeholder pour aider vos utilisateurs à utiliser le bon format.

Options de redirection

Le paramètre Options de redirection vous permet de choisir où vos utilisateurs seront redirigés lorsqu’ils soumettront leurs informations : 

Utilisez Action de redirection de formulaire pour rediriger vos contacts vers une page dans le funnel (une sous-page de votre landing page) ou vers une URL spécifique :

  • Page dans le funnel : sélectionnez la page dans le funnel vers laquelle vous souhaitez rediriger vos contacts.
  • Lien vers une URL : entrez le lien vers la page externe vers laquelle vous souhaitez rediriger vos contacts.

Double opt-in

Le paramètre Double opt-in vous permet de choisir la méthode d'opt-in que vous souhaitez utiliser dans votre formulaire :

  • Opt-in unique
    1. Votre nouveau contact entre son adresse email dans votre formulaire.
    2. Il est ajouté à votre liste de contacts Brevo.
  • Double opt-in :
    1. Votre nouveau contact entre son adresse email dans votre formulaire.
    2. Le contact doit cliquer sur le lien dans l’email de confirmation qu’il reçoit pour être ajouté à votre liste de contacts Brevo.
❗️ Important
Il existe deux façons de créer un abonnement double opt-in. Assurez-vous de n’utiliser qu’une seule des deux méthodes disponibles : activez l'abonnement double opt-in via Marketing Automation OU via un formulaire d’inscription Brevo. Sinon, vos contacts recevront deux fois les emails de double opt-in.

Conception

Le paramètre Conception vous permet de choisir la conception de vos champs : aucun, contour, contour arrondi, souligné avec arrière-plan, souligné sans arrière-plan.

Votre formulaire peut également être affiché sous forme horizontale. Si vous choisissez un formulaire horizontal, nous vous recommandons de supprimer les libellés de vos champs.

Pour changer la couleur d'arrière-plan, rendez-vous dans les paramètres de la colonne comme expliqué dans la partie 3 : Modifier les paramètres de tous les éléments de votre landing page.

Voici quelques exemples des différents modèles de formulaires :

Style_form_gif.gif

Espacement

Le paramètre Espacement est décrit dans la section Paramètres communs de la partie 3 : Modifier les paramètres de tous les éléments de votre landing page.

Commandes d'abonnement au formulaire

Le paramètre Commandes d'abonnement au formulaire vous permet de choisir comment vous souhaitez que votre formulaire fonctionne lors de la soumission :

  • Mettre à jour les contacts existants lors de la soumission d'un formulaire : cette option est utile si vous souhaitez mettre à jour les informations des contacts existants lorsqu’ils soumettent leurs formulaires. 
  • Désactiver reCAPTCHA : désactivez le Google ReCAPTCHA intégré par défaut sur votre landing page publiée.
  • Désactiver les paramètres d'URL lors de la soumission :
    Par défaut, les paramètres d’URL sont affichés lors de l’envoi du formulaire. Des données supplémentaires sur le contact, telles que /thank-you.html/?firstName=Jane, peuvent alors s’afficher dans l’URL. Cette fonctionnalité est utile, car vos contacts n’ont pas à remplir les mêmes informations sur la deuxième page si vous collectez plusieurs ensembles d’informations avec une série de pages de destination dans votre funnel. Toutefois, si vous diffusez des annonces Google et que vous recevez une notification de Google concernant l’affichage des paramètres d’URL lors de l’envoi du formulaire, vous pouvez désactiver cette fonctionnalité et republier votre landing page.

Style

Ce paramètre n’est disponible que dans le nouvel éditeur de landing page.

Le paramètre Style vous permet de définir l’apparence de votre formulaire :

  • Style et couleur de la bordure : ajoutez une bordure à votre formulaire et sélectionnez sa couleur.
  • Largeur de la bordure : définissez la largeur de la bordure de votre formulaire.
  • Arrondi des angles : sélectionnez l'arrondi de la bordure de votre formulaire.

Activer le suivi JavaScript (Facebook Pixel/Google Analytics)

Le paramètre Suivi de votre landing page vous permet d’insérer des scripts de suivi dans certaines parties de la page.

Un script de suivi est un code permettant de suivre le nombre d’utilisateurs qui visitent une page. Les scripts de suivi vous permettent d’analyser combien de temps les visiteurs restent sur la page, ce qui retient leur attention et comment ils interagissent avec le contenu.

💡 Bon à savoir
Google Analytics et Facebook Pixel sont les scripts de suivi les plus couramment utilisés, mais n’importe quel script de suivi peut être ajouté à une landing page Brevo.

Pour ajouter un script de suivi à votre landing page :

  1. Dans l'éditeur de landing page, cliquez sur Paramètres en bas à gauche.
  2. Sélectionnez Suivi.

  3. Écrivez le script de suivi dans le tag approprié. Vous pouvez ajouter un script dans :

    • le tag head<head>,

    • le tag après l’ouverture <body>,

    • ou le tag avant la fermeture </body>.

      💡 Bon à savoir

      Des services tels que Facebook Pixel et Google Analytics nécessitent que le script soit ajouté au tag head, tandis que d’autres services peuvent en avoir besoin dans le corps. Assurez-vous de vérifier les instructions de votre service de suivi pour déterminer où le script doit être ajouté.

  4. Cliquez sur Terminé.

Landing page multipages

Si vous souhaitez ajouter des pages supplémentaires à votre landing page pour créer un funnel, accédez au panneau Pages et cliquez sur + Créer une page vierge. Pour en savoir plus, consultez notre article dédié Gérer les pages de votre landing page.

Rendu en fonction de l’appareil

Les options Bureau et Mobile en haut de votre landing page vous permettent de tester le rendu de votre landing page sur différents appareils.
❗️ Important
Vous pouvez masquer certaines sections ou certains éléments de votre landing page en fonction de l’appareil sur lequel ils sont affichés. Pour en savoir plus, consultez notre section dédiée Visibilité dans la partie 3 : Modifier les paramètres de tous les éléments de votre landing page.

⏩ Et après ?

🤔 Vous avez des questions ?

Pour toute question, n’hésitez pas à contacter notre service client en créant un ticket à partir de votre compte. Si vous n’avez pas encore de compte, vous pouvez nous contacter ici.

Si vous avez besoin d'aide pour un projet impliquant Brevo, nous pouvons vous mettre en relation avec une agence partenaire Brevo.

💬 Cet article vous a-t-il été utile ?

Utilisateurs qui ont trouvé cela utile : 15 sur 37