In dit artikel nemen we je stap voor stap mee door het proces van het instellen van server-side tagging voor een Shopware webshop, zodat je eenvoudig de juiste instellingen kunt maken en optimaal gebruik kunt maken van de mogelijkheden die Server-Side Tagging biedt.

Stappen voor Implementatie

1. Server container opzetten

Als je nog geen account binnen de trytagging-omgeving hebt, maak je die eerst aan. Binnen dat account maak je een nieuwe server container aan.

Voor het aanmaken van deze server container wordt er een connectie met een Google Tag Manager server container gemaakt. Heb je die nog niet? Volg dan deze stappen.

Als de server container aangemaakt is, zal je nog een CNAME record toe moeten voegen aan de DNS instellingen van je domein. Hoe je dat doet, lees je in dit helpdesk-artikel.

2. Informatie verzamelen

Voordat je start met de implementatie van server-side tagging wil je natuurlijk weten wat je in moet stellen en voor welke marketing en analytische platformen je dit moet doen. Daarom start je allereerst met het onboarden van je klant.

Binnen de trytagging-omgeving kan je een klant-onboarding starten en delen met je klant of met een collega. In deze onboarding worden de juiste GTM containers opgegeven, de juiste GA4 property geselecteerd, etc.

Volg deze stappen om een klant-onboarding te starten.

3. Shopware plugin instellingen voor GA4 + remarketing

Installeer de volgende plugin

In deze plugin voer je onderstaande stappen uit:

Zet alles uit behalve enhanced ecommerce en hash enhanced conversion.

4. AdPage Webhooks instellen in Shopware

Stel de Webhooks voor het Purchase event in. Dit kun je doen door via composer de webhook te implementeren. Hierbij de locatie van de plugin. Vraag je webbeheerder als je zelf de plugin via composer er niet op kunt zetten.

5. Verkoopkanaal instellen

Shopware werkt zo dat er voor elk verkoopkanaal een aparte configuratie is. Dat kan een apart domein zijn. Per verkoopkanaal kun je een plugin instellen. Je kunt dus per kanaal de configuratie inregelen.

Bijvoorbeeld het “domeinx” verkoopkanaal is gewoon voor domeinx.nl maar er komt bijvoorbeeld ook een apart verkoopkanaal (domeinx zakelijk) binnen het domein domeinx dat straks bereikbaar gaat worden met de url: https://www.domeinx.nl/zakelijk of https://www.domeinx.nl/werkkleding

Kies de verkoopkanalen waarvan je de transacties wilt doorzetten naar de online marketingplatformen. Je kunt per kanaal de tagging url aanpassen.
Ga je achteraf de verkoopkanalen aanpassen dan kun je deze ook in de plugin aanpassen. Belangrijk is dus nog dat de tagging URL voor het domein overeenkomt in het tagging platform.

5. Tagging Pixel instructies genereren

Binnen je trytagging-omgeving kan je de instructies genereren voor een tagging pixel. Een tagging pixel is een gemodificeerde versie van een standaard Google Tag Manager script waarmee je ook AdBlocker-gebruikers kan tracken.

In het overzicht van je server container op trytagging klik je op de optie Pixel installatie. Hier vul je jouw Google Tag Manager web container ID in en selecteer je Custom als type CMS.

Het <head> en <body> script wat gegenereerd wordt, voeg je toe aan de site-code van je Shopware webshop ter vervanging van de standaard Google Tag Manager <head> en <body> scripts.

7. Google Tag Manager instellingen

Nu dat je een server container op trytagging hebt toegevoegd, alle informatie van hetgeen wat je in moet stellen verzameld hebt, en een functionerende eCommerce dataLayer + Webhooks ingesteld hebt op je Shopware shop, kunnen we door met de tracking regels intellen op Google Tag Manager.

7.1 Toevoegen van custom code voor webhooks

Voor webhooks en ons ons user_data event is nog de volgende custom html nodig in tagmanager. Zorg ervoor dat je [DOMEIN] aanpast met het domein dat je hebt gekoppeld in het AdPage Tagging dashboard. bijvoorbeeld tagging.adpage.nl

<script src="https://[DOMEIN]/user-data-minified.js" defer></script>
<script type="text/javascript">
(function() {
  if (window._trytagging_user_data_initialized) {
    return;
  }
  window._trytagging_user_data_initialized = true;

  var dataProcessed = false;

  function base64Encode(str) {
    try {
      if (typeof btoa !== 'undefined') {
        return btoa(unescape(encodeURIComponent(str)));
      }
    } catch (e) {
      console.warn('Base64 encoding failed:', e);
    }
    return str;
  }

  function setCookie(name, value, days) {
    var expires = "";
    if (days) {
      var date = new Date();
      date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
      expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + value + expires + "; path=/; SameSite=Lax";
  }

  function processUserData() {
    if (dataProcessed) {
      console.log('trytagging_user_data already processed, skipping');
      return false;
    }

    try {
      if (typeof window.taggingHelpers === 'undefined' || 
          typeof window.taggingHelpers.getMarketingObject !== 'function') {
        console.warn('taggingHelpers not available yet');
        return false;
      }

      var marketingData = window.taggingHelpers.getMarketingObject();
      
      if (!marketingData) {
        console.warn('No marketing data available');
        return false;
      }

      dataProcessed = true;

      window.dataLayer = window.dataLayer || [];
      window.dataLayer.push({
        event: "trytagging_user_data",
        marketing: marketingData,
        device: typeof window.taggingHelpers.getDeviceInfo === 'function' 
          ? window.taggingHelpers.getDeviceInfo() 
          : {}
      });

      var jsonString = JSON.stringify(marketingData);
      var base64Data = base64Encode(jsonString);
      
      setCookie('trytagging_user_data', base64Data, 30);
      
      console.log('trytagging_user_data processed and cookie set');
      
      if (fallbackTimeout) {
        clearTimeout(fallbackTimeout);
      }
      if (secondFallbackTimeout) {
        clearTimeout(secondFallbackTimeout);
      }
      
      return true;
      
    } catch (error) {
      console.error('Error processing user data:', error);
      dataProcessed = true;
      return false;
    }
  }

  var fallbackTimeout;
  var secondFallbackTimeout;

  if (document.addEventListener) {
    document.addEventListener("trytagging_user_data_ready", function(event) {
      if (!dataProcessed) {
        processUserData();
      }
    }, { once: true });
  } else if (document.attachEvent) {
    // IE8 en ouder
    var ieHandler = function() {
      if (!dataProcessed) {
        processUserData();
        document.detachEvent("ontrytagging_user_data_ready", ieHandler);
      }
    };
    document.attachEvent("ontrytagging_user_data_ready", ieHandler);
  }

  // Fallback: probeer ook direct uit te voeren als data al beschikbaar is
  fallbackTimeout = setTimeout(function() {
    if (!dataProcessed && 
        typeof window.taggingHelpers !== 'undefined' && 
        typeof window.taggingHelpers.getMarketingObject === 'function') {
      processUserData();
    }
  }, 100);
})();
</script>

GTM web container stappen:

Google Tag configureren: stappenplan
GA4 event tags instellen: stappenplan
Consent Management platform instellen: stappenplan

GTM server container stappen:

GA4 client instellen: stappenplan
GA4 tag instellen: stappenplan
Marketing platform tags instellen:
- Meta Ads: stappenplan
- Google Ads: stappenplan
- TikTok Ads: stappenplan
- Pinterest Ads: stappenplan
Webhook Client instellen: stappenplan
GA4 Webhook tag instellen: stappenplan

AdPage tracking boosts

Onderstaande stappen zorgen voor een extra Tracking Boost:

Stel Profit on Adspend in combinatie met GA4 en Google Ads in: stappenplan
Google Ads API tag op basis van webhooks: stappenplan

[Shopware] Stappen voor een ultieme tracking setup