Skip to content

Stape Integration

Stape is a server-side container hosting solution that simplifies deploying and managing sGTM containers. It provides a user-friendly interface with features designed to enhance performance and security.

Integration Levels

Stape offers multiple integration levels. This guide covers the most practical and efficient method: Stape CDN.

Advanced configurations, such as using your Own CDN or Same Origin setups, are excluded here as they require provider-specific worker configurations and custom infrastructure beyond the scope of this guide.

Create a Stape Account

If you do not have an account, create a Stape account here. Once registered, follow these steps to set up your server-side container.

Create a Stape sGTM Container

  1. In your Stape dashboard, click sGTM.

  2. Click Create sGTM container.

    Accessing sGTM Dashboard

  3. Enter a Container name (this does not need to match your GTM container name).

  4. Paste the Container Config string copied from GTM.
  5. Select the server location closest to your target audience.

  6. Click Create Container.

    Container Configuration Details

  7. Choose a Stape plan (a free tier is available to start).

  8. Click Continue.

    Selecting a Stape Plan

Setup Custom Domain

  1. Click Add custom domain.
  2. Enter your Domain name (e.g., xyz.yourdomain.com).
  3. Enable Add CDN to improve loading times.
  4. Select Stape CDN.
  5. Select Manually to retrieve DNS instructions.
  6. Click Next.

Custom Domain Setup

!!! tip "Privacy & Ad-Blocking" - To bypass advanced ad blockers that target common subdomains (like gtm, stape, or taggrs), use a unique, less predictable subdomain. - This Domain name is the value required in the module configuration under the GA4 tab > Server Container URL field.

  1. Create the CNAME or A records in your domain's DNS settings as provided by Stape.
  2. Click Verify in Stape to confirm the DNS records are correctly deployed.

DNS Verification

!!! Info The verification process may take a few minutes to several hours, depending on your DNS provider's TTL settings.

Configure Stape Power-Ups

Custom Loader

The Custom Loader is a Stape feature that allows you to load the GTM container more efficiently, improving performance and reducing the impact of ad blockers.

  1. In your Stape dashboard, click sGTM and select your GTM container.
  2. Click the Power-Ups tab.
  3. In the Custom Loader panel, click Use.

Stape Power-Ups Interface

  1. Enable the feature.
  2. Click Save Changes.

Enabling Custom Loader

  1. Select your domain (previously configured).
  2. Enter your Web GTM ID.
  3. Enable GA4 ad block bypass.

  4. Same Origin Path: Leave this field empty.

    Advanced Configuration

    Configuring a "Same Origin Path" requires additional server-side setups (such as proxies or workers) specific to each hosting provider. These steps are beyond the scope of this guide. To ensure a smooth integration, leave this field empty.

  5. Select the Platform Other.

  6. Set the Data Layer Variable Name (leave it empty to use the default value).
  7. Select Generate with CDN.
  8. Disable Use original GTM code.
  9. Click Generate.

  10. Review the generated code and follow the instructions below.

    Custom Loader Configuration

    No Template Code Deployment Required

    Do not manually copy, paste, or deploy any tracking code blocks (neither Head nor Body scripts) into your PrestaShop website files or theme templates. The module automatically handles all necessary script injections. You only need to extract the specific parameters from the code and save them within the module settings.

Mapping Stape Data to the Module

Once the custom script is generated, you must copy specific parameters into the module configuration in PrestaShop.

Warning

The Stape code below is only an example. Do not use it; you must generate your own unique code within your Stape account.

Example Stape Script With Custom Loader
    <!-- Google Tag Manager -->
    <script>
        (function(w,d,s,l,i){
            w[l]=w[l]||[];
            w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});
            var f=d.getElementsByTagName(s)[0],j=d.createElement(s);
            j.async=true;
            j.src="https://load.xyz.yourdomain.com/2rqhgioesoz.js?"+i;
            f.parentNode.insertBefore(j,f);
        })(window,document,'script','dataLayer','cnfl0o=aWQ9R1RNLVBLQjNIUTM%3D&apiKey=fbf0cf8');
    </script>

    <!-- End Google Tag Manager -->

GTM Configuration Steps

  1. Navigate to the Tag Manager tab in the module configuration.
  2. Script URL: Locate the j.src value in your Stape script. Copy the URL starting from https:// up to the .js extension (excluding the ? and parameters).
    • Example: https://load.xyz.yourdomain.com/2rqhgioesoz.js
  3. Query ID Parameter: Identify the first part of the final string in the script (before the = sign).
    • Example: cnfl0o

  4. Override Tracking ID: Copy the remaining string after the = sign.

    • Example: aWQ9R1RNLVBLQjNIUTM%3D&apiKey=fbf0cf8

    Precise Copying

    When copying these values, ensure no extra spaces are included at the beginning or end of the strings. Extra spaces can cause the script to fail or trigger 404 errors.

  5. Click Save to apply the configuration.

Server Container URL

The Server Container URL routes events to your server-side infrastructure and enables the Tag Assistant feature in GTM for debugging and testing.

Based on the example configuration (using a domain without a custom path), your URL is: https://xyz.yourdomain.com

You must configure this URL in two places to ensure data consistency:

  1. In the Module: Navigate to the Google Analytics 4 tab.
    • Server Container URL: Enter https://xyz.yourdomain.com.
  2. In Server Side GTM: Go to your Server Container > Admin > Container Settings.
    • Server Container URLs: Add https://xyz.yourdomain.com.

Important: No Trailing Slash

Ensure the URL does not end with a trailing slash (e.g., /). Both the PrestaShop module and GTM settings must use the exact same string for the integration to function correctly.

GEO Headers

The GEO Headers power-up sends the visitor's geographic location directly to your server-side container. This feature enhances data accuracy for localized tracking and marketing compliance without relying on third-party browser scripts.

  1. In your Stape dashboard, click sGTM
  2. Select your GTM container.
  3. Click the Power-Ups tab.

  4. In the GEO Headers panel, click Use.

    Stape Power-Ups Interface

  5. Enable the feature.

  6. Click Save Changes.

    Enabling GEO Headers

Configure Headers in GTM Server Container

To use these headers, you must map them inside your GTM Server Container as variables.

  1. Open your GTM Server Container.
  2. Navigate to the Variables section.
  3. Locate the pre-configured variables of type Request Header listed in the table below.
  4. Edit each variable and set the Header Name field to match its corresponding value from the table.
  5. Save the changes.
  6. Click Submit in the top-right corner of the GTM dashboard, then click Publish to deploy the configuration changes to your live container.
Variable Name Header Name
HEADER - User / Address / Country Code X-GEO-Country
HEADER - User / Address / State Code X-GEO-Region
HEADER - User / Address / City X-GEO-City
HEADER - User / Address / Postal Code X-GEO-PostalCode