Google Forms - Limitations et Solutions

Ce qu'on va faire sur cette page

Google Forms est probablement le formulaire le plus difficile a tracker via GTM. L'iframe est sur le domaine google.com et ne supporte pas les postMessage. On va voir les workarounds.

  1. Comprendre pourquoi le tracking direct est impossible
  2. Decouvrir les solutions alternatives
  3. Choisir la methode adaptee a votre cas

Google Form embed (iframe)

Google Form

Remplacer par l'iframe Google Forms :
<iframe src="https://docs.google.com/forms/d/e/FORM_ID/viewform">

Pourquoi c'est complique ?

Google Forms est heberge sur docs.google.com. A cause de la Same-Origin Policy, on ne peut pas :
- Ecouter les events de l'iframe (pas de postMessage)
- Acceder au DOM de l'iframe
- Detecter la soumission du formulaire

Google Forms n'a pas de callback, pas de webhook, pas de redirect configurable.

Solution 1 : Observer le redimensionnement (approximatif) 
// Solution 1 : Tracker le redimensionnement de l'iframe
// Quand le form est soumis, Google affiche un message de confirmation
// qui change la taille de l'iframe.

<script>
  // Observer le changement de taille de l'iframe
  var gformIframe = document.querySelector("iframe[src*='google.com/forms']");
  if (gformIframe) {
    var observer = new MutationObserver(function(mutations) {
      mutations.forEach(function(mutation) {
        if (mutation.attributeName === "height") {
          // La hauteur a change = probablement une soumission
          window.dataLayer.push({
            event: "google_form_submitted_probable",
            form_source: "google_forms"
          });
        }
      });
    });
    observer.observe(gformIframe, { attributes: true });
  }
</script>

// ATTENTION : cette methode n'est pas 100% fiable.
// Le redimensionnement peut aussi venir d'un scroll dans le form.
Solutions alternatives 
// Solution 2 : Remplacer Google Forms par un autre outil
// Si le tracking est important, utiliser :
// - Tally (gratuit, tres similaire a Google Forms, supporte les events)
// - Typeform (callback onSubmit natif)
// - Gravity Forms (natif WordPress)
// - Meme un simple formulaire HTML natif

// Solution 3 : Pre-remplir et rediriger
// Creer un formulaire HTML SUR VOTRE SITE qui collecte les donnees,
// pousse le dataLayer event, puis redirige vers le Google Form
// pre-rempli avec les donnees.
// URL : https://docs.google.com/forms/d/e/FORM_ID/viewform?usp=pp_url&entry.XXX=valeur

// Solution 4 : Google Forms + Apps Script
// Ajouter un Apps Script au Google Form qui appelle votre endpoint
// quand une reponse est soumise (server-side).

Notre recommandation

Si le tracking de formulaire est important pour ton business, ne pas utiliser Google Forms. Tally est une alternative gratuite quasiment identique avec un bien meilleur support du tracking. Sinon, un formulaire HTML natif + GTM Form Submission est la solution la plus fiable.