Update time: January 14, 2025
This article introduces how to track forms in Klaviyo Forms.
When the form is successfully submitted, klaviyoForms will be triggered, which can be used to send events, such as:
<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 }); } }); </script>
Now we need to track the form submission in https://www.klaviyo.com/demo-request
Next, let’s see how to implement form tracking:
Step 1 : Custom HTML to inject javascript
In GTM , click「Tags」——「New」——「Choose a tags type to begin setup…」——「Custom HTML」,Name it “HTML—Klaviyo Form listener”, and make the following settings:
In fact, it is the addEventListener method. Read more: GA4 Event Tracking Series ⑦ —— Custom Events (addEventListener Method)
Step 2 : Set Up the Variables
From the code, we can know that there are data layer variables formId and formTitle in the data layer, which need to be obtained using data layer variables in GTM.
In GTM, click「 Variables」——「New」——「Choose a variable type to begin setup…」——「Data Layer Variable」, name it “dlv-formid”, and then set as follows:
Set dlv-formtitle in the same way:
Step 3 : Set Up the Trigger
In GTM , click「Triggers」——「New」——「Choose a trigger type to begin setup…」——「Custom Event」,Name it “Custom Event- Klaviyo Forms Submit Form”, and make the following settings:
From the code, we can know that the event is klaviyo, so the event name is set to klaviyo
Step 4 : Set Up the Tags
In GTM , click「Tags」——「New」——「Choose a tags type to begin setup…」——「Google Analytics: GA4 Event」,Name it “GA4-Event-Klaviyo Forms Submit Form”, and make the following settings:
The event name is submit_form_klaviyo_forms
Step 5 : Preview and Publish
Next is preview debugging.
Tags is triggered and can be published.
Read More:
Step 6 : Custom Definitions
The next step is to register event parameters form_id and form_title , if you want to use it in GA4, you need to register it in the Custom definitions of GA4.
In GA4,click「Admin」——「Custom definitions」——「Create custom dimension」, then do the following configuration:
Set form_title in the same way
Step 7 : Verify Data in Reports
Generally, after 24 hours, we can see the data in GA4, such as: