Navigation

Créer un formulaire d'abonnement hébergé sur Dialog Insight

Un processus d'abonnement est configuré par défaut dans le module Abonnements. Vous devez personnaliser les éléments de ce processus pour les adapter à votre utilisation et vos objectifs. Le processus inclut un point d'entrée (un lien) que vous intégrez à un message ou un intercepteur, le formulaire en tant que tel, une page de confirmation d'abonnement et un courriel de bienvenue (optionnel).   

Chemin d'accès : Acquisitions -> Abonnements

Préalables


Étape 1 : Générer le processus

Commencez par cliquer sur Créer un formulaire. Sélectionnez les options Abonnement et Dialog Insight, puis indiquez la langue du formulaire :


Étape 2 : Éditer le formulaire

Cliquez sur crayon pour éditer le formulaire d'abonnement :

Un modèle de formulaire vous est offert par défaut afin d'accélérer la création. Ce modèle vient avec des champs et des textes par défaut. Vous devez adapter le contenu et le visuel du formulaire pour que cela corresponde à votre objectif. Si vous souhaitez changer les champs du formulaire afin de demander d'autres informations, vous devez le faire dans la page Configuration du formulaire (voir étape 3 pour plus de détails).

☑ Entête et pied de page
Vous pouvez ajouter du contenu dans l'entête et dans le pied de page (votre logo, un texte explicatif, un titre, vos coordonnées). Vous devez d'abord ajouter un bloc Structure dans lequel vous glisserez un bloc Contenu. 

Configurations globales (styles globaux)
Vous pouvez modifier les styles pour l'ensemble des étapes du processus. Toutefois, si des styles sont appliqués à un élément spécifique, ce style prévaudra dans cet élément. 

SectionDescription
ContenuStyles applicables aux textes et aux liens, dont la police de caractères, la taille, la couleur, le poids, etc.
PagesStyles applicables à l'ensemble de la page, dont l'espacement du haut, la couleur et l'image de fond.
Options avancéesCSS et favicon

☑ Styles du formulaire
Dans la section principale du formulaire, modifiez la couleur, les largeurs et les polices des éléments principaux (champs, bouton, textes). 

☑ Ajout de contenu
Le modèle de formulaire vient avec une seule colonne qui englobe des sections prédéfinies pour l'entête, le formulaire et le pied de page. Vous pouvez ajouter une zone en glissant un bloc structure (colonnes) dans lequel vous glisserez un ou des blocs de contenu. Il s'agit du même fonctionnement que l'éditeur de courriel. Les éléments de contenu disponibles peuvent être insérés dans n'importe quelle section du formulaire, à l'exception du formulaire en tant que tel (les champs). Nous verrons comment modifier les champs ou en ajouter à la prochaine étape. 

Liste et description des blocs de contenu 
Texte
ContenuSection pour taper ou coller du texte.

Sachez qu'il est possible d'insérer une image à même le contenu du texte via l'option d'insertion d'image hébergée ou Web.

Si vous avez choisi une zone comportant plusieurs colonnes, il sera indiqué s'il s'agit du contenu de gauche, du centre ou de droite. De plus, la hauteur des colonnes s'ajustera selon le contenu le plus long.
Les styles appliqués à l'aide de l'éditeur ont préséance sur ceux définis dans la section Styles.
StylesSection qui permet de définir les styles applicables à l'ensemble des textes insérés dans la zone de contenu.
ConfigurationsSection qui renferme les paramètres d'espacement autour du texte.
ImageÉlément qui permet d'ajouter une image dans le formulaire ou dans une page. On peut s'en servir notamment dans l'entête pour insérer le logo de l'entreprise ou une image représentative de l'abonnement.
En plus de pouvoir ajouter une image, on peut en définir la largeur, le texte alternatif à afficher lorsque les images ne peuvent pas s'afficher, et au besoin un lien de redirection, soit la page qu'on veut ouvrir en cliquant sur l'image.

Vous pouvez également choisir une nouvelle image, qui n'est pas encore hébergée, en cliquant sur Téléverser une image.
** Les images au format PNG, GIF et JPG sont à privilégier.
Assurez-vous que les dimensions de l'image soient adéquates. Au besoin, vous pourrez modifier votre image avant de l'insérer dans le message (ou le formulaire) en cliquant sur l'icône d'édition .

Si vous avez beaucoup d'images et avez créé des catégories pour les regrouper, sélectionnez dans la liste Catégorie celle dans laquelle vous voulez placer votre nouvelle image, le cas échéant.

SectionDescription
Image (URL)Tapez l'URL de l'image ou encore sélectionnez-en une dans le sélecteur de fichiers en cliquant sur l'icône d'édition .
Pour effectuer des retouches à l'image, soit pour en modifier la taille, la couleur, l'orientation, ou autre, cliquez sur l'icône d'édition  pour ouvrir l'éditeur d'image.
LargeurLargeur maximale de l'image, en pixels.
* Pour assurer un affichage adéquat de l'image dans le formulaire, il est fortement conseillé que l'image choisie ait les mêmes dimensions (largeur et hauteur) que celles que vous souhaitez avoir dans le formulaire. De plus, le fait d'avoir la bonne dimension d'image réduira le temps de chargement du formulaire.
**Comme tout le contenu du formulaire est adaptatif, la dimension de l'image sera ajustée au format de l'écran sur lequel il s'affiche.
Texte alternatifTexte utilisé en remplacement d'une image. Ce texte est affiché lorsque l'image ne peut s'afficher ou encore pour des besoins d'accessibilité pour les personnes touchées par une invalidité ou incapacité.
LienAdresse complète de la page que vous souhaitez afficher lorsque l'on clique sur l'image.
ConfigurationsAlignement et l'espace autour de l'image (padding).
SéparateurÉlément qui ajoute une ligne horizontale, qui sert surtout à séparer des sections.

Propriétés du séparateur
SectionDescription
StylesSection qui permet de définir les styles applicables à la ligne.
ConfigurationsSection qui renferme la largeur et les paramètres d'espacement de la ligne.
BoutonÉlément qui ajoute un bouton d'action, qui dirige le visiteur vers une action ou page définie.
SectionDescription
ContenuSection qui permet de définir le texte à figurer sur le bouton et le lien de l'adresse de redirection.
StylesSection qui permet de définir les styles applicables au texte et à la boîte du bouton.
ConfigurationsSection qui renferme les paramètres d'espacement autour du bouton et sa largeur.
FormulaireÉlément qui affiche les champs de saisie qui permettent de capturer des informations sur les personnes désirant s'abonner. Certains champs sont déjà inclus dans le modèle du formulaire, notamment ceux qui composent la clé unique du projet. Ces champs ne peuvent être modifiés car ils servent à identifier les personnes en tant que contact dans Dialog Insight.
** Il ne peut y avoir qu'un seul élément de saisie par formulaire.
Suivi médias sociauxÉlément qui permet d'ajouter des liens vers vos pages de médias sociaux (icônes et liens respectifs).
Les images représentatives des diverses applications sont déjà fournies et ne peuvent pas être modifiées. Vous pouvez toutefois choisir celles à afficher, ainsi que le texte et le lien.
SectionDescription
ContenuSection qui permet de choisir les applications à afficher, et de définir pour chacune le texte du lien et l'adresse de redirection.
StylesSection qui permet de définir les styles applicables à l'ensemble des textes et des liens.
ConfigurationsSection qui renferme les paramètres d'espacement, d'alignement, et de positionnement entre autres des icônes d'applications.
Important : La demande de consentement doit inclure le nom sous lequel la personne qui sollicite le consentement exerce ses activités commerciales, l’adresse postale et soit le numéro de téléphone, l’adresse de courriel ou l’adresse du site Web ainsi qu’un énoncé qui indique que la personne sollicitée peut retirer son consentement.

Étape 3 : Configurer les champs

☑ Mode mise à jour du contact
Dans la section Configuration du formulaire, sous l'onglet Mise à jour du profil, choisissez le mode de mise à jour des données sur le contact. Comme les informations fournies lors de l'abonnement peuvent différencier de celles déjà contenues dans Dialog Insight lorsque le contact existe déjà dans votre liste de contacts, il est important de préciser comment vous souhaitez que soient traitées ces informations.

☑ Champs par défaut
Dans la section Configuration du formulaire, vous pouvez modifier les champs affichés dans le modèle de base. D'abord, vérifiez si ces champs par défaut vous conviennent, en particulier ceux qui touchent à l'abonnement. Vous pouvez ajouter des champs selon les données que vous voulez collecter sur les personnes qui s'abonnent à vos communications. Vous pouvez retirer les champs dont vous n'avez pas besoin. Notez qu'il n'est pas possible de supprimer les champs composant la clé unique car ces données permettent d'identifier les contacts dans Dialog Insight. Les données entrées dans un champ du formulaire seront ajoutées à un champ de projet. Si vous avez modifié un champ dans un formulaire qui est déjà en ligne, vous devrez mettre à jour le processus d'abonnement pour que les changements soient appliqués.

Les champs d'abonnement sont affichés par défaut avec des cases à cocher. Vous pourriez enlever les cases à cocher et mettre l'abonnement "transparent" en sélectionnant Champ caché :

La personne qui soumet le formulaire sera automatiquement abonnée. Il est donc important de mettre un texte qui explique à quel abonnement on consent lorsqu'on clique sur le bouton de soumission.   

Référence pour les configurations de champ  
ChampDescription
SectionPar défaut, le formulaire comporte une seule section. Si vous avez créé une autre section, vous aurez le choix pour l'emplacement du champ.
ChampNom du champ sélectionné. Il peut s'agir d'un champ du projet ou encore d'un champ spécifique au formulaire.
ÉtiquetteNom du champ tel qu'il doit figurer dans le formulaire. Si plusieurs langues sont offertes, il faudra préciser une étiquette pour chaque langue.
**Attention - Si une étiquette n'est pas fournie pour une langue donnée, c'est l'étiquette dans la langue par défaut qui sera utilisée.
SourceSource de la valeur à saisir dans le champ.
  • Champ du formulaire - La valeur sera saisie par le participant, en remplissant le formulaire d'inscription.
  • Valeur fixe - Pour attribuer la même valeur à tous. Cette valeur ne sera donc pas affichée dans le formulaire d'inscription, mais la valeur sera toutefois inscrite dans le profil du contact.
    Si vous optez pour cette option, vous devez préciser cette valeur dans le champ Valeur fixe.
TypeDisponible uniquement lorsque la valeur du champ provient du formulaire.
Champ permettant de définir le type de valeur qu'il est possible de saisir dans le champ. Toute donnée entrée dans un champ ne correspondant pas au type spécifié pour le champ peut occasionner une erreur. Les types de champs possibles sont :
  • Champ texte - Champ présentant une zone de texte libre pour saisir la valeur.
  • Menu déroulant - Champ présentant un choix de réponses présentées sous forme de liste déroulante et dont les valeurs et les étiquettes sont définies dans la section Choix.
  • Bouton radio - Champ présentant un choix de réponses présentées sous forme de boutons radio et dont les valeurs et les étiquettes sont définies dans la section Choix.
Requis
*Disponible uniquement lorsque la valeur du champ provient du formulaire.
Case à cocher indiquant si le champ est requis ou non lors de l'inscription. Lorsqu'un champ est requis, il présente une icône à cet effet, soit .

Un champ requis ajoute une règle qui interdit l'ajout d'un contact dans la base de données sans donnée valide pour ce champ. Par contre, si une valeur par défaut a été définie pour le champ requis, le contact pourra quand même être ajouté. Par conséquent, si un champ requis n'a pas de valeur par défaut, il sera impossible d'ajouter le contact.

Multi-ligneChamp dont la valeur est présentée sous forme de zone de texte sur plusieurs lignes. Le nombre de caractères pouvant être saisi dépend de la longueur maximale définie, le cas échéant.
Longueur maximumDisponible uniquement lorsque la valeur du champ provient du formulaire.
Longueur du champ en nombre de caractères, lorsqu'il s'agit d'un champ texte.
Valeur par défautDisponible uniquement lorsque la valeur du champ provient du formulaire.
Valeur par défaut à attribuer à un champ REQUIS lorsqu'aucune valeur n'est fournie.
Si une valeur par défaut a été définie pour un champ requis, le contact pourra être ajouté même s'il n'a pas fourni de donnée.

☑ Disposition des étiquettes de champs
Sous l'onglet Options du formulaire, définissez où doivent s'afficher les étiquettes de champ par rapport à la zone de saisie, soit à gauche, au-dessus ou à l'intérieur de la zone de saisie du champ.

☑ Processus d'authentification
Si vous voulez vous assurer que la personne qui remplit le formulaire est bel et bien une véritable personne, et non un robot, il est préférable d'activer l'option reCAPTCHA pour ajouter une question de validation dans le formulaire.

Si le formulaire s'affiche sous un domaine autre que ofsys.com, vous devrez au préalable enregistrer le domaine utilisé sur reCAPTCHA pour pouvoir connaître vos clés publique et privée. Pour enregistrer votre site ou domaine sur reCAPTCHA, allez sur https://www.google.com/recaptcha/admin#list et suivez les directives présentées à l'écran. Une fois l'enregistrement effectué, reCAPTCHA vous donnera une clé publique et une clé privée, que vous devrez préciser dans Dialog Insight :

  1. Sous l'onglet Options du formulaire, cochez l'option Utiliser Google Recaptcha.
  2. Cliquez sur le lien Gérer mes clés.
  3. Choisissez votre domaine, s'il a déjà été configuré. Autrement, cliquez sur Ajouter une clé pour y ajouter le nom de domaine du site ou de la page affichant le formulaire d'inscription et précisez la clé publique et la clé privée assignées par reCAPTCHA lors de l'enregistrement.

Étape 4 : Éditer la page de confirmation

Lorsqu'on soumet le formulaire, on est redirigé sur une page de confirmation. Éditez le texte et le visuel de cette page pour l'adapter à votre identité visuelle et votre cas d'utilisation :    


Étape 5 : Ajouter un courriel de confirmation (optionnel)

Vous pouvez ajouter un message de bienvenue qui est envoyé automatiquement après avoir soumis le formulaire. C'est un outil utile si vous avez des infos additionnelles et pertinentes. Évitez de répéter le contenu de la page de confirmation.


Étape 6 : Publier le formulaire

Avant de publier, vérifiez le rendu visuel en cliquant sur Aperçu en haut à droite de l'éditeur du formulaire. Une fois tous les éléments complets et sans erreur, cliquez sur Publier dans la page d'édition du processus (en haut à droite).


Étape 7 : Intégrer le formulaire

Lorsque tout le processus est configuré et à votre goût, il ne vous reste plus qu'à insérer le lien dans un message (par exemple dans un bouton) ou un intercepteur :

Cette réponse a-t-elle été utile ? Oui Non

Envoyer vos commentaires
Désolés de n'avoir pu vous être utile. Aidez-nous à améliorer cet article en nous faisant part de vos commentaires.