Créer un formulaire d'inscription

Ce guide vous explique les fonctionnalités de nos nouveaux formulaires (sortis en Novembre 2018). Si vous créez ou éditez un formulaire sur l'ancienne version, nous vous invitons à consulter ce guide. Pour plus d'informations sur la nouvelle version, cliquez ici.

 

Vue d’ensemble

Ce tutoriel vous aide à créer votre formulaire d'inscription en seulement quelques clics. Vous pouvez personnaliser l'apparence, le contenu et le comportement du formulaire, ainsi que les différents champs.

Les raccourcis suivants vous permettent d'accéder à une étape spécifique :

  1. Créer un formulaire
  2. Personnaliser l'apparence du formulaire
  3. Sélectionner une ou des liste(s) de contacts
  4. Personnaliser les paramètres du formulaire
  5. Personnaliser les messages du formulaire
  6. Partager votre formulaire

1. Créer un formulaire d'inscription

Dans le menu du haut, cliquez sur "Contacts".

Cliquez ensuite sur "Formulaires".

Create-Form-FR-02.png

Pour commencer, cliquez sur le bouton Créer un formulaire d'inscription.

Create-Form-FR-03.png

Donnez un nom à votre formulaire afin de pouvoir le gérer et le repérer facilement sur votre compte.

Create-Form-FR-04.png

2. Modifier le formulaire d'inscription

De nombreuses options de personnalisation s'offrent à vous. Vous pouvez en effet modifier :

  • L'arrière-plan
  • Les polices, tailles et couleurs du texte
  • Les champs du formulaire (ajoutez autant de champs que vous le souhaitez)
  • Le texte d'instruction (qui indique aux utilisateurs la procédure à suivre pour s'inscrire)
  • Le message de confirmation (qui indique à l'utilisateur que son inscription est validée)

Nouveaux types de champs de formulaire 

Ajoutez des champs de formulaire pour recueillir des informations sur vos inscrits et alimenter les attributs de contacts existants (tels qu'un texte, un nombre, une date, une catégorie ou des valeurs booléennes).

Ajoutez une confirmation opt-in à votre formulaire afin d'enregistrer le consentement de vos inscrits à recevoir vos newsletters et e-mails promotionnels.

Vous pouvez aussi ajouter un champ d'inscription multi-liste afin d'autoriser vos contacts à déclarer leurs domaines d'intérêt et leurs préférences lors de l'inscription, et de les placer dans les listes correspondantes.

Chaque nouveau champ de formulaire correspond à un attribut de contact ou à une liste de contacts :

  • Texte (attribut de contact)
  • Nombre (attribut de contact)
  • Date (attribut de contact)
  • Inscription multi-liste (liste de contacts)
  • Double opt-in (attribut de contact)

Create-Form-FR-05.png

Captcha 

Pour vous protéger des spams, nous intégrons systématiquement un Captcha à vos formulaires. Pour configurer le Captcha associé à votre site Web, rendez-vous sur ce site.

Une fois la configuration terminée, entrez la clé du site dans le champ correspondant de votre formulaire SendinBlue.

Vous pouvez également opter pour un Captcha invisible. Il vous suffit pour cela d'activer la case à cocher Captcha invisible dans le menu de gauche de l'éditeur du formulaire.

Create-Form-FR-06.png

Personnaliser le formulaire

Vous pouvez, par un glisser-déposer, ajouter à votre formulaire divers blocs d'éléments tels qu'un titre, un texte, une image ou un séparateur, de la même manière que pour les champs du formulaire. Pour personnaliser encore davantage l'apparence de votre formulaire, cliquez sur l'onglet Apparence du formulaire dans le panneau de gauche de l'éditeur.

Create-Form-FR-07.png

Vous pouvez personnaliser :

  • La couleur ou l'image d'arrière-plan
  • Le style, le format, la couleur et la taille du texte, ainsi que l'alignement d'un titre, d'un texte, d'un label et d'un texte d'aide
  • L'arrière-plan, l'agencement, la largeur, l'alignement, les bordures, l'opacité et les angles d'un conteneur
  • Le style de police, la taille, le format et la couleur du texte d'un bouton, ainsi que la couleur, l'alignement et les angles d'un bouton
  • Le style de police, le format, la couleur, la taille et l'alignement du texte d'un message de confirmation/d'erreur, ainsi que la couleur d'arrière-plan, la couleur des bordures et les angles du message

Aperçu de la version mobile

Par défaut, tous les formulaires s'adaptent automatiquement au format utilisé. Pour obtenir un aperçu de votre formulaire sur un appareil mobile, faites basculer la vue d'ordinateur à appareil mobile en haut de l'éditeur du formulaire.

Create-Form-FR-08.png

3. Sélection de liste

Lorsque vous avez terminé de modifier l'apparence de votre formulaire, sélectionnez la (ou les) liste(s) où seront stockés vos nouveaux contacts après validation du formulaire. Vous pouvez rechercher une liste en entrant son nom ou le nom du dossier contenant la liste.

Create-Form-FR-09.png

Vous pouvez aussi créer directement une nouvelle liste.

Create-Form-FR-10.png

4. Paramètres du formulaire

Cette section vous permet d'envoyer (ou non) un message de confirmation à vos contacts et, le cas échéant, de choisir le type de confirmation.

Create-Form-FR-11.png

4.1 Aucune confirmation Choisissez cette option si vous ne souhaitez pas envoyer d'e-mail de confirmation d'inscription.

Après avoir cliqué sur le bouton d'inscription du formulaire, vos contacts seront automatiquement redirigés vers l'URL que vous avez saisie, telle que http://www.mon-site-web.com, ou vers une page de confirmation. Si vous ne sélectionnez pas d'URL ni de page de confirmation, un message de confirmation d'inscription s'affichera en haut du formulaire sans changer de page. Pour mettre en place une URL de redirection ou une page de confirmation, activez la case à cocher Page de confirmation.

Create-Form-FR-12.png

4.2  Confirmation simple Choisissez cette option si vous souhaitez envoyer un e-mail à vos nouveaux inscrits leur confirmant qu'ils recevront désormais vos e-mails. Sélectionnez ensuite le template SMTP de votre choix, qui sera utilisé par le système pour envoyer la confirmation. Le template par défaut est nommé « Default Template – Single Confirmation ». Vous pouvez le personnaliser ou créer un autre template de confirmation.

Bon à savoir : pour créer un nouveau template SMTP, accédez à l'onglet Transactionnel et cliquez sur Templates, puis sur le bouton Nouveau template. Si vous créez un nouveau template SMTP, assurez-vous de l'activer afin qu'il apparaisse parmi les options lors de la création d'un formulaire à confirmation simple.

Cette option vous permet également de choisir une URL de redirection ou une page de confirmation.

4.3  Confirmation double opt-in Dans le cadre de l'inscription double opt-in, l'utilisateur doit compléter deux étapes afin d'être ajouté à votre liste d'e-mails :

  1. Il doit d'abord saisir son adresse e-mail sur votre formulaire d'inscription.
  2. Après avoir validé le formulaire, il doit cliquer sur le lien qui figure dans l'e-mail de confirmation.

La fonctionnalité de confirmation double opt-in permet aux contacts de confirmer qu'ils souhaitent recevoir vos e-mails. Elle permet d'éliminer les inscriptions accidentelles et les éventuelles contrariétés. Cette option est recommandée pour se conformer au RGPD. Avantages de la confirmation double opt-in :

  • Pour vos contacts :
    • Elle leur permet de confirmer qu'ils ne se sont pas inscrits par erreur.
  • Pour vous :
    • Vous avez l'assurance que vos contacts manifestent un véritable intérêt pour vos e-mails.
    • Puisque les contacts confirment leur adresse e-mail à deux reprises, vous réduisez considérablement le nombre de hard bounces (adresses e-mail non valides) dans le cadre de vos campagnes.
    • Vous bénéficiez d'une protection contre les concurrents malveillants qui pourraient fournir une fausse adresse e-mail afin de ternir votre réputation.
    • Vous respectez les lois et règlements de plusieurs pays : le double opt-in est obligatoire dans certains pays, y compris au sein de l'Union européenne.

L'e-mail de confirmation doit correspondre à l'un de vos templates SMTP et inclure le format double opt-in (voir ci-dessous pour plus d'informations). Vous pouvez utiliser :

  • Le template par défaut que nous proposons, appelé « Default template - Double opt-in confirmation »
  • Ou un nouveau template que vous avez créé.

Create-Form-FR-13.png

a. E-mail d'opt-in Vous avez également la possibilité de créer ou de sélectionner votre propre template pour l'e-mail d'opt-in. Pour ce faire, accédez aux templates SMTP et cliquez sur Créer un template.

  • Dans la première étape, Paramètrage, affichez les options avancées et ajoutez un nouveau Tag avec le texte suivant:
optin

Create-Form-FR-19.png

  • Créez votre template en utilisant l'un des différents éditeurs de newsletter.
  • Ensuite, modifiez le template selon vos préférences, puis saisissez exactement le texte suivant en tant que lien de double opt-in :
{{ doubleoptin }}
  • Enfin, enregistrez et activez le template avant de retourner à votre formulaire d'inscription.

Create-Form-FR-14.png

b. Page de confirmation (optionnel) Utilisez cet outil si vous souhaitez que vos contacts soient redirigés vers une page spécifique (telles qu'une page de confirmation ou la page d'accueil de votre site Web) après inscription.

c. Dernier e-mail de confirmation (optionnel) Utilisez cet outil si vous souhaitez que vos contacts reçoivent un dernier e-mail de confirmation après avoir complété la procédure de double opt-in. Tout comme pour les autres e-mails de confirmation, le template par défaut se nomme simplement « Default template - Final Confirmation ».  Vous pouvez le trouver et le modifier dans vos templates SMTP.

Bon à savoir : SendinBlue crée automatiquement une liste de « double opt-in temporaire » afin d'enregistrer les coordonnées des contacts qui n'ont pas encore complété la seconde étape de la procédure de double opt-in (qui consiste à confirmer leur adresse e-mail).

Votre base de données de contacts SendinBlue sera également actualisée pour intégrer un nouvel attribut (une nouvelle colonne) nommé « Double_opt-in ». Les contacts ajoutés par double opt-in se verront attribuer la valeur « Oui » dans cette colonne. Si le contact s'est inscrit par un autre type de formulaire, la valeur du champ sera « Non ». Si vous n'avez pas utilisé de formulaire d'inscription de SendinBlue pour ajouter vos contacts à votre base de données, ce champ restera vierge.

Create-Form-FR-15.png

4.4  Paramètres avancés (optionnel)

a. E-mails temporaires Activez cette case à cocher sous Paramètres avancés pour refuser les adresses e-mail temporaires créées à l'aide d'un service d'adresse e-mail jetable tel qu'Ypomail, MyTrashMail, etc. Ces adresses ne seront pas ajoutées à votre base de données de contacts après validation du formulaire.

b. Comportement du formulaire complété Cette option permet de masquer le formulaire une fois que l'utilisateur l'a validé. Si vous n'activez pas cette case à cocher, le formulaire affichera encore les différents champs à saisir, même après que le visiteur l'a complété et validé.

Create-Form-FR-16.png

5.  Messages du formulaire

Ici, vous pouvez personnaliser/éditer les messages de confirmation et d'erreur par défaut qui s'afficheront sur votre formulaire.

Create-Form-FR-17.png

6.  Partager votre formulaire

Après avoir enregistré votre formulaire, vous pouvez le partager et obtenir un code pour intégrer le formulaire à votre site Web ou un lien pour effectuer un partage rapide. Il existe trois types de code :

    • Iframe : facile à mettre en place, ce code vous permet d'intégrer le formulaire à une pop-up ou une page de votre site Web.
    • HTML : ce code vous offre bien plus de possibilités de personnalisation, telles que des animations de type Ajax pour les messages.
    • HTML simple : cette version simplifiée du code HTML du formulaire ne nécessite pas de requête JavaScript.

Bon à savoir : ce code de formulaire ne peut pas inclure de Captcha nécessitant une requête JavaScript.

Create-Form-FR-18.png

Enfin, collez le code sur votre site Web afin d'y afficher le formulaire.