Stape
Search
Try for free

Server-side tagging for Shopify

Updated
Dec 3, 2024
Published
Mar 10, 2023
Also available in

Are you looking for an easy, fast way to set up Shopify server-side tagging? Look no further than the Stape server GTM app for Shopify. With our app, you can easily insert a web Google Tag Manager script on the website, set up a custom domain and custom loader, send user and e-commerce event data to the data layer, and set up webhooks. All these features will help you make tracking more accurate by prolonging cookie lifetime, making browser tracking resistant to tracking prevention technologies, and sending reliable data to advertising and marketing platforms through the server endpoint. 

In this blog post, we'll explore how to configure and install the Stape app for Shopify so that you can use these powerful features immediately.

Benefits of using server-side tagging for Shopify

Server-side tagging can turbocharge the success of your marketing campaigns with precise conversion tracking and user analysis. However, taking full advantage requires a meticulous setup - something nobody should overlook.

To make the implementation of sever-side tagging as easy as possible, we created a Server GTM Shopify app. This app is free to use and helps to easily configure the server Google Tag Manager container for the Shopify store. But first, let’s talk about the main benefits of server-side tagging for Shopify sites. 

1. Better data accuracy. Server-side tagging can help ensure more accurate data collection by reducing the risk of data loss or errors caused by ad blockers, browser extensions, or other client-side factors.

2. Accurate conversion attribution. Due to increased cookie lifetime and user data sent through the server, advertising networks can more accurately attribute conversions to marketing campaigns. 

3. Improved website performance. With server-side tagging, tags are loaded on the server rather than on the client side, reducing the amount of code that needs to be loaded on the user's browser. This can improve website loading speed, which is crucial for user experience and SEO.

4. Enhanced security. Server-side tagging can help improve website security by reducing the risk of data breaches or other security threats caused by client-side vulnerabilities.

How to set up server-side tagging on your Shopify store

Note: Stape has pre-built Google Tag Manager templates for Shopify that make setting up eCommerce tracking super easy. The templates come ready to track product views, add-to-cart actions, and purchases. Plus, we have a simple guide to walk you through installing and configuring everything, so you don’t need to be a tech expert to get accurate tracking set up on your store.

The standard configuration of server-side tagging is straightforward with the Stape Server GTM app for Shopify. The app will help you implement a modified gtm.js script to the Shopify store, send data to sGTM using webhooks, and transmit data layer pushes to the web container. 

2. Add and configure Stape Server GTM app for Shopify.  

The purpose of the Stape Server GTM app  is to simplify the process of setting up the server Google Tag Manager and delivering data to server GTM. Our app can work either with stape.io hosting for server Google Tag Manager or with any other, but the plugin's custom loader and cookie keeper features only work when using stape.io hosting. 

2.1. Install Stape Server GTM App in store. 

Stape Server GTM App in store

2.2. In the Generate tab are all the settings related to installing the GTM snippet on all pages of your Shopify shop.

Generate tab are all the settings related to installing the GTM snippet on all pages of your Shopify shop
  • GTM web container id

Here you need to specify your GTM WEB container ID.

  • Custom domain

It is extremely important to use your own subdomain for first party cookies to work correctly and for tracking to work in general. If you do not already have a subdomain added to your sGTM container, you can use this guide to add it.

  • Custom loader

An optional parameter, but its use is highly recommended to increase protection against ad blockers.

Specify here your Stape container identifier. Follow this guide to find Stape container identifier.

  • Cookie Keeper

You can learn more about Cookie Keeper power-up on this page.

This allows you to minimize the impact of the latest ITP restrictions.

Before activating this feature, make sure you have it enabled in Stape, in your container.

  • GTM snippet block

Here you can take the GTM snippet to install it on pages that are outside of your Shopify theme (such as pages made by third-party apps like Zipify).

2.3. In the Data Layer tab you can find the data layer events to activate and configure.

Data Layer tab you can find the data layer events to activate and configure

Data layer activation:

  • Activate the 'Add ecommerce Data Layer events' checkbox.
  • Save changes.
  • Copy the code for custom pixel in the box below on data layer tab and follow the instructions to add and activate it.

In Customer privacy section, under Permission spoiler, please make sure to select ‘Not required’. The code snippet only generates dataLayer, it does not set any cookies or report any data to third-party.

2.4. Webhook events are configured in the Webhook tab.

Note: the problem with webhooks on Shopify is that they don't contain any cookie data which is crucial for tracking any platform, so using webhook events is only recommended as a last resort if you for some reason can't track it online.

This tab is where the webhook events are configured.

Webhook events are configured in the Webhook tab

To activate a webhook you need to activate the checkbox, specify the url of the server GTM container and /path where the webhooks should be sent.

You can subscribe to webhooks when a new order is created or when a refund is made on an order.

Here are some useful blog posts we have about using and debugging webhooks:

3. Send data to the server Google Tag Manager container. There are two most popular ways to do that:

4. Configure tracking inside the server Google Tag Manager container. Most popular marketing and analytics tools already support server-side tagging and have tags for sGTM. You can find guides on our site to implement those, for example, Facebook CAPI, TikTok events API, SnapChat, Google Ads server-side tracking, etc. Besides, you can use sGTM to enrich sGTM data using Firestore or Google Sheets. Another helpful feature of sGTM is sending offline conversions to Facebook and Adwords

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 enter your container ID without the 'GTM-' part. You should see a request with a response status 200:

Debugging a GTM download

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 there all the events you do:

debugging data layer checkout events - stape

The only option in Shopify to track events on checkout pages is to use the Shopify Pixel API so data layer events and GTM installation are implemented through this in our application. 

But because of the way it's technically implemented (all code from pixel api is rendered as a separate iframe) - you can't run GTM previews on those pages, although technically your GTM container will load there.

So unfortunately at the moment you can't debug your checkout events in preview mode. This restriction also applies to purchase events if you use Checkout Extensibility for order status page.

The only option for debugging checkout events in Shopify is to publish your configuration or changes on your containers and check network requests in the browser console.

This way you can check if all the events you have configured go away and if they contain all the payload you have configured for them.

debugging data layer checkout events - stape

To make it easier to find GTM requests, you can specify the url or part of url of your server container in the filter.

Conclusion:

The possibilities of server-side tagging are expanding rapidly, giving the user a great tool to improve the accuracy of conversion tracking and analytics. In addition, Stape tries to simplify the use of sGTM for our clients, so we released the Server GTM app for Shopify

Stape server GTM for Shopify is a fantastic tool with numerous features and benefits. For example, you can easily set up tracking on your website by adding a Google Tag Manager script and configuring your custom domain and loader. Additionally, you can send user data to the data layer and set up webhooks. 

All these features help make data in analytics more accurate by prolonging cookie lifetime and making browser tracking resistant to tracking prevention technologies. These tools are essential for reliable data transmission through the server endpoint to advertising and marketing platforms. 

If you're looking for a fast, simple solution to setting up Shopify server-side tagging, Stape is the way to go. Take advantage of this excellent solution today and reap the benefits of more accurate tracking insights with the Stape Server GTM App for Shopify. Test it out yourself now - we know you won't be disappointed!

Tagged with:Shopify

Try Stape for all things server-sideright now!