Setting Up Klaviyo Form Tracking with Google Tag Manager

If you’re using Klaviyo forms, you might have already come across articles on the internet that walk you through setting up Google Tag Manager (GTM) tracking for Klaviyo forms in detail. If you have not, you’ll want to check out those articles first and then come back.

Instead of rinsing and repeating the solid foundation these articles provide, let’s focus on a crucial piece of the puzzle that’s entirely overlooked and probably why you’re reading this article: how to get your Klaviyo form titles to show in your Google Analytics 4 (GA4) reporting.

Form Title Tracking Not Working

When setting up Klaviyo form tracking via Google Tag Manager (GTM), you might find that the form title isn’t passing to the website data layer.

So, let’s talk about the form title not working when you test the form submission with Debug/Preview Mode in Google Tag Manager.

This is most likely what you will experience…

✅You put your custom HTML into Google Tag Manager.

<script>
  window.dataLayer = window.dataLayer || [];
  window.addEventListener("klaviyoForms", function(e) { 
    if (e.detail.type == 'submit') {
      dataLayer.push({
        'event' : 'klaviyo',
        'formId' : e.detail.formId,
        'formTitle' : e.detail.metaData.$source
      });
    }
  });

✅ You’re pissed off and frustrated that this is just not working.

✅ You search and search and search to find no documentation on the issue.

✅ You’re more pissed off and frustrated.

Is this resonating with you? Keep reading for the solution.

The Ah-Ha Not-So Secret Simple Solution for Klaviyo Form Title Tracking

The key to unlocking form title tracking lies within the Klaviyo form itself, where you need to set a hidden field within the form submit button, as shown in the 30-second video and explained in the simple seven steps below.

1. Log into your Klaviyo account
2. Navigate to the form you want to track
3. In the form editor, locate the submit button
4. Look for “Submit Hidden Fields”
5. Click “Add Property”
6. Select the Klaviyo property “source”
7. Set the value to the name of your form

This small addition ensures that the form title is included in the metadata pushed to the data layer, which Google Tag Manager can then capture and pass to Google Analytics 4 as an event with the form title name.

The Result of a Hidden Field in Klaviyo Forms

So, now let’s check the results of this simple and not-so-secret Klaviyo form update using hidden fields in the submit button.

✅  You finally got the Form Title data layer to work.

✅ Happy to not have wasted time figuring out how to get for titles in Google Analytics 4

via GIPHY

How We Identified The Klaviyo Form Title Solution

Our very tech-savvy client could not get the Kalviyo form titles to report in Google Analytics 4. After trying everything possible to get the form names to show in reports, they opted to report form titles in Google Looker Studio using Klaviyo regex match expressions to say show this form title when this form ID appears in the report (which we also helped optimize into more straightforward queries, but that’s for another article). Basically, they opted for the complicated way of reporting form titles because no one had this simple solution documented.

Right after we wrapped up our Learn to Optimize Session, we did what we always do: we obsessed and dug deep into articles, Klaviyo documentation, GitHub, YouTube Videos, and any nugget we could find online to debug and reverse engineer the Google Tag Manager setup to pinpoint where the hole was–which turned out to be within the Klaviyo form itself.

The ah-ha moment came when we examined the custom HTML Klaviyo form listener and matched the metaData.$source to the “Additional event details” section in the Klaviyo Developer documentation, which led us to identify the need for the hidden field property in button settings on the form.

<script>
  window.dataLayer = window.dataLayer || [];
  window.addEventListener("klaviyoForms", function(e) { 
    if (e.detail.type == 'submit') {
      dataLayer.push({
        'event' : 'klaviyo',
        'formId' : e.detail.formId,
        'formTitle' : e.detail.metaData.$source
      });
    }
  });

Klaviyo Form Title Tracking Solved

Adding this simple hidden field to your Klaviyo forms can unlock valuable form title data in your GA4 reporting. This small change can significantly enhance your ability to track and analyze form submissions across your website.

If you have technical roadblocks and need a sidekick, grab a consultation with us or book your own Learn to Optimize Session. We’ll apply our 40 years of combined experience in anything marketing, sales, and operations and obsess until the solution.

In our client’s own words: “Look at you over-delivering! I’m going to make that switch right now in Klaviyo! Thank you so much – that is a really hidden spot that I would never have found on my own.”