Shopify Checkout Extensibility & GA4 - Google Ads Tracking

Shopify announced that the checkout.liquid will be depreciated on August 13, 2024 - so not much left. Shopify Plus support team already stopped enabling this file for merchants. So Shopify Checkout Extensibility becomes the only option - if you ever want to edit your checkout steps & add tracking scripts (and of course you want to!)

Between keeping up with the relentless updates from Google, Meta, Shopify, Facebook and ensuring our tools like Analyzify stay ahead of the curve, I’ve barely had a moment to catch my breath, let alone share my thoughts here. But, here I am, finally making the time to talk about something that’s been a hot topic among our community: Shopify’s checkout extensibility feature - and its affects to conversion tracking.

At Analyzify, we received hundreds of questions about this topic - especially from Shopify developers, agencies - who have to do the migration. And yes, here is your old friend to help you out.

TLDR:

• You will lose the tracking scripts (GA4, Google Ads, etc) on checkout.liquid once you upgrade to checkout.liquid. Don’t do the upgrade before you are ready with the scripts.
• You will lose the Order Status Page - Additional Scripts - which holds 80% of merchant’s conversion tracking tags if you upgrade to the new Checkout thank you page.
• It is possible to revert the changes; but your scripts won’t come back! So, make sure to take a backup of all your scripts.
• You need to use the Shopify Customer Events section, Web Pixels API or an app like Analyzify (well, definitely Analyzify) as a replacement.
• You will be unable to track the events as before because you no longer have direct access to the codes. Shopify Customer Events lives in a Sandbox environment on browsers - so we are quite limited here. (Ssh, don’t worry - we got you covered!)

Navigating Conversion Tracking with Shopify Checkout Extensibility

Transitioning to Shopify's Checkout Extensibility can significantly impact the functionality of your conversion tracking mechanisms for platforms like Google Ads, GA4, and Facebook.

Traditionally, integration codes for tools such as Google Tag Manager, Google Analytics, or Google Ads have been embedded within the checkout.liquid file or directly through Shopify's settings. However, this upgrade might render some codes ineffective, especially if their placement was within these now-altered locations.

To help with the process, Shopify Admin offers the following analysis of your existing structure and highlights what you should be careful with.


In the example above, Shopify found the Analyzify script on the checkout.liquid file and asks you to be careful with this and upgrade to Analyzify's latest version that supports checkout extensibility.

Leveraging Shopify Customer Events

As a workaround to the challenges presented by Checkout Extensibility, Shopify introduced its alternative solution: Shopify Customer Events. Think of it as Shopify's rendition of Google Tag Manager—albeit with its own set of limitations, it remains a viable option. This feature (sadly!) operates within a sandbox environment, providing a controlled space for tracking implementations. Shopify does this way to secure the storefront checkout from risks of code insertions.

Above you see the App Pixels section on Shopify Customer Events. You will see here the scripts that programmatically added by apps using Shopify Web Pixels API.

Considering diving deeper into Shopify Customer Events? It might be worth your while to explore a detailed discussion on this topic. (And yes, crafting an extensive post could be incredibly beneficial for many!)

For those looking to navigate these waters, we recommend consulting the comprehensive guides available on Shopify and Analyzify. These resources offer invaluable insights into making the most out of Shopify's Customer Events and adjusting your tracking strategies accordingly.

Learn more from Shopify's official guide: Shopify Help Center on Pixels

Check out our relevant guide: Analyzify on Shopify Pixels & Customer Events

In the screenshot above, you will see Analyzify's custom script enabling checkout events tracking and Google Tag Manager on Shopify's new checkout flow.

Prioritizing Crucial Tracking Events

It’s essential to underline that the most critical events to track, such as purchases, beginning the checkout process, and navigating through checkout steps, are the most affected by the shift towards checkout extensibility. This necessitates a focused effort to ensure the collection of accurate data during these key e-commerce moments.

So what could break:

• Google Ads Conversion tracking
• Google Ads Dynamic Remarketing Events - Checkout Steps
• Google Analytics 4 Checkout Events
• Google Analytics 4 E-commerce Reports
• All other tracking pixels you manually added (such as affiliate tracking)

You need to move all of these scripts into either Shopify Customer Events (manually) or use an app like Analyzify that uses Shopify Web Pixels API.

You will find this section on Shopify Admin > Customer Events > App Pixels.

Professional Guidance Through Tracking Adjustments

Our team at Analyzify is ready to guide you through this evolution, ensuring your tracking remains precise and reliable.

With Analyzify, you gain access to comprehensive setup and review services, all for a one-time fee, ensuring your e-commerce tracking doesn’t skip a beat during this transition.

We offer a managed migration service at no extra cost for our new clients.

Setting up Google Tag Manager with Shopify Checkout Extensibility (2024)

As I mentioned, we no longer have direct access to the codes. Shopify Customer Events section works in a sandbox environment so it works on its little word with many limitations.

Shopify has an excellent tutorial on this topic but it doesn't cover all the needs. I will soon create an open source solution this matter as well. But for now, I will explain how we handle this issue for Analyzify clients.

1. Data Transformation:

   • Identify data that is inaccessible due to the sandboxed checkout environment.
   • Transform this data into a format suitable for analysis and tracking.

2. Data Layer Integration:

   • Relay the transformed data to the dataLayer.
   • This creates a bridge for information transfer, making data accessible for tracking purposes.

3. Data Transmission via GTM:

   • Utilize Google Tag Manager (GTM) to send the data from the dataLayer to various destinations.
   • These destinations include analytics and marketing platforms such as GA4, Google Ads, and Facebook.

In the screenshot above, you will see Analyzify's custom script enabling checkout events tracking and Google Tag Manager on Shopify's new checkout flow.

Benefits of Our Approach:

• Efficient Data Utilization:

  • Leverage GTM to manage and transmit checkout data efficiently.
  • Ensure comprehensive tracking of checkout events and customer behaviors.

• Detailed Checkout Tracking:

  • Monitor crucial checkout events like “add_shipping_info”, “add_contact_info”, and “add_payment_info”.
  • Gain clear insights into the customer journey throughout the checkout process.

• Constant Updates and Compliance:

  • Stay updated with the latest Shopify enhancements, including checkout extensibility and custom pixels.
  • Ensure codes are continually refreshed to maintain compatibility and functionality.

• Easy Debugging and Documentation:

  • Benefit from a user-friendly system designed for easy debugging and problem resolution.
  • Access comprehensive documentation effortlessly, ensuring smooth operation and utilization of our services.

• Data Privacy Assurance:

  • Adhere to GDPR and other data privacy regulations through full compatibility with Shopify's customer privacy API and consent management tools.
  • Maintain the highest standards of data privacy and security for your customers' information.

FAQ

1. What is Shopify Checkout Extensibility?

Shopify Checkout Extensibility offers a comprehensive solution for customizing the checkout experience, including the design and functionality of checkout, thank you pages, order status, and customer accounts. This feature provides a dedicated environment for enhancing brand consistency and integrating advanced functionalities, all separate from the theme editor.

2. Why should I use Shopify Checkout Extensibility?

The primary advantage of utilizing Shopify Checkout Extensibility lies in its user-friendly sandbox environment, which enables significant customization without the need for coding expertise. This facilitates effortless checkout modifications, ensuring a seamless integration without affecting the existing theme structure.

3. How can I activate Shopify Checkout Extensibility?

To enable this feature, navigate to Settings > Checkout within your Shopify admin. Shopify Checkout Extensibility can be activated for various checkout stages including contact information, shipping details, payment information, and the thank you/order status page, catering to diverse customization needs.

4. How can you use Checkout Extensibility with Analyzify?

Shopify's Web Pixels feature offers a coding-free alternative for embedding tracking scripts, which is fully supported by Analyzify. This integration ensures accurate tracking across checkout steps, thank you pages, and order status, leveraging Web Pixels to facilitate comprehensive analytics.

5. Can I use GTM with Checkout Extensibility?

Analyzify enhances Shopify Checkout Extensibility by enabling the use of Google Tag Manager (GTM) functionalities, ensuring a robust and flexible tracking setup across the checkout process.

6. Impact on checkout.liquid File Post-Activation

Upon activating Shopify Checkout Extensibility, the traditional checkout.liquid file becomes redundant. However, Analyzify provides alternative tracking solutions that compensate for this change, ensuring continuous and precise analytics without relying on checkout.liquid.

7. What are the limitations and advantages of Web Pixels?

Advantages:

• Universal Access: Web Pixels is accessible across all Shopify plans, removing the exclusivity of checkout data collection to Shopify Plus users.
• Isolation from Theme Changes: Tracking remains unaffected by alterations in the theme, offering stability in analytics.

8. How can I set up Google Tag Manager on Shopify's Checkout Extensibility?

As explained above, you can use an app like Analyzify or use Shopify's guided tutorials. Please note that there are many limitations with the Do-It-Yourself option as it the Shopify Customer Events section lives on a sandbox environment. You can also check this video on YouTube to get a better idea of how the Shopify Customer Events section works.

Limitations:

• Event Tracking Constraints: The scope of events that can be tracked via Web Pixels is limited.
• Restricted Data Transmission: The granularity of information that can be sent with each event is limited, potentially impacting the depth of analytics.

In summary, Shopify Checkout Extensibility significantly advances e-commerce customization and analytics. By leveraging tools like Analyzify and the functionalities of Google Tag Manager, merchants can achieve a highly customized checkout experience that aligns with brand identity, enhances user engagement, and maintains rigorous analytics integrity, all while ensuring compliance with data privacy regulations.

Any questions? Hit me in the comments, and I'll do my best to respond.