> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.pandectes.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Google Consent Mode in een Shopify custom pixel (Google Tag Manager)

### Overzicht

Sommige winkels laden een Google Tag Manager (GTM)-container vanaf een **Shopify custom pixel** (**Settings > Customer events**) in plaats van, of naast, vanuit de storefront. Dit artikel laat zien hoe je Google Consent Mode Advanced toepast op de tags die die container afvuurt.

Met GTM hoef je maar weinig code te schrijven. Twee regels bovenaan de pixel geven de toestemming van de bezoeker door aan de **Pandectes CMP**-tag in je container, en de tag doet de rest.

Als je geen GTM gebruikt en Google Analytics 4 of Google Ads rechtstreeks laadt met `gtag.js`, gebruik dan in plaats daarvan [Google Consent Mode in een Shopify custom pixel (gtag.js)](https://help.pandectes.io/nl/article/google-consent-mode-in-a-shopify-custom-pixel-gtagjs-10pqs2d/). Gebruik voor een Google-eigenschap altijd maar een van beide aanpakken, nooit beide.

### Voordat je begint

* **De Pandectes CMP-tag moet in je container staan.** Voeg hem toe vanuit de GTM Template Gallery, laat hem afvuren op **Consent Initialization - All Pages**, en stel de toestemming in die elke tag nodig heeft. De stappen staan in [Integratie met Google Tag Manager (GTM) - Officiële Pandectes-template](https://help.pandectes.io/nl/article/integratie-met-google-tag-manager-gtm-officiele-pandectes-sjabloon-1pz5tw0/).
* **Stel eerst de storefront-kant in.** De pixel dekt alleen wat binnen de pixel draait. Google-tags op de storefront zelf stel je in zoals beschreven in [Google Tag Manager instellen met Pandectes](/en/article/how-to-set-up-google-tag-manager-with-pandectes-1w5g3hv/).
* **Controleer je abonnement.** Google Consent Mode en de Pandectes CMP-tag werken vanaf het **Plus**-abonnement en hoger.

### Waarom de pixel een eigen toestemmingsinstelling nodig heeft

Een Shopify custom pixel draait in een afgeschermd iframe met zijn eigen `window` en zijn eigen `dataLayer`. Die staat los van de storefront-pagina, en toestemming die in de ene is ingesteld, is in de andere niet zichtbaar.

Een container die in de pixel wordt geladen, kan dus de toestemming die de storefront al heeft niet zien. De twee regels hieronder geven die toestemming door. Alles in dit artikel geldt **alleen binnen de pixel**.

### De twee regels

Zet deze regels **helemaal bovenaan** de custom pixel, vóór het GTM-fragment en vóór al het andere:

```javascript
window.pandectesPixelInit = init;
window.pandectesSubscribe = api.customerPrivacy.subscribe;
```

Dat is de volledige toestemmingsinstelling. De Pandectes CMP-tag in je container leest ze, past de juiste standaard toestemmingsstatus voor de bezoeker toe, en werkt die bij zodra de bezoeker zijn keuze in de banner wijzigt. Je hoeft geen `default`- of `update`-commando's te schrijven of een lijst met regio's bij te houden: de tag haalt het beleid uit je bannerinstellingen.

Twee plaatsingsregels:

* **De regels komen eerst.** De tag leest ze wanneer de container start. Als het GTM-fragment eerder draait, is er niets om te lezen.
* **De regels staan in dezelfde pixel als de container.** Elke custom pixel is een eigen sandbox. Ze in de ene pixel instellen heeft geen effect op een container die in een andere pixel is geladen.

### Geavanceerde modus en de pixel-toestemming

Met deze opzet krijg je **Google Consent Mode Advanced**: de container laadt bij elke paginaweergave, de tags sturen cookieloze pings zolang de toestemming is geweigerd, en schakelen over op volledige meting zodra de toestemming is verleend.

Daarvoor moet de pixel vóór toestemming mogen draaien. Ga in Shopify Admin naar **Settings > Customer events**, open je custom pixel, en stel onder **Customer privacy** **Permission** in op **Not required**. Als je het op **Required** zet, houdt Shopify de pixel tegen tot de bezoeker accepteert, laadt de container nooit en worden er geen cookieloze pings verstuurd.

Als je liever **Basic mode** wilt (niets laadt tot er toestemming is gegeven), zet **Permission** op **Required**, selecteer de categorieën die je nodig hebt, en laat Shopify de pixel tegenhouden.

### De pixelcode

1. Ga in Shopify Admin naar **Settings > Customer events** en klik op **Add custom pixel**.
2. Geef de pixel een naam en plak de onderstaande code.
3. Vervang `GTM-XXXXXXX` door je container-ID.
4. Voeg onderaan je eigen event-abonnementen toe.
5. Stel de toestemming in zoals hierboven beschreven, klik op **Save**, en daarna op **Connect**.

```javascript
/* Pandectes consent handover.
 * Keep these two lines at the very top, above the GTM snippet.
 * The Pandectes CMP tag in your container reads them. */
window.pandectesPixelInit = init;
window.pandectesSubscribe = api.customerPrivacy.subscribe;

/* START_MODIFY_FOR_YOUR_STORE */
const GTM_ID = "GTM-XXXXXXX"; // your container ID
/* END_MODIFY_FOR_YOUR_STORE */

/* Load the GTM container inside the pixel sandbox.
 * This dataLayer is not shared with the storefront or other pixels. */
window.dataLayer = window.dataLayer || [];

(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_ID);

/* YOUR EVENT SUBSCRIPTIONS GO HERE, IN THIS SAME PIXEL.
 *
 * The code above sets consent and loads the container. On its own it
 * pushes nothing to the dataLayer.
 *
 * The example below is sample code only, adapted from Shopify's GTM
 * tutorial. Adapt the events and fields to your own GTM triggers.
 * Shopify's original also pushes email, phone and address. Those are
 * left out on purpose: putting personal data in the dataLayer is a
 * privacy decision you need to make for your own store. */

// 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,
//     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,
//   });
// });
```

Elk event dat je verstuurt heeft een bijpassende **Custom Event**-trigger in GTM nodig, met exact dezelfde naam als de `event`-sleutel (`checkout_completed` in het voorbeeld).

||| **Pandectes levert alleen de toestemmingslaag.** De twee regels stellen alleen de toestemmingsstatus in en verder niets. Welke events je verstuurt, welke gegevens ze bevatten, hoe je GTM-tags en triggers zijn ingesteld, en of je Google Analytics- of Google Ads-rapportage klopt, is jouw verantwoordelijkheid. Pandectes ondersteunt of verifieert de tracking die bovenop deze code is gebouwd niet.

### Elke pixel die een container laadt, heeft de twee regels nodig

Je kunt de twee regels niet in de ene custom pixel zetten en de container in een andere laden. Elke pixel is een aparte sandbox. Een container die in een pixel zonder de twee regels wordt geladen, heeft geen toestemmingsstatus, en zijn tags vuren af volgens de standaardwaarden van Google zonder waarschuwing.

Hetzelfde geldt voor je event-abonnementen: die moeten in dezelfde pixel staan, onder het GTM-fragment.

### Controleer of het werkt

#### Tag Assistant en GTM Preview kunnen de pixel niet zien

Noch Google Tag Assistant, noch de **Preview**-modus van GTM maakt verbinding met een container die in de pixel-sandbox draait. Ze inspecteren alleen de storefront-pagina, dus ze melden niets (of alleen de eigen tags van de storefront), ook als de pixel correct werkt. Dit is normaal en geen fout.

#### Controleer de dataLayer in het frame van de pixel

1. Open Chrome DevTools en ga naar het tabblad **Console**.
2. Open in de consolebalk het frame-menu (dat meestal `top` toont) en selecteer het sandbox-frame van de pixel (de naam begint met `web-pixel`). Shopify maakt één frame per custom pixel, dus kies het juiste frame als je er meerdere hebt.
3. Voer onderstaande controles uit.

In het `top`-frame is `dataLayer` de dataLayer van de storefront, die niets over de pixel vertelt.

* **Zijn de twee regels ingesteld?** `window.pandectesPixelInit` en `window.pandectesSubscribe` moeten allebei gedefinieerd zijn.
* **Komt toestemming vóór de tags?** In `dataLayer` moeten de toestemmingsregels verschijnen voordat je tags afvuren.
* **Laadt de pixel vóór toestemming?** Dat moet, voor de Geavanceerde modus. Als de container pas verschijnt nadat de bezoeker accepteert, staat de pixel-toestemming op **Required** en werk je in de Basismodus.
* **Komen je events aan?** Plaats een testbestelling en controleer of het event verschijnt in `dataLayer` met de naam die je GTM-trigger verwacht.

### Veelgemaakte fouten

| Fout | Wat er gebeurt |
| --- | --- |
| De twee regels staan na het GTM-fragment | De tag heeft niets om te lezen wanneer de container start. Tags vuren af volgens de standaardwaarden van Google. |
| De twee regels staan in de ene pixel en de container in een andere | Afzonderlijke sandboxes. De container heeft geen toestemmingsstatus. |
| De Pandectes CMP-tag staat niet in de container | De regels zijn ingesteld, maar niets leest ze. Geen consent mode in GTM. |
| Pixel **Permission** ingesteld op **Required** | Shopify houdt de pixel tegen tot toestemming, dus de container laadt nooit eerder. Dat is de Basismodus, niet de Geavanceerde modus. |
| Testen met Tag Assistant of GTM Preview | Ze zien de pixel-sandbox niet en melden niets, ook als alles werkt. |
| `dataLayer` lezen in het `top`-frame | Dat is de dataLayer van de storefront, niet die van de pixel. |
| Geen GTM **Custom Event**-trigger voor een verstuurd event | Het event bereikt de dataLayer, maar geen enkele tag vuurt af. |
| Shopify's voorbeeldevent ongewijzigd overnemen | Eventnamen en velden die niet overeenkomen met je triggers, en persoonsgegevens in de dataLayer. |
| Dezelfde eigenschap geladen vanuit deze pixel en vanuit een gtag.js-pixel | Dubbele hits en twee concurrerende toestemmingsstatussen. |

### Instellingen die dit artikel niet behandelt

Instellingen zoals `url_passthrough`, `ads_data_redaction`, `allow_enhanced_conversions` en `restricted_data_processing` stel je in GTM in (op de Pandectes CMP-tag of op je eigen tags), niet in de pixel.

Pandectes kan hierover geen advies geven. De juiste waarden hangen af van je Google Ads- en Analytics-accounts, de modellering waarop je vertrouwt, en de juridische positie van je bedrijf. Bespreek ze met degene die je Google-instellingen beheert, of met je juridisch adviseur als er een privacyvraag speelt.