Comment s’intégrer à OpenCart

Objectif de cet article

Apprenez à intégrer OpenCart avec Klaviyo. Une fois ces étapes franchies, vous serez en mesure de personnaliser et de cibler les e-mails en fonction des achats de chaque client et de l'activité du site Web. L'intégration d'OpenCart se synchronise toutes les heures.

Avant de commencer

Veuillez noter que Klaviyo ne synchronise pas votre catalogue à partir d’OpenCart.

Ajouter l’intégration OpenCart

Le processus d’ajout de l’intégration OpenCart de Klaviyo se fait en plusieurs étapes et nécessite des actions au sein d’OpenCart et de Klaviyo.

Pour commencer, Klaviyo prend actuellement en charge OpenCart 1.4.x et 1.5.x. Téléchargez le module OpenCart de Klaviyo ici : https://www.klaviyo.com/media/downloads/OpenCartKlaviyo-1.1.0.tgz.

1. Décompressez le fichier dans le répertoire racine de votre installation OpenCart.
2. Connectez-vous à la section d’administration OpenCart et accédez à la page Extensions > Modules.
3. Installez le module Klaviyo, puis cliquez sur Modifier pour le module Klaviyo.
4. La dernière chose à faire avec votre installation OpenCart consiste à copier-coller le code PHP suivant à la fin de `upload/index.php`, juste avant la ligne `$response->getOutput();` :

// [Klaviyo] Save customer cart if it exists.
if ($registry->get('cart')->hasProducts()) {
  $registry->get('load')->model('module/klaviyo');

  if ($registry->get('customer')->isLogged()) {
    $registry->get('model_module_klaviyo')->saveCustomerCart(
      session_id(),
      $registry->get('customer')->getId(),
      $session->data['cart']
    );
  } else if (array_key_exists('guest', $session->data)) {
    $registry->get('model_module_klaviyo')->saveGuestCart(
      session_id(),
      $session->data['guest'],
      $session->data['cart']
    );
  }
}

1. Dans Klaviyo, sélectionnez l’onglet Intégrations.
2. Cliquez sur Découvrir les applications et recherchez OpenCart, puis cliquez sur la carte. Ensuite, cliquez sur Installer.
3. Vous serez redirigé vers une page Paramètres d’intégration . Sur la page des paramètres, saisissez l’URL de votre site OpenCart et cliquez sur Se connecter à OpenCart.
   

4. Sur la page suivante, copiez la clé d’API sous Klaviyo OpenCart Module et collez-la dans les paramètres du module Klaviyo dans OpenCart. Enregistrez les paramètres du module Klaviyo dans l’administration OpenCart.
   

5. Si vous le souhaitez, cochez le paramètre Ajouter les nouveaux clients OpenCart à une liste Klaviyo, puis sélectionnez une liste dans le menu déroulant.
6. De retour dans Klaviyo, cliquez sur Finaliser la configuration pour commencer à synchroniser les données.

Installer le tracking sur site de Klaviyo

Pour suivre l’activité sur site dans OpenCart, commencez par trouver votre clé d’API publique Klaviyo en vous connectant à votre compte, en cliquant sur le nom de votre compte en bas à gauche, puis en accédant à Paramètres > Clé d’API. Votre clé publique comporte six caractères. Il y a deux principaux types de tracking sur site que vous pouvez installer :

• Active on Site
  Cet indicateur est suivi chaque fois qu’un navigateur identifiable consulte votre site web
• Viewed Product
  Cet indicateur est suivi chaque fois qu’un navigateur identifiable consulte une page produit sur votre site web

Ajouter le tracking « Activité sur le site »

Cet indicateur est suivi chaque fois qu’un navigateur identifiable visite votre site web. Pour commencer à suivre l’activité Active on Site :

1. Ajoutez l’extrait de code suivant à votre modèle de boutique principal afin qu’il soit inclus sur toutes les pages. Vous devriez placer cet extrait soit avec les autres scripts d’analyse que vous utilisez, soit juste avant le tag de fermeture </body> :
   

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js></script>
<script type="text/javascript"> 
//Initialize Klaviyo object on page load
!function(){if(!window.klaviyo){window._klOnsite=window._klOnsite||[];try{window.klaviyo=new Proxy({},{get:function(n,i){return"push"===i?function(){var n;(n=window._klOnsite).push.apply(n,arguments)}:function(){for(var n=arguments.length,o=new Array(n),w=0;w<n;w++)o[w]=arguments[w];var t="function"==typeof o[o.length-1]?o.pop():void 0,e=new Promise((function(n){window._klOnsite.push([i].concat(o,[function(i){t&&t(i),n(i)}]))}));return e}}})}catch(n){window.klaviyo=window.klaviyo||[],window.klaviyo.push=function(){var n;(n=window._klOnsite).push.apply(n,arguments)}}}}(); </script>

1. Veillez à remplacer PUBLIC_API_KEY par la clé d’API publique de votre compte Klaviyo.
2. Si les visiteurs ou les clients peuvent créer des comptes pour votre boutique, ajoutez l’extrait de code suivant directement sous le premier extrait de code :

<script type="text/javascript">
  var klaviyo = window.klaviyo || [];
  {% if user.is_logged_in %}
  klaviyo.identify({
    $email: '{{ user.email }}',
    $first_name: '{{ user.first_name }}',
    $last_name: '{{ user.last_name }}'
    });
  {% endif %}
</script>

1. Selon les types de modèles que vous utilisez pour votre site web, la syntaxe {% if user.is_logged_in %} et {{ user.email }} est probablement différente. En utilisant le langage de modèle disponible, vous devez vérifier si la personne qui consulte la page actuelle est connectée. Si c’est le cas, vous devez afficher son e-mail et son nom, si disponibles. Si vous n’avez pas d’informations sur le nom, supprimez ces deux lignes ainsi que la virgule finale après la ligne d’e-mail $email.

Ajouter le tracking « Produit consulté »

Si vous souhaitez configurer un flux d’abandon de navigation ou créer des segments basés sur les données de navigation des produits, vous devrez ajouter un tracking d’événement JavaScript pour un indicateur « Produit consulté ».

1. Dans le modèle de votre page produit, ajoutez l’extrait de code suivant :

<script type="text/javascript">
    var klaviyo = window.klaviyo || [];
    klaviyo.track("Viewed Product", {
      Title: '{{ product.title }}',
      ItemId: {{ product.id }},
      Categories: {{ category in product.categories|json }}, // The list of categories is an array of strings. 
      ImageUrl: '{{ product.image_url }}',
      Url: '{{ product.url }}',
      Metadata: {
        Brand: '{{ product.brand }}',
        Price: {{ product.price }},
        CompareAtPrice: {{ product.compare_at_price }} // If you have a compare at price. You could also include this for a sale or special price.
      }
  });
</script>

1. L’extrait ci-dessus utilise la syntaxe d’espace réservé {{ }}, qui peut être différente pour votre boutique OpenCart. L’élément important est que les champs de produit sont rendus de manière dynamique en fonction de la page produit que vous consultez.
2. Une fois le tracking Viewed Product configuré pour votre site, les données Viewed Product devraient commencer à s’afficher dans votre compte Klaviyo à mesure que des visiteurs connus consultent vos pages produit.

Comment fonctionne le tracking sur site

Lorsque vous ajoutez le tracking web Klaviyo à votre site, nous ne sommes en mesure de suivre l’activité de navigation des « navigateurs connus », c’est-à-dire les navigateurs qui ont déjà consulté votre site et interagi au moins une fois auparavant. Il existe deux façons principales d’identifier un visiteur de votre site à des fins de tracking web :

• Si quelqu’un a, à un moment donné, cliqué sur un Klaviyo Email pour accéder à votre site web
• Si quelqu’un s’est, à un moment donné, abonné/inscrit via un formulaire Klaviyo

Klaviyo n’effectue pas de tracking pour les visiteurs anonymes.

Suivre la synchronisation Klaviyo

Le temps nécessaire pour synchroniser toutes les données historiques des clients et des commandes depuis votre boutique OpenCart dépend de la taille de votre boutique. Une fois cette synchronisation historique terminée, vous verrez une bordure verte autour de votre intégrations OpenCart sous Intégrations activées.

Pour vérifier vos intégrations :

1. Accédez à l’onglet Indicateurs de votre compte, situé sous Analytics. Ici, vous pouvez filtrer pour afficher tous les indicateurs OpenCart. Trouvez l’indicateur Commande passée d’OpenCart et cliquez sur l’icône Fil d’activité. Si votre intégration a commencé à synchroniser des données, vous commencerez à voir des événements Commande passée apparaître ici.
2. Nous synchroniserons automatiquement toutes les données historiques de commande. Pour vérifier cela, vous pouvez comparer le nombre d’événements un jour donné dans Klaviyo avec ce qui figure dans votre interface OpenCart et confirmer qu’ils correspondent.
3. Par exemple, lorsque vous explorez l’indicateur Placed Order, vous pouvez passer la souris sur le point de données d’hier ou consulter le tableau de données sous le graphique pour voir combien de commandes ont été signalées hier.
4. Comparez ce nombre à celui enregistré dans OpenCart depuis hier et vous devriez constater qu’ils correspondent exactement. Si ce n’est pas le cas, le problème vient très probablement du fait que le fuseau horaire de votre compte Klaviyo ne correspond pas au fuseau horaire OpenCart que vous avez défini.
5. Pour vérifier ou mettre à jour le fuseau horaire de votre compte :
   • Cliquez sur le nom de votre organisation en bas à gauche.
   • Sélectionnez Paramètres.
   • Accédez à l’onglet Organisation .

Données synchronisées depuis OpenCart

• Données relatives aux ventes et aux commandes
  Quels produits ont été achetés, y compris les détails et les images des produits.
• Informations client
  Prénom, nom, localisation et groupe de clients.
• Données de début de paiement
  Utilisées pour déclencher des e-mails de panier abandonné. Cela est rendu possible par l’extrait de code PHP que vous avez ajouté lors de l’intégration.
• Données de commande exécutée
  Utilisées pour suivre le moment où les commandes sont expédiées.
• Tracking sur site
  Lorsque les personnes visitent votre site web

Pour accéder à vos indicateurs OpenCart, accédez à Analyses > Indicateurs dans Klaviyo, où vous pouvez filtrer par OpenCart.

Par défaut, Klaviyo synchronise les statuts suivants pour les indicateurs Placed Order et Fulfilled Order :

• Commande passée : En attente, Traitée, En cours de traitement, Expédiée, Terminée
• Commande exécutée : Expédiée, terminée