Although a conversion—or key event, in GA4 terms—can be any action a user performs on our website or app, one of the most common is contacting us.
Contact usually happens through one of these four main channels:
- Filling in a form.
- Clicking the phone number and calling us.
- Clicking the email address on our website and sending us a message.
- Writing to us in a chat, especially WhatsApp.
So, continuing the series of articles focused on conversions and after discussing how to configure conversions in Google Ads, we are going to do the same with Google Analytics.
Preliminary considerations
For this article, I am going to assume that on your website you have implemented GA4 through GTM, which is the most common setup.
If that is not the case, before you begin:
- Create a GA4 account.
- Create another one for GTM (Google Tag Manager).
- Implement GA4 through GTM.
Also, for the form conversion, I am going to assume that you display a thank-you message, which is again the most common setup. If you redirect to another page instead, the trigger would be different—and even easier.
If you meet both conditions, let’s get started.
#1. Configure a submitted-form conversion in GA4
As I mentioned, I am going to assume that your website forms return the result after submission on the same URL (without redirecting elsewhere), displaying a message like this:
So, for web form conversions, we will use the appearance of this automatic response message as the trigger.
To view the code, you can use the element inspector:
We can see that the div containing the message has a class called "wpforms-confirmation-container-full". Copy it because we will need it later.
This example uses the WP Forms plugin for WordPress. If you use another CMS or plugin, the code will be different.
Let’s move on to the configuration.
GTM configuration
To send the key event to GA4, we will use a GTM tag.
The first thing we need to do is enable the built-in “Percent Visible” variable. You do that here:
When the tab with all the built-in variables opens, enable this one:
Now we create a new trigger that will fire the conversion tag, configured like this:
In other words:
- Type: visibility.
- Selection method: ID or CSS, depending on your website’s code.
- Element selector: .wpforms-confirmation-container-full (the class we copied at the beginning). Make sure you enter the correct one for your website.
- When to fire: once per page.
- Minimum percent visible: 50%.
- Observe DOM changes: checked.
- Fire on all visibility events.
We save it and create a "GA4 Event" tag:
We add the measurement ID for our GA4 property and give the event a name. It is better to use lowercase letters and underscores. In this case, I named it "formulario_enviado".
As the trigger, we add the one we created a moment ago:
We save it and now it is time to test. To do that, click the GTM Preview button:
Enter the URL where the form is located:
And fill in the form ourselves so that the message used as the trigger appears.
If everything has gone as it should, we will see here that the GA4 event tag we created has fired:
That completes the GTM configuration, and we publish the container.
GA4 configuration
Don’t worry, this part is much easier.
Once we publish, GA4 will start collecting the event, but we still need to mark it as a key event. To do that, go to the Key events section in GA4 Admin and create a new key event.
We give it the same name that we used in the GTM tag:
After saving, it should appear here:
From that moment on, whenever a user completes the form, GA4 will treat it as a key event and display it as such in reports.
#2. Contact by phone
Now we will repeat the process to measure clicks on telephone links on the website.
Before we start, I will say that, if possible, you should have a phone number dedicated to the website or to the entire digital channel. That way, you will know that every call coming through that number is the result of your investment in the online channel.
Whether or not you have a dedicated phone number, the process is the same.
One more thing: to add a link to a phone number on the website, use this HTML code:
<a href=”tel:+34666555444”>666 555 444</a>Replace the bold values with your number.
Configuration in GTM
We create a GA4 Event tag as before. You can call it "llamada_telefono" or whatever you prefer.
Now comes the important part: the trigger.
In this case, it is much simpler than before:
Add it to the tag so that it looks like this:
Test it in Preview as with the previous event, then publish.
Configuration in GA4
Again, add the event as a key event:
#3. Contact by email
We repeat the same process as for the phone-click event, except that it will now fire when someone clicks an email link.
Adding an email link to the website is very similar to adding a phone link. The HTML code is:
<a href="mailto:info@estancolaschapas.com">info@estancolaschapas.com</a>Replace the bold values with your email address.
Configuration in GTM
Copy the phone tag and rename it so that it refers to email.
Copy the email trigger and replace "tel:" with "mailto:":
You will end up with this tag:
Configuration in GA4
Remember to add the event as a key event:
#4. Contact via WhatsApp
Let’s move on to the last type of contact: the world’s most popular messaging app.
It will depend on which plugin you have implemented, but the principle is always the same: for the trigger, specify a click on the send button’s ID or class:
In the image above, you can see that the send-message button has a class called "send" and an ID called "send_message", so we would create a GA4 event tag as usual with a trigger like this:
I entered both the class and the ID because those names are fairly common and I wanted to make sure the tag did not fire when a user clicked another element on the page. Requiring both at once narrows the possibilities dramatically.
We test and publish. Everything is now configured; it is time to look at the results.
Results in GA4
From this point on, we will be able to see the key events in GA4 reports.
The most common place to view them is in the "Traffic acquisition" reports:
Conclusions
You now know how to add every type of website contact as a GA4 key event.
If you use different plugins, form and WhatsApp submissions may work a little differently from what I have shown here, but the underlying approach will be similar and will still help you.
As always, if you enjoyed this, here are more articles on business and digital analytics.
And if you want to receive one in your inbox every week, subscribe here.
Leave a Reply