> ## 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.

# Suivi des événements d'ajout au panier Klaviyo dans Upcart

> Cet article explique comment activer un suivi précis des événements Klaviyo lorsque les clients ajoutent des articles à leur panier avec Upcart.

<div id="overview">
  # Aperçu
</div>

Par défaut, Upcart prend le contrôle de la fonctionnalité de panier de Shopify, ce qui peut empêcher des applications tierces comme **Klaviyo** de détecter les mises à jour du panier. Heureusement, il existe deux méthodes fiables pour rétablir le suivi **Add to Cart (ATC)** dans Klaviyo tout en gardant Upcart actif.

Avant de commencer, assurez-vous que le **suivi sur site de Klaviyo (Onsite Tracking)** est correctement configuré. Vous pouvez suivre leur guide de configuration ici :\
👉 [Guide de configuration du suivi sur site de Klaviyo](https://help.klaviyo.com/hc/en-us/articles/4425956184731)

***

<div id="option-1-use-ajax-compatibility-fastest-setup">
  ## Option 1 : Utiliser la compatibilité AJAX (configuration la plus rapide)
</div>

Upcart inclut un paramètre qui rétablit la compatibilité avec les autres applications en exposant le comportement natif de mise à jour du panier de Shopify. Lorsque celui-ci est activé, Klaviyo peut à nouveau écouter les événements Add to Cart.

<div id="how-to-enable">
  ## Comment l'activer :
</div>

1. Allez dans **Upcart > Cart Editor > Settings**
2. Activez le paramètre : **Enhanced AJAX API Compatibility**
3. Cliquez sur **Save** et testez le résultat

⚠️ **Important : compromis liés à Enhanced AJAX API Compatibility**\
Ce paramètre est **désactivé par défaut** pour la plupart des boutiques. Activez-le UNIQUEMENT si votre boutique utilise une API de panier AJAX non standard et qu'Upcart n'intercepte pas les événements d'ajout au panier. Lorsqu'il est activé, les autres applications obtiennent davantage de contrôle sur le comportement du panier, ce qui peut provoquer des boucles de redirection ou envoyer les clients vers la page de panier de Shopify au lieu d'ouvrir le tiroir Upcart. Si l'activation de ce paramètre provoque des redirections, désactivez-le et passez plutôt à l'**Option 2**, en utilisant l'API manuelle d'Upcart (`upcartRegisterAddToCart`).

Pour des instructions complètes sur ce paramètre, consultez [Enhanced AJAX API Compatibility](/fr/upcart/enhanced_ajax_api_compatibility).

***

<div id="option-2-recommended-add-a-custom-klaviyo-script">
  ## Option 2 (recommandée) : Ajouter un script Klaviyo personnalisé
</div>

Cette méthode vous offre le meilleur des deux mondes : **Upcart garde le contrôle total** et **le suivi Klaviyo continue de fonctionner**.

<div id="steps">
  ## Étapes :
</div>

1. Ouvrez **Upcart > Cart Editor > Settings**
2. Faites défiler jusqu'à la section **Custom HTML**
3. Dans le menu déroulant, choisissez **Scripts (Before Load)**
4. Collez le script suivant :

API moderne (recommandée) :

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

API héritée (fonctionne toujours mais obsolète) :

```
<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">
  ## Ce que cela fait :
</div>

* Envoie un événement « Added to Cart » à Klaviyo chaque fois qu'un produit ou une vente incitative est ajouté via Upcart
* Ajoute un message de confirmation (`Klaviyo ATC`) dans la console de votre navigateur pour vous indiquer que cela fonctionne

***

<div id="how-to-test-your-setup">
  ## Comment tester votre configuration
</div>

Pour confirmer que votre intégration Klaviyo fonctionne correctement :

* Suivez le [guide de Klaviyo pour tester les événements Add to Cart](https://help.klaviyo.com/hc/en-us/articles/4425956184731)
* Utilisez l'onglet **Console** de votre navigateur pour vérifier que le message « Klaviyo ATC » apparaît après l'ajout d'un produit
* Consultez le tableau de bord analytique de Klaviyo pour les données d'événements ATC

Si vous ne voyez toujours pas de données de suivi, confirmez que les scripts sur site de Klaviyo sont installés et activés. Pour obtenir de l'aide, contactez le [centre d'aide Klaviyo](https://help.klaviyo.com/hc/en-us).

***

<div id="summary">
  ## Résumé
</div>

|                                               |                                                 |                                                       |
| --------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------- |
| Méthode                                       | Avantages                                       | Quand l'utiliser                                      |
| **Option 1** – Activer la compatibilité AJAX  | Configuration la plus rapide, aucun code requis | Lorsque les autres applications n'interfèrent pas     |
| **Option 2** – Ajouter un script personnalisé | Le plus fiable, Upcart garde le contrôle        | Lorsque l'Option 1 provoque une redirection du panier |

Si vous utilisez Klaviyo et Upcart ensemble, ce guide devrait vous aider à suivre les événements sans problème tout en préservant l'expérience de votre tiroir de panier.

***

Besoin d'aide supplémentaire ? Contactez-nous via l'assistance intégrée à l'application.