Comment intégrer Spree

Objectif de cet article

Découvrez comment intégrer Spree à Klaviyo. Une fois ces étapes franchies, vous serez en mesure de personnaliser et de cibler les e-mails en fonction des achats et de l'activité du site Web de chaque client. Voici les données que nous synchronisons avec Spree :

• Données relatives aux ventes et aux commandes, y compris les produits achetés, les images des produits, les détails des variantes et les remises appliquées
• Données sur le client, y compris son prénom, son nom de famille et sa localisation
• Données de commande traitée

Ajouter l’intégration Spree dans Klaviyo

1. Dans Klaviyo, sélectionnez l’onglet Intégrations.
2. Cliquez sur Découvrir les applications, recherchez Spree, puis cliquez sur la carte. Ensuite, cliquez sur Installer.
3. À la page suivante, vous devrez fournir l’URL de votre boutique et une clé d’API Spree/un mot de passe chiffré. Vous pouvez générer cette clé d’API dans votre interface d’administration Spree en accédant à Utilisateurs, en choisissant un compte, puis en sélectionnant Générer une clé d’API.
4. De retour dans Klaviyo, collez l’URL de votre boutique et votre clé d’API/mot de passe chiffré dans les champs.
   

5. Si vous utilisez une API Spree versionnée (V1), cochez I’m using a versioned Spree API (V1).
6. Cliquez sur Connecter à Spree.

Le paramètre de liste ci-dessous ajoute les clients synchronisés à partir des commandes et des passages en caisse Spree, sans vérifier leur statut de consentement aux e-mails dans Spree. L’appartenance à une liste n’établit pas le consentement à l’e-mail.

1. Facultatif : pour ajouter les clients Spree synchronisés à une liste Klaviyo, cochez Ajouter de nouveaux clients Spree à une liste Klaviyo sur la page suivante, puis sélectionnez la liste.
2. Lorsque vous êtes prêt, cliquez sur Terminer la configuration. Vous devriez alors voir un message de réussite indiquant que l’intégration a été effectuée avec succès.

Installer le tracking sur site de Klaviyo

Pour installer le tracking sur site pour Active on Site et Viewed Product, commencez par trouver votre clé d’API publique. Connectez-vous à votre compte Klaviyo et accédez à Nom du compte > Paramètres > Clés d’API. Votre clé publique comporte 6 caractères. Copiez cette clé en toute sécurité pour l’utiliser à l’étape suivante.

Il y a 2 types de tracking sur site que vous pouvez utiliser :

• 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

Tracking « Activité sur le site »

Cet indicateur est suivi chaque fois qu’un navigateur identifiable visite votre site web.

1. Pour commencer à suivre l’activité Active on Site, ajoutez l’extrait de code suivant à votre modèle principal de boutique afin qu’il soit inclus sur toutes les pages. Vous devez placer cet extrait soit avec les autres scripts d’analyse que vous utilisez, soit juste avant le tag de fermeture </body>.
2. Veillez à remplacer PUBLIC_API_KEY par la clé d’API publique de votre compte Klaviyo :

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=PUBLIC_API_KEY"></script>
<script type="text/javascript"> 
//Initialize the 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. Facultatif : pour identifier les clients lorsqu’ils se connectent à votre boutique, ajoutez un appel klaviyo.identify() avec l’adresse e-mail du client connecté et, si disponible, son prénom et son nom. Utilisez le langage de modèle de votre boutique pour inclure cet appel uniquement lorsque le visiteur est connecté. Consultez le guide de tracking sur site pour en savoir plus sur le tracking personnalisé pour les utilisateurs connectés.
2. Enregistrez et publiez le modèle de votre boutique. Ce code de tracking enregistre les événements Actif sur le site pour les navigateurs connus, afin que vous puissiez utiliser les données sur les visites du site et le comportement des visiteurs dans Klaviyo.
3. Pour tester que votre tracking sur site est correctement configuré, accédez à une page de votre boutique et ajoutez ?utm_email=email@example.com à la fin de l’URL, en remplaçant email@example.com par votre adresse e-mail. Si l’URL contient déjà un point d’interrogation, utilisez &utm_email=email@example.com à la place. Actualisez la page, puis recherchez votre adresse e-mail dans Klaviyo. Ouvrez votre profil et vérifiez s’il existe un évènement Active on Site.

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énements JavaScript pour un indicateur Produit consulté.

1. Sur le modèle de votre page produit, ajoutez l’exemple suivant après l’extrait principal de tracking sur site. Adaptez les espaces réservés à votre boutique avant de publier :

<script type="text/javascript">
 var klaviyo = window.klaviyo || [];
 klaviyo.track("Viewed Product", {
    Title: '{{ product.name }}',
    ItemId: {{ product.id }},
    Categories: {{ category in product.categories|json }}, // The list of categories is an array of strings.
    ImageUrl: '{{ product.image_url }}',
    Url: '{{ product.permalink }}',
    Metadata: {
    Brand: '{{ product.brand }}',
    Price: {{ product.price }},
    OnSale: {{ product.on_sale }},
    RegularPrice: {{ product.regular_price }},
    SalePrice: {{ product.sale_price }}
 }
 });
</script>

1. Remplacez les espaces réservés {{ }} par des valeurs rendues dynamiquement pour le produit consulté, en utilisant le langage de modèle de votre boutique. Encodez en JSON les chaînes dynamiques et les tableaux afin que les guillemets dans les noms de produits ne cassent pas le JavaScript. Supprimez les guillemets entourant l’exemple lors de l’insertion de valeurs encodées en JSON. Rendez Categories sous forme de tableau de chaînes, et rendez les prix et le statut de promotion sous forme de valeurs JavaScript valides.
2. Enregistrez et publiez le modèle de votre page produit. Pour le tester, identifiez votre navigateur à l’aide du test d’adresse e-mail ci-dessus, puis consultez une page produit, et vérifiez votre profil Klaviyo pour un événement Viewed Product. Une fois configurées, ces données se renseigneront au fur et à mesure que les visiteurs connus consulteront vos pages produit.

Lors de l’ajout des détails du produit à un e-mail d’abandon de navigation, utilisez les noms de propriétés de votre propre événement Produit consulté. Dans l’exemple ci-dessus, le titre du produit est Title, l’image est ImageUrl et le prix est Metadata.Price.

Comment fonctionne le tracking sur site

Klaviyo utilise un navigateur identifié pour associer l’activité sur site à un profil. Une visite précédente seule n’identifie pas un navigateur. Il existe 2 façons courantes pour Klaviyo d’identifier un visiteur de site :

• 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

Lorsque le remplissage a posteriori de l’activité des visiteurs anonymes est activé, Klaviyo peut stocker les événements sur site dans le navigateur du visiteur avant son identification, puis les ajouter à son profil une fois qu’il est identifié. Cela nécessite que le stockage local du navigateur soit disponible. Découvrez l’intégration des données manquantes dans l’activité des visiteurs anonymes.

Suivre la synchronisation Klaviyo

Pour vérifier vos intégrations :

1. Ouvrez Intégrations, sélectionnez Spree, puis sélectionnez Données. Sous Données historiques, examinez la progression de la synchronisation. Lorsque l’importation se termine, la carte confirme que vos données historiques ont été synchronisées.
2. Cliquez sur le menu déroulant Analytics dans Klaviyo et sélectionnez Indicateurs. Ici, vous pouvez filtrer pour afficher tous les indicateurs Spree.
3. Ouvrez l’indicateur Placed Order de Spree, puis sélectionnez l’onglet Flux d’activité. Si votre intégration a commencé à synchroniser des données, vous verrez ici des événements Placed Order.
4. Klaviyo importe automatiquement les données historiques de commande. Une fois cette importation terminée, sélectionnez l’onglet Graphique pour Commande passée. Choisissez une période qui inclut le jour que vous souhaitez vérifier, définissez Afficher par sur Quotidien, et définissez Mesure sur Total. Par exemple, survolez le point de données d’hier ou utilisez le tableau sous le graphique pour voir combien de commandes ont été enregistrées hier.
5. Comparez ce nombre aux commandes terminées dans Spree pour le même jour. Les commandes doivent comporter une adresse e-mail client valide et au moins 1 article pour se synchroniser. Si les décomptes diffèrent, confirmez que l’importation des données historiques est terminée, laissez le temps à la synchronisation horaire de s’effectuer, et vérifiez que les fuseaux horaires de Klaviyo et de Spree correspondent.
6. Pour vérifier votre paramètre de fuseau horaire dans Klaviyo :
   • Cliquez sur le nom de votre compte dans la partie inférieure gauche.
   • Sélectionnez Paramètres > Compte.
   • Descendez jusqu’à Timezone.

Données synchronisées depuis Spree

Vous trouverez ci-dessous une liste des indicateurs que Spree synchronise dans Klaviyo. Vous pouvez afficher tous les indicateurs Spree qui se synchronisent dans votre compte dans Analyses > Indicateurs.

Commande passée

Cet indicateur enregistre un évènement lorsqu’une commande dans Spree est terminée, ce qui signifie qu’un client a terminé le processus de paiement. Cela ne confirme pas la réussite du paiement. Avec cet indicateur, vous pouvez facilement créer des segments de personnes en fonction du nombre de commandes qu’elles ont passées ou de leur valeur vie. Vous pouvez également créer des e-mails pour relancer les anciens clients ou envoyer des e-mails de remerciement aux nouveaux acheteurs. Vous pouvez filtrer et cibler les événements de commande passée en fonction des critères suivants :

• IsDiscounted
  Si une remise a été appliquée à une commande, par exemple true ou false.
• ItemNames
  Les noms des produits achetés dans cet événement.

Produit Commandé

Cet indicateur est similaire à l’indicateur Placed Order, toutefois un événement est enregistré pour chaque unité d’un article commandé par une personne. Par exemple, si quelqu’un a acheté un t-shirt et un short, cela apparaîtra dans Klaviyo comme 1 événement Placed Order et 2 événements Ordered Product, un pour le t-shirt et un pour le short. Cet indicateur est utile pour créer des segments qui ciblent les clients ayant acheté (ou n’ayant pas acheté) des articles spécifiques ou des articles appartenant à des catégories spécifiques. Vous pouvez également utiliser l'indicateur Produit commandé comme déclencheur de flux pour envoyer des e-mails sur des produits connexes qui vont naturellement ensemble, mais que certains clients n'ont pas encore achetés.

• Categories
  Les catégories auxquelles appartient le produit commandé, par exemple, Chemises, Hommes ou Soldes.
• Nom
  Le nom du produit acheté, par exemple : T-shirt rouge pour homme.
• ProductId
  L’identifiant de votre produit tel qu’il est défini dans votre boutique, par exemple 2022, 2023, 2024.
• Quantité
  La quantité représentée par cet événement, qui est de 1. Une commande de 3 unités du même produit crée 3 événements Produit commandé.
• SKU
  Le SKU du produit tel qu’il est défini dans votre boutique.
• Option de variante : couleur
  La couleur du produit, si disponible, p. ex. Rouge ou Bleu.
• Option de variante : taille
  La taille du produit, si elle est disponible, par exemple Moyen ou Grand.

Commande Traitée

Cet indicateur enregistre un événement lorsqu’une commande finalisée est marquée comme expédiée dans Spree. L'événement dans Klaviyo inclut le numéro de suivi pour tous les envois, de sorte que vous pouvez utiliser cette métrique comme déclencheur pour les e-mails de confirmation d'expédition. Un autre e-mail courant basé sur l'indicateur de commandes honorées est l'e-mail d'évaluation des produits, dans lequel vous demandez aux clients de laisser un avis sur les articles qu'ils ont récemment achetés. L’utilisation de l’indicateur Fulfilled Order vous permet de programmer ces e-mails à partir de l’expédition, mais ne confirme pas la livraison. Ajoutez un délai pour laisser le temps à la livraison d’arriver avant d’envoyer une demande d’avis sur le produit. Vous pouvez filtrer et cibler les événements Commande traitée fonction des critères suivants :

• IsDiscounted
  Si une remise a été appliquée à une commande, par exemple true ou false.
• Noms des articles
  Les noms des articles achetés dans cet événement.

Début de commande

Cet indicateur enregistre un événement pour un paiement avec une adresse e-mail client valide et au moins 1 article. La principale utilisation de cette mesure est l'envoi de e-mails concernant les paniers abandonnés. Avec Klaviyo, vous pouvez facilement configurer un flux d'e-mails pour envoyer un rappel de panier si quelqu'un a commencé à passer à la caisse mais n'a pas passé commande au bout de quelques heures. L'événement Started Checkout contient toutes les informations relatives au panier d'une personne, ce qui vous permet d'afficher les produits contenus dans son panier ainsi que des images de ces produits. Pour les utilisateurs plus expérimentés, vous pouvez mettre en place 2 flux de panier abandonné : l’un pour les nouveaux clients qui inclut un code de réduction, et l’autre pour les acheteurs récurrents qui n’inclut pas de code de réduction. Vous pouvez filtrer et cibler les événements Started Checkout en fonction des critères suivants :

• IsDiscounted
  Si une remise a été appliquée à une commande, par exemple true ou false.
• ItemNames
  Les noms des articles dans le panier de paiement.

Données clients

En plus des indicateurs que Klaviyo synchronise depuis Spree, certaines propriétés client sont également ajoutées aux profils Klaviyo lorsqu’elles sont disponibles dans les données de commande. Vous pouvez utiliser ces propriétés dans les segments et les flux. Voici les propriétés synchronisées depuis Spree. Les informations de nom, de localisation et de téléphone proviennent de l’adresse de facturation de la commande :

• E-mail
• Prénom
• Nom de famille
• City
• État/Département
• Zip Code
• Pays
• Phone Number

Résultat

Vous avez maintenant intégré votre compte Klaviyo à Spree, installé le tracking sur site et examiné vos données synchronisées.

Ressources supplémentaires