dataLayer et événements personnalisés

Il est possible d’envoyer des événements personnalisés directement dans Google Analytics 4 sans effectuer de modifications au niveau de Google Tag Manager. Ces événements peuvent inclure jusqu’à 5 paramètres.

Voici comment envoyer un événement nommé perso_submitted :

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({kixelltag_custom_params: null});
window.dataLayer.push({
    event: 'kixelltag_custom_event',
    kixelltag_custom_params: {
        event_name: 'perso_submitted',
    }
});

L’attribut event doit toujours avoir la valeur kixelltag_custom_event. Le nom de l’événement doit être spécifié dans kixelltag_custom_params.event_name.

Déclenchement conditionnel des événements

Avant d’envoyer l’événement, il est parfois nécessaire de s’assurer que les balises Google sont dans le bon état, c’est-à-dire que le Consent Mode a bien été appliqué. Pour respecter ce timing, il convient d’attendre que le consentement soit prêt. Pour cela, utilisez l’API kixelltagOnReady et écoutez l’événement kixelltag_consent_ready.

Cas d’utilisation fréquents

• Soumission d’un formulaire avec redirection vers une page de remerciement (par exemple, la page de contact).
• Soumission d’un devis avec redirection vers une page de confirmation.

Pour implémenter cela, vous pouvez utiliser l’API kixelltagOnReady :

window.kixelltagOnReady = window.kixelltagOnReady || [];
window.kixelltagOnReady.push(function (KixellTag) {
    KixellTag.on('kixelltag_consent_ready', function() {    
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({kixelltag_custom_params: null});
        window.dataLayer.push({
            event: 'kixelltag_custom_event',
            kixelltag_custom_params: {
                event_name: 'perso_submitted',
            }
        });
    });
});

Paramètres d'événements

Vous pouvez ajouter jusqu’à 5 paramètres à un événement. Chaque paramètre doit être défini avec un nom et une valeur. Voici un exemple :

window.dataLayer.push({
    event: 'kixelltag_custom_event',
    kixelltag_custom_params: {
        event_name: 'generate_lead',
        params: {
            key1: 'name1', value1: 'value1',
            key2: 'name2', value2: 'value2',
            key3: 'name3', value3: 'value3',
            key4: 'name4', value4: 'value4',
            key5: 'name5', value5: 'value5',
        },
    }
});

Exemple complet :

Lorsqu’un formulaire de contact est soumis avec succès, le code suivant peut être utilisé :

window.kixelltagOnReady = window.kixelltagOnReady || [];
window.kixelltagOnReady.push(function (KixellTag) {
    KixellTag.on('kixelltag_consent_ready', function() {    
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({kixelltag_custom_params: null});
        window.dataLayer.push({
            event: 'kixelltag_custom_event',
            kixelltag_custom_params: {
                event_name: 'generate_lead',
                params: {
                    key1: 'lead_source', value1: 'Formulaire de contact'
                },
            }
        });
    });
});

Ce code enverra à Google Analytics 4 l’événement generate_lead avec le paramètre lead_source contenant la valeur Formulaire de contact, et ce, sans aucune configuration supplémentaire dans Google Tag Manager.