Server-side Google Ads conversion tracking in Shopify

Shopify is the top eCommerce platform that lots of business owners use to build and run their online shops. Many Shopify store owners count on Google Ads to boost their online store sales as a crucial way to connect with potential customers.

The main factor for a successful online advertising campaign is precise conversion tracking. Server-side tracking is a great way to capture accurate and comprehensive data about user interactions on your website, minimizing the impact of cookie restrictions and ad blockers.  

In this article, we will show how to implement server-side Google Ads conversion tracking for Shopify stores using Stape’s Conversion Tracking app for Shopify. 

Server-side tracking technology has become increasingly popular in recent years, and there are several reasons for this trend. The primary factor is that server-side tracking is well-suited to the evolving landscape of tracking regulations and restrictions, making it a better choice than traditional web tracking methods or a basic Google Tag Gateway setup. For example, the Transparent Digital Services Google Ads setup with Stape helped lower cost per purchase and keep conversion data stable across campaigns.

Below are some situations where server-sid tracking can help to increase the accuracy of tracking:

1. 1.
   Limitation on the use of third-party cookies. All popular browsers except Chrome are already limiting the use of third-party cookies. On the other hand, marketing and analytics platforms rely on third-party cookies when tracking user conversions and behaviors. Recently, Safari even started to block first-party cookies set from third-party IPs. Even Chrome planned to phase out of third-party cookies in 2024. With the help of the server-side tracking, you can set first-party cookies instead of third-party or set first-party cookies from the first-party IP.
2. 2.
   Use of AdBlockers. Over the last few years the number of people who installed AdBlcokers has multiplied. With the help of server-side tracking, you can still accurately track people with adblockers.
3. 3.
   Blocking of Google Tag Manager, Google Analytics, and other tracking scripts. Safari and Brave are blocking web Google Tag Manager, GA and some other tracking scripts. When web GTM is blocked, all tracking that is supposed to trigger inside the web GTM is blocked as well. The good news is that gtm script is not blocked when you use server-side GTM with a custom domain.

There are cases when first-party cookies may disappear from the server response. Server-side tracking Shopify's most prominent example is its Checkout Extensibility. When used, it strips the cookie header from network requests, making it impossible to track the customer’s origin or referral source. This issue can be fixed by manually sending the cookie values to the payload, where they can later be transformed back into a format that vendor tags can read. Those who use Stape’s Data Tag can consider themselves lucky, as instead of all that manual work, they only need to tick “Send common cookies” in the settings and get everything into the payload automatically.

If you want to use functionalities such as the Custom Loader and Cookie Keeper power-ups, or Customer Match, you need to have an sGTM container hosted on Stape. You will also need GA4 or Data tags configured in a web GTM. If you don’t have this, follow the Get started with sGTM hosting instructions.

1. 1.
   Log in to your Shopify account.
2. 2.
   Go to Apps and search for the Stape Conversion Tracking app.
3. 3.
   Click Install.

1. 1.
   Open the app and configure the General tab:

• Use Shopify Markets (Beta) – check the box if you have multiple Shopify markets. Using the feature, you can configure GTM injection separately for each Shopify market. If the feature is disabled, all markets use the default setup.
• Insert GTM snippet – automatically adds the snippet with JavaScript code to every page on your website. 
• Enter the WEB Google Tag Manager ID – specify the Web container ID.
• Add custom domain – specify the custom domain (optional). In this case requests go through your tagging subdomain, so cookies stay first-party.
• Add custom loader – specify Stape container identifier (optional). The gtm.js script loads from your domain instead of Google’s, which helps the script get past ad blockers. Custom Loader needs to be turned on in your Stape account to use it.

• Select whether to use the Cookie Keeper. Cookie Keeper needs to be enabled in your Stape account to use it. 

2. Click Save.

1. 1.
   Configure the Data Layer tab:

• Add ecommerce Data Layer events – add standard data layer events to your shop.
• Append '_stape' to event dataLayer – adds _stape to event names so they don’t clash with existing dataLayer pushes, potentially triggering your tags twice. When it’s unchecked, event names are pushed as per GA4 schema.
• Enable checkout error tracking – enable dataLayer events that signify checkout errors to make debugging easier.
• Product collection limit – set the limit for products included in view_collection event.
• Advanced Data Layer Settings – allows you to customize how product parameters (item_id, item_sku, item_brand, and item_category) are sent to match your ad catalog keys. This allows you to add a Prefix, combine Data points, or change the default Sources.

2. Click Save.

3. Activate the Data Layer.

3.1. Activate the Add ecommerce Data Layer events checkbox and configure additional settings.

3.2. Save changes.

3.3. Copy the code for the custom pixel in the box below on the data layer tab and follow the instructions to add and activate it.

In the Customer privacy section, under Permission spoiler, please make sure to select Not required. The code snippet only generates the Data Layer; it doesn't set any cookies or report any data to third parties.

In the Data Layer tab of the app, there is also an option Log events to console (Dev), which is a debugging option for developers and store admins. When enabled, it logs eCommerce events in the browser console, shows event payloads sent to the GTM/Stape server container for verification, and helps debug Data Layers.

This option is for development only and should be disabled in production to avoid unnecessary console logging.

1. 1.
   Configure the Webhooks tab. Webhooks are useful for events outside the website (for example, phone or offline sales).

• Enable Send webhooks to sGTM container.
• Add your GTM server container URL.
• Choose the webhooks:

  • Purchase webhook – send a purchase event when a new order is created.
  • Refund webhook – send a refund event when an order is refunded. 

2. Click Save.

1. 1.
   If you’re using Google Ads, configure Customer Match:

• Container API Key – specify your Stape container API key.
• Google Ads Operating customer ID – specify your operating customer ID.
• Google Ads customer ID – specify your customer ID.
• Select which User data to share.

  • Consent – select whether to inherit the consent from email marketing, or set it manually.
  • Backfill – if checked, the app scans your existing database and retroactively syncs all past contacts, leads, or customers who already match your configured trigger criteria/statuses into the Google Ads Customer Match list.

2. Click Save.

Debugging a GTM download

After activation or any changes, it is recommended to check if your container is actually uploaded to the site.

To do this, go to any page on your site, open your browser console, and in the network tab, filter by your subdomain/tagging server URL. You should see a request like in the following screenshot with a response status 200:

Debugging data layer checkout events

With events that happen before the checkout page, everything works like on any other platform - you can launch a preview of your GTM web container and find all the events you do:

The checkout events won't be displayed in GTM Preview due to the isolated environment on these pages that blocks unrestricted DOM manipulation or script injection, including the GTM snippet.

But you can manually insert the snippet on the checkout page using the Stape GTM Helper Chrome extension:

• After running Preview Mode in GTM, turn on the toggle Shopify Sandbox dataLayer in the Settings tab of the extension.
• In the tab Inject GTM, click Enable injection, add your domain name, and GTM ID. Save changes.

Now, the events on the checkout page will display in GTM Preview.

There can be two scenarios:

a. Open your server GTM container. In the 'Clients' section, check if you have a GA4 client there. If not, create new one:

Choose Google Analytics: GA4 (web) and click Save.

b. Create GA4 tag on server GTM container.

Go to Tags and click New.

Choose Google Analytics: GA4.

Standard tag settings:

Measurement ID - Leave blank, the same measurement id that is in your web events will be used

Event Name - leave blank, the same event name you use in web tags will be used.

c. Add trigger.

Click Triggering. 

Create triggers for the tag.

Client name should equal GA4. Click +

d. Choose Custom type →  click Some events →  choose Client Name in built-in variables →  set Equals GA4 (the name of your GA4 client) →  click Save. 

e. Add your server container URL to Google Tag settings. In the configuration settings, add the configuration parameter server_container_url and add your tagging server URL as a value. 

a. Inside the Web container, create a new tag of the tag Type Google Tag. Add your Google Tag ID.

In the section Configuration settings add the following parameters:

• Name: server_container_url
• Value: Enter the URL you've created

Add trigger to GA4 tag. Normally it should trigger on all page views.

Google tag itself will generate standard GA4 events like page_view, session_start, user_engagement, etc.

b. Setting up additional eCommerce events. 

Each event you want to configure must be configured with a separate GA4 event tag, use its own trigger and have its own payload.

Below is an example of configuring the tag for the add_to_cart event with standard parameters. You can repeat this for any other events you want to configure.

You can also use any custom events if you want to track them in your GA4.

c. Set up trigger.

d. Set up variables for GA4 events payload.

You can find the standard and mandatory payload eCommerce GA4 events in Google's official documentation.

A minimum of three parameters need to be sent with each eCommerce event:

• value
• currency
• items

To add these parameters to an event, you must first create variables for them.

To do this, go to 'Variables' section in your web container → create a new one → select 'Data Layer Variable' type → specify the path to the required value as per how they are in the data layer. 

for value path: ecommerce.value

for currency: ecommerce.currency

for items: ecommerce.items

Сreate these three variables:

e. Set up GA4 event tag.

Go to the tags section in your web GTM container  and create a new tag with the tag type Google Analytics: GA4 Event. 

In the tag, specify:

• Measurement ID: your GA4 measurement id
• Event name: add_to_cart (or other if you are setting up another event)
• On GA4 event tag ‘Event parameters’ section add three parameter: value, currency and items. Use the variables you created in the previous step as the value for them.
• Add to the tag the add_to_cart_stape trigger we created earlier.

Similarly, configure any other events you want to track in your GA4.

In the Server container set up the Conversion Linker tag. This tag should trigger on all events claimed by the GA4 client (the same trigger that is used for GA4 server tag, on the screenshot above).

In the Server GTM container click New Tag → click Tag configuration → Google Ads → Google Ads Conversion Tracking tag. Add Conversion ID and Conversion Label similarly to the web Adwords tag setup.

Then you have an option to add product and user data. If you send user and product data from the web to the server, then you can enable these checkboxes and select event data as a data source. If product and user info are properly sent from the web using standard dimensions and are available in the event data - the tag will parse this information automatically and report to Google Ads. You also have an ability to override the data sent from the web if needed. My Adwords server conversion triggers on the purchase event.

At this stage, you can also set up POAS Data Feed if you want Google Ads to use profit instead of only revenue. It maps margin data by product and adds profit-based values to your conversion setup

Setting up Google Ads conversion tracking in your Shopify store is an indispensable step for anyone aiming to harness the full potential of online advertising. As the digital marketplace becomes increasingly competitive, such insights are invaluable in staying ahead of the curve and maximizing your ROI. Taking the time to properly install Google Tag Manager Shopify app integrations lays the exact technical foundation needed to capture this reliable data.

Whether you're a seasoned advertiser or just beginning your journey, ensure that your Shopify store is equipped with Google Ads conversion tracking to truly capitalize on every advertising dollar spent.

If you have any questions about the setup - don’t hesitate to leave a ticket. And if you’d like a setup from us - here’s a free quote!