Comment tracker un formulaire Typeform ?

Comment tracker un formulaire Typeform ?

Un devis adapté à vos besoins ?

Prendre un RDV

Améliorez vos analyses marketing grâce aux données de conversion Typeform. Utilisez des formulaires Typeform intégrés pour engager votre audience et générer des leads. Vous pouvez facilement suivre les soumissions réussies de formulaires comme des conversions, et les changements d'étapes du formulaire comme des interactions, en utilisant Google Tag Manager (GTM) et ce code de gestionnaire d'événements Typeform.

Commencez par créer une balise personnalisée de type HTML où vous pourrez coller le code de l'event listener ci dessous :

<script>
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

eventer(messageEvent,function(e) {
   var key = e.message ? "message" : "data";
   var data = e[key];

   if(data.type == "form-submit"){
      window.dataLayer = window.dataLayer || [];
      window.dataLayer.push({
         'event': 'typeform_success',
         'form_id': data.formId
      });
   }

   else if (data.type == "form-screen-changed") {
      window.dataLayer = window.dataLayer || [];
      window.dataLayer.push({
         'event': 'typeform_step',
         'form_id': data.formId,
         'step': data.ref
      });
   }

},false);
</script>

Une fois implémenté, ce code génère un événement dans le dataLayer lorsqu’un utilisateur soumet avec succès un formulaire Typeform, avec le nom d’événement typeform_success.

Lorsque l’utilisateur passe ou revient à une autre étape dans un formulaire, un événement nommé typeform_step est déclenché.

Pour permettre le déclenchement de vos balises/pixels marketing, vous devez créer deux déclencheurs d'événements personnalisés en utilisant les noms d'événements de conversion et de changement d'étape :

  • typeform_success -> Pour les soumissions réussies de formulaires.

  • typeform_step -> Pour les changements d’étapes dans le formulaire.

Pour affiner davantage vos conditions de déclenchement ou capturer des détails du formulaire tels que l’ID du formulaire et la référence de l’étape, vous pouvez utiliser les variables suivantes du dataLayer comme paramètres d’événement :

  • form_id -> Retourne l’ID du formulaire Typeform.

  • step -> Retourne la référence de l’étape dans le formulaire.



Questions fréquemment posées sur le sujet

Le suivi des soumissions de formulaires Typeform permet d'analyser les conversions, de comprendre le comportement des utilisateurs et d'optimiser les stratégies marketing en fonction des données collectées.

En insérant un écouteur d'événements JavaScript dans une balise HTML personnalisée de Google Tag Manager, vous pouvez détecter les soumissions de formulaires Typeform et transmettre ces données à des outils d'analyse.

Le code JavaScript suivant écoute les événements 'form-submit' et 'form-screen-changed' de Typeform et pousse des événements 'typeform_success' et 'typeform_step' dans le dataLayer : ```html <script> var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent"; var eventer = window[eventMethod]; var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message"; eventer(messageEvent, function(e) { var key = e.message ? "message" : "data"; var data = e[key]; if (data.type == "form-submit") { window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'event': 'typeform_success', 'form_id': data.formId }); } else if (data.type == "form-screen-changed") { window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'event': 'typeform_step', 'form_id': data.formId, 'step': data.ref }); } }, false); </script> ```

Créez deux déclencheurs d'événements personnalisés nommés 'typeform_success' et 'typeform_step' qui s'activeront lorsque ces événements seront poussés dans le dataLayer, permettant ainsi d'exécuter des balises marketing spécifiques.

En créant des variables de couche de données (DataLayer Variables) dans GTM, vous pouvez extraire des informations spécifiques des champs de formulaire, telles que 'form_id' et 'step', pour une analyse plus détaillée.

Il est essentiel de respecter les réglementations en matière de confidentialité, comme le RGPD, en limitant le suivi aux pages ou utilisateurs pertinents et en informant les utilisateurs de la collecte de leurs données.

Des balises telles que Google Analytics, Facebook Pixel, Mixpanel ou Piwik Pro peuvent être activées lors des événements 'typeform_success' et 'typeform_step' pour un suivi et une analyse approfondis.

Utilisez le mode Aperçu de Google Tag Manager pour vérifier que les événements 'typeform_success' et 'typeform_step' sont correctement capturés et que les balises associées se déclenchent comme prévu.

Le suivi des changements d'étapes permet de comprendre où les utilisateurs peuvent rencontrer des difficultés ou abandonner le formulaire, offrant ainsi des opportunités d'optimisation pour améliorer le taux de conversion.

En configurant correctement votre système de suivi pour qu'il respecte les réglementations telles que le RGPD, en informant les utilisateurs de la collecte de leurs données et en obtenant leur consentement explicite lorsque nécessaire.




Besoin d'optimiser votre tracking ?

Prendre un RDV

Services et prestations

Un bon suivi de site web permet d'identifier les pages et les éléments qui convertissent le mieux les visiteurs en clients ou prospects.

Détail de l'offre

➕ Mise en place de l'architecture server-side
➕ Transfert des tags et pixels existants
➕ Amélioration de la rapidité de chargement
➕ Gestion des cookies et des AdBlockers
➕ Vérifications et tests pour garantir la fiabilité
➕ Formation GTM Server Side
➕ Validation des compétences GTM server-side

Délais

Entre 1 et 5 jours

Pricing

Détail de l'offre

➕ Exploration détaillée de vos données
➕ Paramétrage sur mesure de Google Analytics 4
➕ Intégration fluide avec vos outils actuels
➕ Dimensions personnalisées adaptées à votre business
➕ Formation Google Analytics 4

Délais

Entre 1 et 3 jours

Pricing

Détail de l'offre

➕ Choix de la CMP
➕ Paramétrage de la CMP
➕ Listing et classification des cookies
➕ Implémentation de Google Consent Mode v2
➕ Assurance de la conformité aux réglementations CNIL et RGPD
➕ Formation

Délais

Entre 1 et 3 jours

Pricing

Détail de l'offre

➕ Automatisation des dashboards
➕ Dashboard personnalisés
➕ Mise en forme ergonomique et pratique
➕ Données en temps réel
➕ Compatible tous device
➕ Validation de vos compétences Looker Studio

Délais

Entre 1 et 10 jours

Pricing

Articles qui peuvent t'intéresser