It is important to know how people are interacting with your website..no matter what type of website you have. It can be a normal static website or a big e-Commerce website. Google analytics can provide lots of very important insights that you are looking for your website such as audiences, acquisition, behavior, etc., but it has some limitations when it comes to some specific or alone insights.
But these limitations can be surpassed easily by using Google Tag Manager in conjunction with Google Analytics. With this combination, you’ll be able to collect much more data than ever. Thus, we have come up with this write-up to guide you step-by-step on how to track your Shopify website conversion tracking through Google Tag Manager.
Google Tag Manager
Google Tag Manager is a tool which has been designed with a user-friendly and web-based interface that delivers simple, reliable, easily integrated tag management solutions and simplifies the process of working with tags. It allows you to manage all your website tags without editing code.
How to install Google Tag Manager to your Shopify Website
First of all you need to create a GTM account to install to your website. It will provide you two codes that would be needed to paste in your website’s <head> and <body> section with the provided instructions. If you have already been created it, follows the following steps to install it in your website.
- Login to your website admin interface
- Go to “Online Store” options from left panel and select “Preferences”
- Choose “Add custom JavaScript” options under the “Google Analytics” section.
- Copy the first provided GTM code
- And paste it in the “Add custom JavaScript” section, and be sure to exclude the script tags (Shopify will enclose the content you enter in script tags by default)
Or you can add this GTM code directly in <head> section of your website’s theme. For this,
- In the admin interface, Go to “Online Store” under Sales Channels from the left panel.
- Then Go to Themes >> Actions >> Edit code
- Select “theme.liquid” under Layout and add your GTM code tag just before the closing tag.
- Same as add your second GTMtag code just after the openingtag.
- And Save your changes
Now Google Tag manager has successfully installed in your site, and you are able to start tracking for your site.
Shopify website tracking through GTM
Here, you will introduce with some basics but most important website tracking points.
1. Phone call clicks tracking
2. Email click tracking
3. Contact form tracking
But, before we get down the business, here is what you will need to successfully tracking your website through Google Tag Manager.
- Google Tag Manager account
- Google Analytics account
- Google Analytics settings variable
- Enable already build in variables
- A website with details of tracking event
If you have not setup the GTM and GA account for your website tracking, firstly setup and install these within your website. After that, create a new variable for Google Analytics setting with GTM.
Google Analytics settings variable
How to create Google Analytics settings variable to track events data in GA. Steps are below to make connection between Google Analytics and Google tag manager account.
- Go to your GTM account dashboard
- And Click Variables from the left panel
- Then click New, under the User-Defined Variables heading
- Click Variable Configuration and choose a variable type Google Analytics Settings.
- In the Tracking ID field enter your Google Analytics ID.
- “Cookie Domain” set to auto.
- Leave it the More Settings
- Save the tag.
Enable Already Build-In Variables
As per your website and the solution implemented, enable the already build in variables from Built-In Variables. You might not need all the variables in these categories. If you’re not sure, start by enabling all the variables- you can always go back and disable the ones you don’t need.
Phone Call Click Tracking
To execute an event listener for phone call clicks tracking in GTM, it is significant to set the correct HTML mark-up code to open the mobile device to call. Here’s an example,”<a href=” tel:91-8750-799-799″>Phone Call 91-8750-799-799</a>”.
Click here to see how it works Phone Call 91-8750-799-799
Now open Google Tag Manager Account and
Create the trigger to fire on phone click
- Name your trigger , I have given “Click for phone call”
- Choose the trigger type Just Links
- Check “Wait for Tags” and “Check Validation”
- Enable this trigger on the website pages where there phone number has been. (Note*: Phone number is on every page of my site, so I have enabled this for all pages “.*” ).
- Configure this trigger to fire on Some Link Clicks, when Click URL contains tel:
- Click to Save for save your trigger.
Create the Tag to pass event values in Google Analytics
- Create a new Tag with your desired name, my tag name is “GA-Phone Call Clicks”
- Configure the Tag and choose tag type “Google Analytics: Universal Analytics”
- Choose the Track Type Event
- Fill the event tracking parameters “Category, Action and Label” as you want them to seem in GA.
- Value field is optional, fill Value if you want it to appear in GA. We’ll leave it blank.
- In the Google Analytics Setting field, choose the analytics property (which you were created to make connection between GA and GTM) where you want to receive this event.
NOTE*: We want to track form which page phone number was clicked since it is available on every page of my site, so my label is “from page {{Page Path}}”. If you have multiple phone numbers on your website and on a specific page, you might consider using Click URL to send the number that was clicked lieu of the page where it was clicked. Additionally, if you want to track both, you can use the Action field for Click URL and the rest as it’s presented above or put this “Phone number “{{Click URL}}” was clicked from page “{{Page Path}}” in the Label field.
Select the trigger which you had created in Triggering and Save your Tag.
Test and Debug
- Now, enter the Preview mode in GTM and open your website.
- Then, click any of the phone number which you want to track and check if the tag is fired properly.
- Don’t forget to check on Real-Time report in Google Analytics if the event is configured as you want.
If everything is fine and you’re happy with your phone call clicks event setup, you can publish your container.
NOTE*: In the Real-Time report, you won’t be able to see the Label you had set up in tag configure in GTM. You will have to wait for the next day to view the label, when the data is loaded into GA. This data can be found in the Behavior report in GA, under Events. Filter for the Category you created.
Setup Analytics Goal
The Events report in Google Analytics might give you some insights about your phone number click or other events, but when combine this information with Acquisition, you can only do it with Category, Action or Label individually. It may become quite too hard in read if you have a high number of events set up. Goal is one of the ways to cross this information that will invariably be available in Acquisition and other sections in a more readable way. To do this,
- Go to Admin setting of your Google Analytics and choose Goal from View section.
- Then click + NEW GOAL.
- Set it as custom, and Click Continue.
- Give your goal a name that will identify it among the others, as my goal name is “Website phone number click”.
- And select goal type Event. Click Continue.
- Fill the Event’s conditions like Category and Action exactly as you did on GTM. Click Save.
NOTE*: If you are dynamically receiving the Label field as we set up previously in GTM, leave it blank. If you populated it with a constant value in GTM adds it here as well. After you set up your Goal, go to on your website and click on phone, then check real time conversions report in GA. As you can see one website phone number click is recorded one in my case.
Email Click Tracking
Email click tracking is same as phone call click, only change in trigger to fire on where in phone click “Click URL contains “tel:” , in Email click “Click URL contains “mailto:”.
Save your trigger, and create a new Tag to pass values in Google Analytics.
Go to preview mode for test and debug your code, open your website and click on the email which you want to track and check if tag is fired properly. If you satisfied with your tag.
If you satisfied with your tag, submit your container, and setup a new event goal in Google Analytics for email clicks conversions.
Check on real time report in GA for email click successful conversion. In my case, it is working fine as you can see one conversion has been recorded in real time conversion report.
Contact form tracking
In shopify, when we fill and submit a contact us form it is redirected on this page “/pages/contact?contact_posted=true#contact_form” with thankyou message. So, to track a contact us form submission in Shopify, we need to create a Page View trigger that would be fired on some page views that Page URL Contains “contact_posted=true”.
Save your trigger, and create a tag to pass event values in GA.
Open preview mode of your GTM to test your “contact us form submission” tag and trigger in debug mode. Open your website and visit the page where contact us form is existing. Fill the form and check is tag is fired successfully.
Also check on Real Time Events report in Google Analytics to check your contact us form submission event.
Now setup a new goal in GA for contact us form submission conversions.
Now; Go to your website and fill a contact us form to test on Real Time conversion report in Google Analytics. As you can see in my case one contact us form submission goal conversion has been recorded in the Real Time Conversion report.
Tell us about your Shopify project
If you are looking for a Shopify SEO company to become your long term partner to handle your shopify website and succeed business online then we would love to hear from you. Our Shopify SEO experts will help you whether it’s branding, website’s conversion tracking or SEO, we have the experience to get it right.
Now, you have finished all three types of events tracking and Goals conversion for Shopify website. Enjoy the Shopify website tracking with Google Tag Manager, and share with your friends and peer.