Comment configurer tawk.to pour le suivi de Google Analytics 4 avec Google Tag Manager

Le suivi Google Analytics vous permet d'en savoir plus sur le comportement de vos visiteurs sur votre site et sur la façon dont ils communiquent avec vous. Vous pouvez configurer le suivi Google Analytics pour votre widget avec Google Tag Manager pour suivre des événements personnalisés, par exemple lorsqu'un chat commence ou se termine.

Avant de commencer, vous aurez besoin des éléments suivants :

1. Un compte et une propriété Google Analytics
2. Un flux de données Google Analytics
3. Une étiquette pour le widget tawk.to dans Google Tag Manager. Si cela n'a pas encore été configuré, suivez les étapes de cet article : Comment ajouter le widget tawk.to avec Google Tag Manager
   

1 - Créez une nouvelle étiquette pour ajouter Google Analytics Configuration Tag . Assurez-vous de renommer l'étiquette (par exemple, GA - config).

2 - Cliquez sur le volet Tag Configuration et un nouveau panneau apparaîtra.

5 - Maintenant, cliquez sur le volet Déclenchement pour choisir un déclencheur.

Ensuite, nous utiliserons GTM pour configurer un événement personnalisé.

Comme alternative, vous pouvez utiliser notre API JS et la fonction gtag chargée avec le global site tag pour GA. Apprenez-en plus dans cet article : Comment configurer tawk.to pour le suivi de Google Analytics

1 - Créez une autre étiquette et sélectionnez maintenant l'événement Google Analytics GA4 comme Tag configuration.

2 - Dans le formulaire, pour configuration tag, sélectionnez l'étiquette de configuration Google Analytics GA4 que nous avons créée précédemment. Pour le nom de l'événement, indiquez l'événement personnalisé que vous souhaitez suivre. (ex. chat_started).

3 - Nous allons créer un déclencheur personnalisé pour l'étiquette. Cliquez sur le bouton + pour ouvrir un nouveau panneau pour la création de déclencheurs.

4 - Dans le panneau, changez le nom du déclencheur à votre convenance (ex. Custom - tawk.to chat started) et cliquez sur Enregistrer. Cliquez sur le volet Configuration du déclencheur et un autre panneau apparaîtra.

5 - Dans le panneau, faites défiler vers le bas et sélectionnez Événement personnalisé comme type de déclencheur.

6 - Dans le formulaire, saisissez le nom de l'événement personnalisé que vous souhaitez suivre et cliquez sur Enregistrer pour créer le déclencheur.

7 - Enfin, cliquez sur le bouton Enregistrer pour terminer la création du tag.

Dans cette section, nous fournirons un exemple pour déclencher l'événement personnalisé chat_started que nous avons créé précédemment en utilisant l'API JS onChatStarted.

Remarque : Avant de créer une nouvelle étiquette, recherchez les étiquettes préexistantes qui utilisent notre API JS. Si vous avez déjà une étiquette en place, vous pouvez ajouter la logique supplémentaire au lieu de créer une autre étiquette.

Par exemple, si vous souhaitez ajouter le suivi à la fonction onChatStarted mais que vous avez déjà une étiquette existante qui utilise la fonction onChatStarted, vous pouvez simplement l'ajouter à la fonction actuelle comme dans l'exemple suivant :

1 - Créez une nouvelle balise et sélectionnez HTML personnalisé comme type de balise.

2 - Dans le champ HTML, entrez le bloc de code suivant. Notez que la valeur de la propriété de l'événement doit être égale au nom de l'événement que vous avez saisi précédemment lors de la création de l'étiquette d'événement personnalisée.

3 - Dans Déclenchement, sélectionnez Toutes les pages pour permettre à l'étiquette de se déclenche sur chaque page sur laquelle Google Tag Manager est installé.

4 - Cliquez sur Enregistrer pour terminer la création de l'étiquette.

1. Dans le tableau de bord de votre gestionnaire des étiquettes, cliquez sur Aperçu. Une nouvelle fenêtre s'ouvrira pour connecter Google Tag Manager à votre site.

2. Saisissez l'URL de votre site Web. L'URL que vous entrez s'ouvrira dans une nouvelle fenêtre.

3. Revenez à l'onglet/la fenêtre où vous avez ouvert la page Aperçu. Vous devriez voir que votre événement Google Analytics : GA4 n'a pas encore été déclenché.

4. Pour déclencher l'étiquette, nous la déclencherons à l'aide de l'événement personnalisé que nous avons créé précédemment (qui, dans cet exemple, est déclenché lorsqu'un chat est lancé).

5. Une fois que nous avons déclenché notre API JS OnChatStarted, cela devrait envoyer un événement à la couche de données qui déclenche maintenant l'étiquette Google Analytics : GA4 Event.

1. Dans votre tableau de bord GA4, accédez à Rapports ➞ Aperçu en temps réel.

2. À partir de là, vous pourrez voir sous le Nombre d'événements par la carte du nom d'événement que Google Analytics a pu recevoir l'événement chat_started.

1. Dans votre tableau de bord GA4, accédez à Configurer ➞ Événements. Les événements qui ont été reçus par Google Analytics y apparaîtront dans les 24 à 48 heures.

2. Pour marquer l'événement chat_started comme une conversion, activez simplement le commutateur sous la colonne Marquer comme conversion pour cet enregistrement.

3. Après l'activation, vous devriez maintenant voir l'événement sous Configurer ➞ Conversions.

[YouTube] Couche de données dans Google Tag Manager || GTM Data Layer Tutorial 2021 avec des exemples