Google Ads Remarketing: View Item event for Shopify using Google Tag Manager

by ShahzadaAliHassan - 20th December 2023

Introduction to Google Ads Dynamic Marketing

Welcome to our in-depth exploration of Google Ads Dynamic Marketing, an incredibly potent tool for e-commerce. This guide aims to demystify the process of configuring remarketing tags to track the 'view item' event in Google Ads, ensuring that dynamic parameters like item ID, details, and other essential data are effectively communicated.

The Power of Dynamic Marketing in E-Commerce

Google Ads Dynamic Marketing stands out for its ability to utilize e-commerce event data, such as item details, IDs, and names, to create targeted and efficient marketing strategies. By the end of this guide, you'll understand how to set up these remarketing tags and send dynamic parameters back to Google Ads.

Step 1: Setting Up Google Tag Manager on Shopify

To kickstart your remarketing tracking journey, the initial crucial step is to establish Google Tag Manager (GTM) on your Shopify store and ensure that it functions correctly.

Verifying GTM Firing on Shopify

Before diving into conversion tracking, it's essential to ensure that GTM is firing correctly on your Shopify store. Here's how you can verify it:

  1. Access GTM Container ID: Start by logging into your GTM dashboard and clicking on your container ID. This will allow you to view the head and body tracking scripts.

  2. Integrating Scripts on Shopify:

    • Head over to the 'Online Store' section of your Shopify dashboard.
    • Go to 'Themes', click on 'Actions', and select 'Edit Code'.
    • Locate the <head> tag and paste the GTM head script.
    • Find the opening <body> tag (you can use Ctrl + F for convenience) and paste the GTM body script.
  3. Save Changes: After pasting the scripts, format the code appropriately, save the file, and verify that the script is functioning correctly on your store.

Step 2: Writing the Data Layer Script for View Item Event

Now, let's delve into creating the Data Layer script required for tracking the 'View Item' event on your Shopify store.

Introduction to DataLayer Initialization

This set of code snippets is responsible for managing the initialization and population of the dataLayer object on your Shopify website. It ensures that relevant data is accurately captured and made available for tracking and analytics purposes.

Initializing the DataLayer

To start, we have a code snippet designed to initialize the dataLayer array if it hasn't been initialized already. It also includes logic to identify whether the current page template corresponds to a 'product' page. If it does, it triggers the rendering of a specific snippet called 'datalayer-product'.

Capturing Product Data

The primary focus of the 'datalayer-product' snippet is to capture essential product information when a user visits a product page. Here's how it works:

  1. It identifies and captures the current product variant.
  2. Constructs an itemObject that holds various product details.
  3. Upon document load, it pushes this data into the dataLayer object.

Integrating Theme DataLayer Code

Lastly, to integrate the theme-level dataLayer code, you need to render the 'head-datalayer' snippet. Typically, this is where the head datalayer code resides in your Shopify theme setup. You should insert this code into the GTM Body Code section.

Steps to Implement DataLayer Code in Shopify:

  1. Backup: Start by creating a backup of your current theme.

  2. Access Theme Files: Log in to your Shopify Admin, go to Online Store > Themes, and select "Edit code" from the "Actions" dropdown for your live theme.

  3. Adding Head DataLayer Code: In the left sidebar, find and click on theme.liquid. Place the "Head DataLayer Code" snippet within the <head> tags.

  4. Adding Product DataLayer Code: Create a new snippet (name it datalayer-product.liquid, if needed), and insert the "Product DataLayer Code" snippet into it. Save your changes.

  5. Integrate Theme DataLayer Code: Determine the desired location within the <head> tags in theme.liquid for the "Theme DataLayer Code" snippet. Insert it accordingly. Save your changes.

  6. Testing: Visit a product page on your Shopify store, open the browser's developer console, and verify that the custom_view_item event is triggered and that the dataLayer object contains accurate product details.

By following these steps, you'll ensure that your Shopify website effectively captures and utilizes data for tracking and analytics purposes, enhancing your remarketing efforts.

Step 3: Setting Up Conversion Actions in Google Ads

Now that you've successfully set up Google Tag Manager on your Shopify store and initiated the process of capturing essential data, it's time to establish conversion actions in Google Ads to track user interactions effectively.

Creating Conversion Actions

  1. Access Google Ads Account: To begin, navigate to your Google Ads account and focus on the 'Goals' and 'Conversion' sections. This is where you'll define the actions you want to track as conversions.

  2. Configuring Conversion Action: In Google Ads, you'll create a new conversion action specifically tailored to your tracking needs. Depending on your objectives, you may choose to set up conversion actions for events like 'View Content' or 'View Item.' This step involves naming and defining the conversion action parameters.

  3. Setting Up Manual Conversion Actions: For those who seek more granular control over the events tracked, Google Ads provides the option to set up conversion actions manually. This approach allows you to customize conversion tracking to align perfectly with your business goals and marketing strategies. Manual setup grants you greater flexibility in tracking various interactions on your website.

Step 4: Configuring Remarketing Tag in GTM

With your conversion actions defined in Google Ads, the next vital step is to integrate the corresponding conversion IDs into your Google Tag Manager (GTM) container. This integration ensures that the tracking mechanisms in your GTM tags are synchronized with your defined conversion actions in Google Ads. Once you have obtained the conversion IDs from Google Ads, follow these steps to integrate them effectively:

Step 5: Finalizing the Setup and Testing

Before fully implementing your tracking setup and making it live, it's crucial to undergo thorough testing and verification to ensure its accuracy and reliability.

Verifying Tag Functionality

  1. Google Tag Manager Preview Mode: Utilize Google Tag Manager's preview mode to inspect the functionality of the newly set up tags. This feature allows you to see how your tags interact with your website in a controlled environment. Verify that custom events, such as 'View Content' or 'View Item,' are triggering correctly based on user interactions. Additionally, confirm that the data associated with these events is being accurately sent to Google Ads for tracking.

Publishing Changes in GTM

  1. Publishing Changes: Once you are satisfied that the tracking setup is working as intended and capturing data accurately, it's time to publish the changes within your GTM container. This action is critical as it activates the newly configured tags and ensures they are actively collecting data in real-time.

By meticulously following these steps, you'll have effectively set up and tested your conversion tracking system, allowing you to make informed marketing decisions based on valuable user data and interactions on your Shopify store.

Conclusion: Empowering Your E-Commerce with Dynamic Marketing

By following these detailed steps, you've now equipped your Shopify store with powerful tools to leverage Google Ads Dynamic Marketing effectively. This setup will enable you to track critical e-commerce events, gather valuable data, and refine your marketing strategies for better ROI. Stay tuned for more insights and tutorials on leveraging digital marketing tools to enhance your e-commerce experience.