Een aangepaste Google Tag Manager-pixel aanmaken

Je kunt Google Tag Manager (GTM) gebruiken als een aangepaste pixel om je pixels van derden te beheren.

Wanneer je er klaar voor bent om je aangepaste GTM-pixel te testen, gebruik je de Shopify Pixel Helper om ervoor te zorgen dat alle gebeurtenissen die je wilt volgen, zonder fouten aan de sandbox worden toegevoegd.

Je kunt ook de pagina-extensie Google Tag Assistant gebruiken om te testen welke Google-tags op de pagina worden geladen. De Troubleshoot tag-functie van Google Tag Assistant is echter niet compatibel met aangepaste pixels en detecteert geen Google-tags in een aangepaste pixel of andere pixels die door GTM worden geladen.

Opmerking

Voordat je een aangepaste pixel aanmaakt, is het raadzaam beschikbare apps te bekijken voor verbeterde stabiliteit, beveiliging en prestaties. Maar als je geen app kunt vinden die aan jouw wensen voldoet, kun je Google Tag Manager als aangepaste pixel gebruiken.

Voorbereiden om een aangepaste pixel aan te maken

Lees de volgende informatie goed door om er zeker van te zijn dat je begrijpt hoe je je pixel configureert met behulp van Google Tag Manager voordat je een aangepaste pixel aanmaakt:

• Maak of open een Google Tag Manager-account en ontvang de container-ID van GTM.
• Voor de veiligheid hebben tag managers die in onze sandbox zijn geladen, dezelfde beperkingen als alle andere pixels. Meer informatie over sandboxbeperkingen voor pixels.

Een aangepaste Google Tag Manager-pixel aanmaken

Je kunt een aangepaste pixel voor Google Tag Manager maken om je pixels van derden te beheren.

Opmerking

Dit is een uitgebreide tutorial en wordt niet ondersteund door Shopify. Als je hulp nodig hebt bij het toevoegen van een aangepaste pixel, kun je een Shopify-partner inhuren.

Stappen:

1. Open je Google Tag Manager-account en selecteer het account waarmee je een aangepaste pixel wilt instellen.
2. Klik op Beheerder en klik vervolgens op Google Tag Manager installeren om de installatiecode te openen.
3. Kopieer het codeblok dat in het kopgedeelte van een pagina hoort.
4. Verwijder de HTML-tags uit het codeblok. Bijvoorbeeld <script></script>.
5. Plaats de resterende code in een nieuwe aangepaste pixel van Shopify.
6. Neem een abonnement op aangepaste gebeurtenissen en push naar de GTM-dataLayer.
7. In het voorbeeld van de aangepaste pixel van Google Tag Manager kun je zien hoe de code zou moeten worden weergegeven.
8. Configureer Google Tag Manager om gebeurtenissen van je aangepaste pixel te accepteren.
9. Optioneel: Als je bestaande dataLayer.push(gebeurtenis)-aanroepen hebt in het checkout.liquid-bestand, vervang je dit door analytics.publish().

Abonneren op klantgebeurtenissen en pushen naar de GTM-datalayer

Je kunt je abonneren op klantgebeurtenissen met behulp van de GTM-dataLayer in je aangepaste pixelcode.

Er is een reeks standaard klantgebeurtenissen waar je je op kunt abonneren. Als je echter klantgebeurtenissen wil volgen die geen deel uitmaken van het standaard gebeurtenisaanbod, kun je je eigen aangepaste gebeurtenissen publiceren vanuit Liquid-templatebestanden.

Hieronder zie je een voorbeeld van het abonneren op de standaard 'product_viewed'-gebeurtenis, die aangeeft wanneer iemand een product bekijkt. Wanneer de gebeurtenis wordt geactiveerd, wordt de gebeurtenis naar de dataLayer gepusht.

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    product_title: event.data?.productVariant?.title,
  });
});

In dit voorbeeld wordt de producttitel doorgegeven in de payload van de gebeurtenis. Met een Google Tag Manager-variabele leg je de producttitel van de gebeurtenispayload vast in de gekozen tag.

Voorbeeld van een aangepaste Google Tag Manager-pixel

Het onderstaande voorbeeld is een vereenvoudigde versie van een aangepaste Google Tag Manager-pixel die laat zien hoe je gegevens kunt verzenden naar Google Tag Manager. Als je meer gebeurtenissen naar de dataLayer wil pushen, kun je je abonneren op meer standaard- en aangepaste gebeurtenissen.

Opmerking

Deze pixel bevat ook voorbeeldinstellingen die Google Consent Mode v2 weerspiegelen. Dit is een mode waarmee een pixel de cookie-toestemmingskeuzes van een bezoeker voor verkeer, inclusief de Europese Economische Ruimte (EER) (EER), kan respecteren. Meer informatie over toestemmingsmodi van Google Ads help.

Deze voorbeeldinstellingen komen mogelijk niet overeen met de vereisten voor je winkel op basis van de privacywetgeving in jouw regio. Als je hulp nodig hebt bij het toevoegen of aanpassen van toestemmingsinstellingen in je aangepaste pixel, raadpleeg dan de handleiding Mode instellen op de website van Google of huur een Shopify-partner in.

// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

//Initialize GTM tag
(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),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer', 'GTM-XXXXXXX');

//Google Consent Mode v2
gtag('consent', 'update', {
  'ad_storage': 'granted',
  'analytics_storage': 'granted',
  'ad_user_data': 'granted',
  'ad_personalization': 'granted',
});

//subscribe to events
analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("payment_info_submitted", (event) => {
  window.dataLayer.push({
    event: "payment_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_shipping_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_shipping_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_address_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_address_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_contact_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_contact_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_started", (event) => {
  window.dataLayer.push({
    event: "checkout_started",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("product_added_to_cart", (event) => {
  window.dataLayer.push({
    event: "product_added_to_cart",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    price: event.data?.cartLine?.merchandise?.price?.amount,
    currency: event.data?.cartLine?.merchandise?.id,
    product_title: event.data?.cartLine?.merchandise?.product?.title,
    quantity: event.data?.cartLine?.quantity,
    total_cost: event.data?.cartLine?.cost?.totalAmount?.amount,
  });
});

analytics.subscribe("cart_viewed", (event) => {
  window.dataLayer.push({
    event: "cart_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    total_cost: event.data?.cart?.cost?.totalAmount?.amount,
    quantity: event.data?.cart?.totalQuantity,
    cart_id: event.data?.cart?.id,
  });
});

analytics.subscribe("page_viewed", (event) => {
  window.dataLayer.push({
    event: "page_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    page_title: event.context.document.title,
  });
});

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    product_id: event.data?.productVariant?.product?.id,
    product_title: event.data?.productVariant?.title,
    product_sku: event.data?.productVariant?.sku,
  });
});

analytics.subscribe("search_submitted", (event) => {
  window.dataLayer.push({
    event: "search_submitted",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    query: event.data?.searchResult?.query,
  });
});

analytics.subscribe("collection_viewed", (event) => {
  window.dataLayer.push({
    event: "collection_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    collection_id: event.data?.collection?.id,
    collection_title: event.data?.collection?.title,
  });
});

Google Tag Manager configureren om gebeurtenissen van je aangepaste pixel te accepteren

Nadat je je aangepaste pixel hebt aangemaakt, configureer je Google Tag Manager om gebeurtenissen van je aangepaste pixel te accepteren. Hiervoor heb je een tag, een trigger en dataLayer-variabelen in Google Tag Manager nodig.

Enkele voorbeelden van standaard klantgebeurtenissen en hun Google Tag Manager-equivalenten worden vermeld in de volgende tabel:

Lijst met standaard Shopify-klantgebeurtenissen voor gebruik met pixels, vergeleken met de equivalente klantgebeurtenissen in Google Tag Manager, plus de trigger die vereist is om de gebeurtenissen te activeren.

Shopify-gebeurtenis	Activeren	GTM-gebeurtenis
payment_info_submitted	Betalingsgegevens indienen	add_payment_info
checkout_address_info_submitted	Verzendgegevens indienen	add_shipping_info
product_added_to_cart	Een artikel aan winkelwagen toevoegen	add_to_cart
checkout_started	Checkout starten	begin_checkout
checkout_completed	Checkout voltooien	koop
product_removed_from_cart	Artikel uit winkelwagen verwijderen	remove_from_cart
cart_viewed	Winkelwagen bekijken	view_cart
product_viewed	Pagina met productgegevens bekijken	view_item
collection_viewed	Een lijst met artikelen bekijken	view_item_list

Parameters van een tag-gebeurtenis in GTM moeten overeenkomen met verwachte benamingsconventies, anders worden de dataLayer-gebeurtenissen van je aangepaste pixel niet verwerkt.

Hier volgen enkele voorbeelden van eigenschappen van dataLayer-gebeurtenissen van aangepaste pixels en de equivalente gebeurtenisparameters in Google Analytics 4 (GA4):

Lijst met dataLayer-gebeurtenissen van aangepaste pixels volgens de benamingsconventie van GA4

dataLayer-gebeurtenissen van aangepaste pixels	Parameters van GA4-gebeurtenissen
event.data?.checkout?.currencyCode	valuta;
event.data?.checkout?.totalPrice?.amount	waarde
event.data?.checkout?.order?.id	transaction_id
event.data?.checkout?.discountAllocations	coupon
event.data?.checkout?.shippingLine?.price?.amount	verzending
event.data?.checkout?.totalTax	belasting
event.data?.checkout?.lineItems	artikelen

Hier is een voorbeeld met de volgende checkout_completed-gebeurtenis:

analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    price: event.data.checkout.totalPrice.amount,
    shippingLine: event.data.checkout.shippingLine.price.amount,
    totalTax: event.data.checkout.totalTax,
  });
});

De Google Tag Manager-trigger is een aangepast gebeurtenistype met de naam checkout_completed. Zorg dat het veld Gebeurtenisnaam in de trigger overeenkomt met de gebeurtenissleutel in de aangepaste pixel.

orderId en valuta zijn de variabelen waarmee je in Google Tag Manager de gegevens van de gebeurtenis vastlegt. Je kunt deze toewijzen aan een dataLayer-variabele in Google Tag Manager. Voor elke gebeurtenisvariabele is een aparte dataLayer-variabele vereist. Stel de trigger in zodat deze wordt geactiveerd bij alle aangepaste gebeurtenissen.

Maak een tag aan die de trigger gebruikt die je net hebt gemaakt. Voeg onder gebeurtenisparameters de variabelen toe die je wil vastleggen. In het bovenstaande voorbeeld worden orderId, currency, price, shippingLine en totalTax als dataLayer-variabelen ingesteld. Elke keer dat de tag actief wordt, legt deze de dataLayer-variabelen met de gebeurtenis vast.

Hou er rekening mee dat de gegevensoverdracht alleen plaatsvindt als ten minste een tag en trigger zijn ingesteld in Google Tag Manager.

Oude dataLayer.push(event)-aanroepen vervangen door analytics.publish()

Als je eerder Google Tag Manager hebt ingesteld, vervang je je dataLayer.push-aanroepen door Shopify.analytics.publish()-aanroepen. Je kunt je dataLayer.push-aanroepen vinden in je theme.liquid-bestanden in de sectie Opmaak van de themabewerker.

Vervang ook de dataLayer.push-aanroepen in checkout.liquid. Maar omdat checkout.liquid niet compatibel is met Shopify Extensions, moet je een UI-extentie gebruiken om gegevens naar webpixels te pushen.

Hieronder zie je een vereenvoudigd voorbeeld van een aangepaste e-mailaanmeldingsgebeurtenis die wordt gevolgd met behulp van dataLayer in theme.liquid-bestanden.

<script>
  dataLayer.push({ event: 'email_signup', email: customer.email });
</script>

Het Shopify-equivalent wordt op deze manier weergegeven, waarmee de gegevens in je aangepaste pixel worden gepusht.

<script>
  Shopify.analytics.publish('email_signup', {email: customer.email });
</script>

Daarna voeg je in je aangepaste pixelcode iets als dit toe.

analytics.subscribe("email_signup", (event) => {
  window.dataLayer.push({
   'event': 'email_signup',
   'email': event.customData.email,
  });
});

Oude dataLayer.push(data) vervangen

Google Tag Manager heeft een functie waarmee je bij elke gebeurtenis een stateful dataLayer-object kunt pushen. Hoewel de pixel-sandbox van Shopify geen vergelijkbare functie heeft, kun je hetzelfde resultaat bereiken door je eigen dataobject aan te maken en dit door te geven in aangepaste gebeurtenissen.

Definieer bijvoorbeeld een 'customData'-object voordat een van je aangepaste gebeurtenissen wordt gepubliceerd.

<script>
  const customData = {email: customer.email}
</script>

Geef deze gegevens door in je publicatiemethode wanneer je je aangepaste gegevens wil opnemen.

<script>
  Shopify.analytics.publish('email_signup', customData);
</script>

Opmerking

Shopify biedt momenteel geen ondersteuning voor het toevoegen van aangepaste gegevens aan standaardgebeurtenissen. Als je dit nodig hebt, kun je je eigen aangepaste gebeurtenissen publiceren om standaardgebeurtenissen te vervangen.

Tips voor het instellen van Google Analytics 4

Gebruik de volgende tips voor het instellen van Google Analytics 4 (GA4) bij het gebruik van Google Tag Manager als een aangepaste pixel.

Nettere pagina-URL's

Wanneer GA4 wordt uitgevoerd in een sandbox, zie je mogelijk dat de pagina-URL's informatie bevatten over de sandbox waarin deze wordt uitgevoerd. Als je de sandbox-gegevens uit die URL's wilt verwijderen, kun je de automatische paginatracking van GA4 uitschakelen en in plaats daarvan je eigen gegevens implementeren door de standaardgebeurtenis page_viewed te gebruiken.

analytics.subscribe('page_viewed', (event) => {
  window.dataLayer.push({
   'event': 'page_viewed',
   'page_location': event.context.window.location.href,
   'page_title': event.context.document.title,
  });
});

Nadat je je eigen gebeurtenis hebt gepubliceerd naar dataLayer, kun je een GA4-tag genaamd page_view aanmaken die wordt getriggerd bij de gebeurtenis page_viewed. Meestal kun je het tagtype Google Analytics: GA4-gebeurtenis gebruiken en de naam van de gebeurtenis instellen op page_view. Nadat je het tagtype en de gebeurtenisnaam hebt ingesteld, voeg je een parameter voor page_location toe en stel je de waarde in op dezelfde waarde die je in de dataLayer van de aangepaste pixel hebt doorgegeven.

Verbeterde afmetingen

Wanneer je GA4 in de pixelsandbox van Shopify laadt, is het nodig dat sommige gebeurtenissen die normaal gesproken automatisch worden afgeleid, handmatig worden ingesteld. Als onderdeel van de instelling voor verbeterde metingen van GA4, kunnen bijvoorbeeld uitgaande linkklikken om veiligheidsredenen niet automatisch worden geactiveerd bij het gebruik van aangepaste pixels. Maar je kunt wel zelf de verbeterde meetgebeurtenissen van GA4 als aangepaste gebeurtenissen implementeren.

De onderstaande code bevat een vereenvoudigd voorbeeld van het volgen van uitgaande linkklikken.

<script>
  function detectOutboundLink() {
    // add your logic for determining if a link click is outbound

    // if the link click is outbound then publish it
    if (isOutboundLink) {
      Shopify.analytics.publish('outbound_link', { link_url: link_url });
    }
  }
</script>

Maak ten slotte in GTM een GA4-tag aan die de linkklik naar GA4 stuurt, door ervoor te zorgen dat de naam van de gebeurtenis click is, zodat deze overeen komt met de verbeterde naamgeving voor evenementen van GA4.

Je kunt dezelfde tracking bereiken voor een van de verbeterde meetstatistieken van Google.

Je aangepaste pixel testen en bugs oplossen

Wanneer je er klaar voor bent om je aangepaste GTM-pixel te testen, gebruik je de Shopify Pixel Helper om ervoor te zorgen dat alle gebeurtenissen die je wilt volgen, zonder fouten aan de sandbox worden toegevoegd.

Je kunt ook de pagina-extensie Google Tag Assistant gebruiken om te testen welke Google-tags op de pagina worden geladen. De Troubleshoot tag-functie van Google Tag Assistant is echter niet compatibel met aangepaste pixels en detecteert geen Google-tags in een aangepaste pixel of andere pixels die door GTM worden geladen.