Shopify

Shopify App Configuration Guide

Introduction

Welcome to the documentation for our Shopify app, designed to make your life easier. In less than 5 minutes, without any technical skills required, you will be able to configure Google Tag Manager (GTM) and a DataLayer compatible with GA4 on your store.

💡

Before getting started, make sure that there is no direct connection with Google Analytics on your Shopify store:

  • Check in your Shopify admin under Online Store > Preferences that no "Google Analytics" is connected.
  • Also check that there are no other Shopify apps linked to Google Analytics.

Setup

Install the Shopify App

To begin, download the app from this page (opens in a new tab) or search for Addingwell directly in the Shopify App Store (opens in a new tab).

Then click on Install.

Configure the DataLayer

Enable the DataLayer

Enabling the DataLayer automatically generates user event tracking in GA4 format. These events cover most interactions on your site.

Enable the dataLayer

Here is the list of supported events: view_item_list, view_item, add_to_cart, remove_from_cart, view_cart, begin_checkout, add_payment_info, add_shipping_info, purchase.

Add a Suffix to the DataLayer

If necessary, you can add a suffix to the names of DataLayer events to avoid conflicts with other GA4 events already present.

Add a suffix

For example, by adding the suffix aw, the view_item event becomes view_item_aw.

💡

If you choose to add a suffix, be sure to adjust your triggers in GTM.

For example, if you have a trigger for view_item, it will need to be changed to view_item_aw in your GTM configuration.

Configure Google Tag Manager (GTM)

Enable GTM

To integrate Google Tag Manager into your store, start by enabling the gtm.js script on all pages of your site. Then enter your GTM container ID (e.g., GTM-DSD8IZD).

GTM id

Use an Alternative Path

You have the option to configure a custom (proxied) URL to load gtm.js and bypass ad blockers. By default, the URL used is: https://www.googletagmanager.com/gtm.js.

GTM alternative path

With Addingwell's server-side tracking, you can generate a proxied URL from your workspace by clicking "How to setup" in the CDN section.

CDN

Then enable the "Addingwell CDN" option, which modifies the GTM-XXXX ID to aw=XXXX.

Checkout Tracking with Customer Events

To track interactions during the checkout process, you need to set up a custom pixel.

Set up a pixel for checkout

Here's how to do it:

  1. Go to Settings > Customer events in your Shopify admin.
  2. Click on Add a new custom pixel.
  3. Name your pixel (e.g., addingwell-pixel).
  4. Add the appropriate permissions.
  5. Replace the pixel code with the one provided in the app.
  6. Click Save and then Connect.

Note that to test checkout events, you will need to publish your GTM Web container, as these steps run in a sandbox environment. This means that unpublished changes in GTM will not be visible during checkout testing.

🎉 Installation Complete

Congratulations 👏! You have successfully configured your Shopify site.

Shopify review

Advanced Feature: Cookie Restoration

During the Shopify checkout process, marketing cookies are no longer available. Thanks to Addingwell's Cookie Restore feature, you can recover lost cookies.

Follow these steps to enable this feature.

Add the shopify_y Parameter

Add the shopify_y parameter to your GA4 event tags in your GTM container for the checkout steps (begin_checkout, add_payment_info, add_shipping_info, and purchase if you use Checkout Extensibility). Create a DataLayer variable to retrieve the visitor ID, named master_id. This will allow you to track the visitor throughout the checkout process.

Set up shopify_y

Enable the Cookie Restore Feature

On the Cookie Monitoring page, click on Cookie Restore and fill out the form with the following information:

  • Tracking domain.
  • Leave the second line unchanged.
  • Cookie name: _shopify_y.
  • Click Verify.

Wait a few seconds, then click on Enable Cookie Restore.

Conclusion

Congratulations 🎉! You’ve successfully completed the installation of our Shopify application, and your store is now ready to efficiently collect user interaction data.

With this setup, you can precisely track key events, optimize your ad campaigns, and gain deeper insights into your customers' behavior. If you have any questions or encounter any issues, feel free to reach out to our support team, who are ready to assist you every step of the way.