Tracker ses soumissions de Form Hubspot sur Google Analytics via Google Tag Manager

Pour aller plus loin dans l'analyse de vos conversions provenant d'HubSpot, il est possible de transmettre des événements directement vers Google Analytics.

En quelques mots, comment ça marche ? Quand un formulaire est soumis, Hubspot déclenche un événement dataLayer que nous pouvons utiliser pour déclencher des balises dans Google Tag Manager. 

En 7 étapes, voici comment tracker vos soumissions de formulaire Hubspot avec Google Tag Manager.

‍

‍

Étape 1 : Custom HTML Tag “Hubspot Form Listener”

Vous devez commencer par créer un tag Custom HTML qui permet de suivre vos soumissions de formulaire Hubspot sur toutes vos pages.

Ci-dessous, le script à coller dans le Custom HTML : 

<script  type = "text/javascript" > 

   window . addEventListener ( "message" ,   function ( event )   { 

     if ( event . data . type  ===  'hsFormCallback'   && event.data.eventName === 'onFormSubmitted') { 

       window.dataLayer.push({ 

         'event': 'hubspot-form-success', 

         'hs-form-guid': event.data.id 

       }); 

     } 

   } ) ; 

 </script> 

Étape 2 : Data Layer Variable “Hubspot Form Guid” 

Ensuite, vous devez créer une nouvelle variable de type Data Layer. Elle permet de lire la propriété “hubspot-form-guid”.

Vous pouvez nommer la variable “hs-form-guid”. 

Étape 3 : Trigger Custom Event “Hubspot Form Submitted”

Vous devez maintenant créer un nouveau trigger de type “Custom Event”.

Vous pouvez nommer cet événement “Hubspot Form Submission”.

Le trigger doit se déclencher sur tous les événements. Sélectionnez “All Custom Event”.

Étape 4 : Tag Google Analytics Event

Vous devez maintenant configurer le tag qui se charge d’envoyer les événements de soumission de formulaire vers Google Analytics. 

Vous pouvez nommer ce tag “GA Event - Hubspot Form Submitted”.

Sélectionnez un tag type “Google Analytics : Universal Analytics” et configurez le comme ceci : 

• Tag type : Event
• Category : Form Submission 
• Action : sucessful-form-submission
• Label : Cliquez sur le + et sélectionnez “Hubspot Form Guid”

Attention, vous devez créer un tag pour chaque vue de Google Analytics où vous souhaitez voir remonter les événements.

Étape 5 : Publication des modifications dans GTM et tests

Une fois les quatre premières étapes terminées, vous pouvez tester et publier les dernières modifications dans votre compte Google Tag Manager.

Vous pouvez également faire une soumission de formulaire test pour vérifier que cela remonte bien dans Google Analytics. Il suffit de vous rendre dans Behavior > Events > Top Events.

Dans Event Category vous devriez voir apparaître “Form Submission”. 

Étape 6 : Configuration de l’objectif dans Google Analytics

Vous devez maintenant configurer un objectif dans Google Analytics en vous basant sur les Catégories et Actions renseignées dans votre Tag Google Analytics Event.

À savoir : 

• Category : Form Submission
• Action : sucessful-form-submission

Pour configurer l’objectif, rendez-vous dans votre compte Google Analytics : Admin > View > Objectifs > Créer un nouvel objectif.

Étape 7 : Configuration des segments dans Google Analytics

Si vous souhaitez distinguer les soumissions de vos différents formulaires (newsletter, demande de démo, téléchargement de contenu, etc…), vous pouvez créer des segments dans votre compte Google Analytics.

Sur votre vue principale, cliquez sur “Add Segment” puis configurez le comme ceci : 

• Condition > Page contains + “url de votre thank you page”. 

De cette manière, vous serez en mesure de suivre le nombre réel de soumissions de formulaire effectuées par type de formulaire.