> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Klaviyo add-to-cart-eventtracking in Upcart

> Dit artikel legt uit hoe je nauwkeurige Klaviyo-eventtracking inschakelt wanneer klanten artikelen aan hun winkelwagen toevoegen met Upcart.

<div id="overview">
  # Overzicht
</div>

Standaard neemt Upcart de cartfunctionaliteit van Shopify over, wat kan voorkomen dat apps van derden zoals **Klaviyo** cartupdates detecteren. Gelukkig zijn er twee betrouwbare manieren om **Add to Cart (ATC)**-tracking in Klaviyo te herstellen terwijl Upcart actief blijft.

Zorg er voordat je begint voor dat **Klaviyo Onsite Tracking** correct is geconfigureerd. Je kunt hun installatiehandleiding hier volgen:\
👉 [Klaviyo Onsite Tracking installatiehandleiding](https://help.klaviyo.com/hc/en-us/articles/4425956184731)

***

<div id="option-1-use-ajax-compatibility-fastest-setup">
  ## Optie 1: Gebruik AJAX-compatibiliteit (snelste opzet)
</div>

Upcart bevat een instelling die de compatibiliteit met andere apps herstelt door het native cartupdategedrag van Shopify beschikbaar te maken. Wanneer dit is ingeschakeld, kan Klaviyo weer luisteren naar Add to Cart-events.

<div id="how-to-enable">
  ## Zo schakel je het in:
</div>

1. Ga naar **Upcart > Cart Editor > Settings > Cart settings**
2. Scrol naar **Advanced Settings** en klap deze uit
3. Vink **Enhanced Ajax API compatibility** aan
4. Klik op **Save** en test het resultaat

⚠️ **Belangrijk: afwegingen bij Enhanced AJAX API Compatibility**\
Deze instelling is voor de meeste winkels **standaard uitgeschakeld**. Schakel deze ALLEEN in als je winkel een niet-standaard AJAX-cart-API gebruikt en Upcart de add-to-cart-events niet onderschept. Wanneer ingeschakeld, krijgen andere apps meer controle over het cartgedrag, wat redirect-loops kan veroorzaken of klanten naar de Shopify-cartpagina kan sturen in plaats van de Upcart-drawer te openen. Als het inschakelen van deze instelling redirects veroorzaakt, schakel deze dan uit en stap over op **Optie 2**, met de handmatige Upcart API (`upcartRegisterAddToCart`).

Voor volledige richtlijnen over deze instelling, zie [Enhanced AJAX API Compatibility](/nl/upcart/enhanced_ajax_api_compatibility).

***

<div id="option-2-recommended-add-a-custom-klaviyo-script">
  ## Optie 2 (aanbevolen): Voeg een aangepast Klaviyo-script toe
</div>

Deze methode geeft je het beste van twee werelden: **Upcart houdt de volledige controle** en **Klaviyo-tracking blijft werken**.

<div id="steps">
  ## Stappen:
</div>

1. Open **Upcart > Cart Editor > Settings**
2. Scrol omlaag naar de sectie **Custom HTML**
3. Kies in de dropdown **Scripts (Before Load)**
4. Plak het volgende script:

Moderne API (aanbevolen):

```
<script>
  function TrackATC(){
    var _learnq = window._learnq || [];
    _learnq.push(['track', 'Added to Cart']);
    console.log("Klaviyo ATC");
  }

  window.upcartSubscribeAddedToCart(function(event) { TrackATC(); });
  window.upcartSubscribeUpsellsAddedToCart(function(event) { TrackATC(); });
</script>
```

<Warning>
  Plak het hele blok, inclusief de functie `TrackATC`. De subscriber roept deze aan, dus een snippet met alleen de twee `upcartSubscribe…`-regels gooit bij elke add to cart een `Uncaught ReferenceError: TrackATC is not defined` en stuurt niets naar Klaviyo.
</Warning>

Legacy API (werkt nog steeds maar is verouderd):

```
<script>  
  function TrackATC(){  
    var _learnq = window._learnq || [];  
    fetch(`${window.location.origin}/cart.js`)  
      .then((res) =>  
        res.clone().json().then((data) => {  
          var cart = {  
            total_price: data.total_price / 100,  
            $value: data.total_price / 100,  
            total_discount: data.total_discount,  
            original_total_price: data.original_total_price / 100,  
            items: data.items,  
          };  
          _learnq.push(['track', 'Added to Cart', cart]);  
          console.log("Klaviyo ATC");  
        }).catch((e) => {  
          console.error('Klaviyo add to cart tracking failed', e);  
        })  
      );  
  }  
  
  window.upcartOnAddToCart = () => { TrackATC(); };  
  window.upcartOnAddUpsell = () => { TrackATC(); };  
</script>
```

***

<div id="what-this-does">
  ## Wat dit doet:
</div>

* Stuurt een "Added to Cart"-event naar Klaviyo telkens wanneer een product of upsell wordt toegevoegd met Upcart
* Voegt een bevestigingsbericht (`Klaviyo ATC`) toe aan je browserconsole zodat je weet dat het werkt

***

<div id="how-to-test-your-setup">
  ## Zo test je je opzet
</div>

Om te bevestigen dat je Klaviyo-integratie goed werkt:

* Volg [de handleiding van Klaviyo voor het testen van Add to Cart-events](https://help.klaviyo.com/hc/en-us/articles/4425956184731)
* Gebruik het tabblad **Console** van je browser om te controleren of het "Klaviyo ATC"-logbericht verschijnt na het toevoegen van een product
* Controleer het analytics-dashboard van Klaviyo op ATC-eventgegevens

Als je nog steeds geen trackinggegevens ziet, controleer dan of de onsite-scripts van Klaviyo zijn geïnstalleerd en ingeschakeld. Neem voor hulp contact op met het [Klaviyo Help Center](https://help.klaviyo.com/hc/en-us).

***

<div id="summary">
  ## Samenvatting
</div>

|                                                |                                             |                                            |
| ---------------------------------------------- | ------------------------------------------- | ------------------------------------------ |
| Methode                                        | Voordelen                                   | Wanneer te gebruiken                       |
| **Optie 1** – AJAX-compatibiliteit inschakelen | Snelste opzet, geen code nodig              | Wanneer andere apps niet interfereren      |
| **Optie 2** – Aangepast script toevoegen       | Meest betrouwbaar, Upcart houdt de controle | Wanneer Optie 1 cart-redirects veroorzaakt |

Als je Klaviyo en Upcart samen gebruikt, zou deze gids je moeten helpen om events soepel te tracken terwijl je cart drawer-ervaring intact blijft.

***

Meer hulp nodig? Neem contact met ons op via de support in de app.