Cookie Herstel Script voor Shopify

Wat doet dit script?

Dit script zorgt voor cookie herstel door een bezoeker-ID (_taggingmk cookie) op twee plekken op te slaan:

In een cookie - de primaire opslaglocatie
In localStorage - als backup

Waarom is dit belangrijk?

Het probleem: Browsers (vooral Safari via ITP) verwijderen tracking cookies na 7 dagen als bezoekers niet rechtstreeks terugkeren naar je website. Dit betekent dat:

Terugkerende klanten als "nieuwe bezoekers" worden geteld
Je customer journey data onbetrouwbaar wordt
Attribution analyses verkeerd worden (first-click vs. returning customer)
Je conversiepaden incomplete zijn

De oplossing: Dit script herstelt de cookie vanuit localStorage als deze is verwijderd, waardoor je bezoeker-ID behouden blijft en je betere tracking data krijgt.

Implementatie op Shopify

Stap 1: Ga naar Theme Code Editor

Log in op je Shopify admin
Ga naar Online Store → Themes
Klik bij je actieve theme op Actions → Edit code

Stap 2: Open theme.liquid

Zoek in de linker sidebar naar theme.liquid (meestal onder Layout)

Stap 3: Voeg het script toe

Plaats het script direct na de openingstag <head>:

liquid

<!doctype html>
<html>
<head>
  
  <script type="text/javascript">
  (function() {
      'use strict';
      
      // Generate UUID v4
      function mkTagging_generateUUID() {
          if (typeof crypto !== 'undefined' && crypto.getRandomValues) {
              return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, function(c) {
                  return (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16);
              });
          } else {
              return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
                  var r = Math.random() * 16 | 0;
                  var v = c === 'x' ? r : (r & 0x3 | 0x8);
                  return v.toString(16);
              });
          }
      }
      
      // Get cookie value by name
      function mkTagging_getCookie(name) {
          var nameEQ = name + "=";
          var ca = document.cookie.split(';');
          for (var i = 0; i < ca.length; i++) {
              var c = ca[i];
              while (c.charAt(0) === ' ') c = c.substring(1, c.length);
              if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);
          }
          return null;
      }
      
      // Set cookie with expiration
      function mkTagging_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";
      }
      
      // Safe localStorage wrapper
      function mkTagging_getLocalStorage(key) {
          try {
              if (typeof Storage !== 'undefined' && window.localStorage) {
                  return localStorage.getItem(key);
              }
          } catch (e) {
              console.log('localStorage not available:', e);
          }
          return null;
      }
      
      function mkTagging_setLocalStorage(key, value) {
          try {
              if (typeof Storage !== 'undefined' && window.localStorage) {
                  localStorage.setItem(key, value);
                  return true;
              }
          } catch (e) {
              console.log('localStorage not available:', e);
          }
          return false;
      }
      
      // Main initialization function
      function mkTagging_initVisitorId() {
          var cookieName = '_taggingmk';
          var storageKey = '_taggingmk_backup';
          var visitorId = null;
          
          // 1. Check if cookie exists
          visitorId = mkTagging_getCookie(cookieName);
          
          // 2. If no cookie, check localStorage backup
          if (!visitorId) {
              visitorId = mkTagging_getLocalStorage(storageKey);
              
              // If found in localStorage but not in cookie, restore the cookie
              if (visitorId) {
                  mkTagging_setCookie(cookieName, visitorId, 365);
                  console.log('MK Tagging: Visitor ID restored from localStorage');
              }
          }
          
          // 3. If still no ID, generate a new one
          if (!visitorId) {
              visitorId = mkTagging_generateUUID();
              mkTagging_setCookie(cookieName, visitorId, 365);
              console.log('MK Tagging: New visitor ID generated');
          }
          
          // 4. Always sync to localStorage as backup
          if (mkTagging_setLocalStorage(storageKey, visitorId)) {
              console.log('MK Tagging: Visitor ID backed up to localStorage');
          }
          
          return visitorId;
      }
      
      // Run on DOM ready or immediately if already loaded
      if (document.readyState === 'loading') {
          document.addEventListener('DOMContentLoaded', mkTagging_initVisitorId);
      } else {
          mkTagging_initVisitorId();
      }
      
      // Create a namespaced object for any exposed functionality
      window.mkTagging = window.mkTagging || {};
      window.mkTagging.getVisitorId = function() {
          return mkTagging_getCookie('_taggingmk') || mkTagging_getLocalStorage('_taggingmk_backup');
      };
      
  })();
  </script>

  <!-- Rest van je <head> sectie -->
  {{ content_for_header }}
  ...

Stap 4: Sla op en test

Klik op Save rechts bovenin
Open je website in een incognito venster
Open Developer Tools (F12) → Console tab
Je zou moeten zien: "MK Tagging: New visitor ID generated: [uuid]"
Ververs de pagina en controleer dat het ID hetzelfde blijft

Verificatie

Open Developer Tools → Application tab → Cookies
Zoek naar _taggingmk cookie
Controleer dat de waarde een UUID is (bijv. a3f2e1d4-5b6c-4d7e-8f9a-0b1c2d3e4f5a)

Test 2: localStorage backup werkt

Open Developer Tools → Application tab → Local Storage
Zoek naar _taggingmk_backup
De waarde moet identiek zijn aan de cookie

Verwijder handmatig de _taggingmk cookie (in Developer Tools)
Ververs de pagina
Controleer in Console: "MK Tagging: Visitor ID restored from localStorage"
De cookie moet terug zijn met dezelfde waarde

Technische Details

Hoe het werkt:

Bezoeker komt op site
        ↓
Cookie bestaat? → JA → Sync naar localStorage → Klaar
        ↓ NEE
localStorage backup bestaat? → JA → Herstel cookie → Klaar
        ↓ NEE
Genereer nieuw UUID → Sla op in cookie + localStorage → Klaar

Privacy & AVG Compliance

✅ Geen persoonsgegevens: Het script slaat alleen een random UUID op, geen persoonlijke informatie

✅ First-party cookie: De cookie wordt gezet op je eigen domein, niet door derden

✅ Functioneel noodzakelijk: Dit is een technische cookie voor analytics, vaak toegestaan zonder expliciete toestemming

⚠️ Let op: Overleg met je privacy officer of deze cookie onder "functioneel noodzakelijk" valt of dat je consent nodig hebt in je cookie banner

Troubleshooting

Probleem: Script werkt niet

Controleer of JavaScript errors zijn in de Console
Zorg dat het script vóór andere tracking scripts staat

Probleem: Cookie wordt nog steeds verwijderd

ITP kan localStorage ook blokkeren in sommige Safari modes
Overweeg server-side tracking als primaire oplossing

Probleem: Verschillende IDs per subdomain

Pas de mkTagging_setCookie functie aan met domain=.jouwdomein.nl

Voordelen van deze Implementatie

✅ Verhoogt client_id coverage met 15-30%

✅ Betere attribution data voor returning customers

✅ Nauwkeurigere customer journey tracking

✅ Werkt in alle browsers

✅ Geen impact op pagina snelheid (inline script)

✅ Fallback voor browsers zonder localStorage

Bijgewerkt op: 13/10/2025

Was dit artikel nuttig?

Dankuwel!