Configure Google Analytics Goal Tracking for a Signup Form

read

Overview

Setting up Google Analytics Goal Tracking for an email sign up form is a two-step process:

  1. Record an event in Google Analytics whenever someone new signs up
  2. Setup a corresponding goal in Google Analytics

Note

Please note that Google Analytics goal tracking takes some time to update, and so goals may not appear in real-time.

Track Signups Submitted Using a New Klaviyo Form

It is possible to track new Klaviyo forms views (opens), submits, and closes in Google Analytics by adding an event listener to the klaviyoForms event and then executing different GA tracking calls for each type of event: open, submit, or close. This code must be pasted in the main theme file of your site: 

  • If you're using Shopify, paste the snippet into your theme.liquid file on a new line above the closing </body> tag.
  • If you're using a BigCommerce Stencil theme, navigate to Storefront > Footer Scripts from your BigCommerce Admin panel and paste the snippet into the Footer code box on a new line.
  • If you're using a BigCommerce Blueprint theme, paste the code into the Footer.html file on a new line at the end of the file.

Below is the generic code for tracking opens, submits, and closes in Google Analytics (Classic):

<script>

window.addEventListener("klaviyoForms", function(e) {
if (e.detail.type == 'open' || e.detail.type == 'embedOpen') {
ga('send', 'event', 'Klaviyo form', 'form_open', e.detail.formId);
}
if (e.detail.type == 'submit') {
ga('send', 'event', 'Klaviyo form', 'form_submit', e.detail.formId);
}
if (e.detail.type == 'close') {
ga('send', 'event', 'Klaviyo form', 'form_close', e.detail.formId);
}
});
</script>

If you use gtag.js to load Google Analytics, use the JavaScript below instead:

<script>

window.addEventListener("klaviyoForms", function(e) {
if (e.detail.type == 'open' || e.detail.type == 'embedOpen') {
gtag('event', 'form_open', 'Klaviyo form', e.detail.formId);
}
if (e.detail.type == 'submit') {
gtag('event', 'form_submit', 'Klaviyo form', e.detail.formId);
}
if (e.detail.type == 'close') {
gtag('event', 'form_close', 'Klaviyo form', e.detail.formId);
}
});
</script>

Track Signups in Google Analytics (Legacy)

First, you need to record an event in Google Analytics whenever someone signs up. You do this using the success callback option when configuring your Klaviyo sign up form.

<script>
    KlaviyoSubscribe.attachToForms('#email_subscribe', {
        ...
        success: function ($form) {
            _gaq.push(['_trackEvent', 'Acquisition', 'Newsletter Sign Up', 'Website']);
        }
        ...
});

$form is a jQuery wrapper around the form that was submitted. This makes it easy to get the email address or form fields if you need them.

Setup Corresponding Goal in Google Analytics

After you have set up tracking for new signup events in Google Analytics, you can configure a corresponding "Goal": 

639170
Was this article helpful?
5 out of 13 found this helpful