WhatsApp Chat Event Tracking in Google Analytics 4 and Google Tag Manager

WhatsApp Chat Event Tracking in Google Analytics 4 and Google Tag Manager

Wondering how to properly track WhatsApp chat events in Google Analytics 4? Well, you’ve reached the right place.

Dive in this guide to figure out a suitable way for you to do it. This tutorial comes in two parts:

  1. Basic Guide (recommended for regular use)
  2. Advanced Guide (for further event categorization and alias setup)

Basic Guide

How to track NinjaTeam WhatsApp Event in Google Analytics 4

In this short guide, you will learn how to track click events made through the NinjaTeam WhatsApp Chat WordPress plugin. Here are the required tools you need to prepare:

Step 1: Insert gtag.js to your WordPress site

Please navigate to analytics.google.com > Google Analytics 4 > Admin, under your website property panel, click on Data Streams.

Then click Add stream to create a new data stream with these information:

  • STREAM URL: Paste your website URL
  • STREAM NAME: Give it a suitable name, for example, “Website Name – GA4”
  • MEASUREMENT ID: This ID will be given, and you will need this for future use (e.g. “G-CNMKLDZKZ7”)

In the current data stream, click on Tagging Instructions and you will find the Google Analytics global site tag.

Please copy this script and paste into the Header section of your WordPress site.

You can easily insert this code by using NinjaTeam Header Footer Custom Code (free plugin).

Then please click Save changes to save the new tag.

Step 2: Enable Google Analytics 4 in WhatsApp Chat plugin

From your WordPress dashboard, please visit WhatsApp > Settings > Analytics.

Under Google Analytics options, please enable the option for Google Analytics 4. Then click Save changes.

Step 3: Test the WhatsApp Chat events

Once you finish the two steps above, the tracking is actually working. But if you want to be sure, you can install Google Analytics Debugger to test the events.

So go ahead and add the extension to Chrome.

Once added, please enable it on your current Chrome profile.

While the extension is on, visit one of your website’s pages and click on the WhatsApp chat widget. This creates an event on your website, which would be recorded by Google Analytics tag.

After that, please navigate to GA4 window, choose Configure > DebugView, here you will see a live view that records the current events on your website.

If you’re seeing NinjaTeam WhatsApp event on the timeline, your new configuration is set up correctly and working well.

Advanced Guide

Step 1: Add Google Analytics 4 tags through Google Tag Manager

In this step, you will be creating two GA4 tags that work together:

  • Google Analytics: GA4 Configuration
  • Google Analytics: GA4 Event

To start off, navigate to https://tagmanager.google.com/ and select your Tag Manager Account, or create a new account if you haven’t. Under the Tag Manager Account, add your website as a new Container, which includes these details:

  • Container Name: “yourwebsite.com”
  • Container Type: “Web”
  • Container ID: This ID will be given (e.g. “GTM-PCPS4LD”)

After that, you can enter the Container > Workspace and land on a new dashboard with a left panel including Overview, Tags, Triggers, Variables, etc.

In order to create a new GA4 tag, you can click on Add a new tag, or alternatively, go to the Tags tab, and select New.

GTM Overview dashboard

A new untitled tag will open in a drawer, please click Tag Configuration and:

  • Choose tag type: Google Analytics: GA4 Configuration.
  • Measurement ID: Copy the ID from GA4 Data Streams and paste into this tag configuration.

Then, save your Google Analytics: GA4 Configuration tag.

In the next required tag, before adding Google Analytics: GA4 Event tag, you have to add new variables. So please navigate to Variables and click New.

Choose variable type as Data Layer Variable.

Specify the new variable name by giving it a title as “number” and Data Layer Variable Name as “number”.

Then, please save the new variable, and you can repeat it if you’d like to add more variables.

Now, you create a new tag as Google Analytics: GA4 Event tag. In the tag configuration, specify the Event Name.

For Event Parameters, you can add a new row and enter its Parameter Name and Value, for example, “Phone” with value {{number}}, “Page” with value {{url}}.

 

Step 2: Create Event with Google Tag Manager using dataLayer

From Triggers tab, please add a new trigger.

Choose trigger type as Custom Event.

You can title the trigger as “NinjaTeam WhatsApp Trigger”.

Important: Set Event name as “NinjaTeam WhatsApp” and Event contains “NinjaTeam WhatsApp“.

Event contains NinjaTeam WhatsApp

Once the tag and trigger configuration is done, you will see two tag types showing like this.

GA4 tags configuration preview

Step 3: Send Events to Google Analytics 4

From the Tag Manager Workspace screen, click on Preview to open Google Tag Assistant. This will open a new debug session and when the popup prompted, click Continue.

Then, navigate to your web pages, and you will see the GTM Tag Assistant Connected badge. Now you can run a test by performing a click action on the page. For instance, try clicking on the WhatsApp widget and selecting a support agent to chat.

Google Tag Assistant connected

Then, go to the Tag Assistant screen, if you see the two tags fired under the Output of your GTM, then the event triggers are set up properly.

Additionally, from Google Tag Assistant Summary, you can click on Data Layer to check the values of the Data Layer being sent to Google Analytics 4. Here you can see the Data Layer values such as number, url, event_category, etc.

And in Variables tab, you can see the new number and url Data Layer Variables which you have set up in Step 1. The more variables you set up, the more event labels appear in your Google Analytics reports.

API call dataLayer in GTM

You can repeat the test several times, and check back with GA4 real-time reports to make sure the NinjaTeam WhatsApp events are working well and returning all the desired variables that you have set up.

If you have used “Phone” as the Event name in Event Parameters (Step 1), you should see “Phone” events counted under “NinjaTeam WhatsApp” event in GA4 real-time report.

Event tracking realtime in GA4 (1)

Over to you

I hope this guide has helped you set up Google Analytics 4 event tracking successfully. And don’t forget to share with us how your website is performing with WhatsApp Chat WordPress plugin and GA4 event tracking.

Thuy Nguyen
Thuy Nguyen
yaycommerce.com

An online marketer and professional blogger. When not creating content, she can most often be found at some coffee shops in town, reading Graphic Guides, or enjoying a good laugh with The Big Bang Theory.

Related Posts