Comment afficher des boutons de favoris sur votre site et dans Klaviyo Customer Hub

Objectif de cet article

Découvrez comment permettre aux acheteurs d’enregistrer leurs articles préférés sur votre site. En ajoutant des boutons de favoris à côté de vos produits, vous pouvez afficher les articles enregistrés par les acheteurs dans le volet du Customer Hub et envoyer des flux de suivi pour générer des conversions.

Avant de commencer

Ce guide explique comment activer le paramètre Favoris depuis les paramètres de Klaviyo Customer Hub dans Klaviyo, et ajouter des boutons de favoris sur différentes pages de votre site web. Avant de poursuivre, assurez-vous que la fonctionnalité Klaviyo Customer Hub est activée dans Klaviyo.

En savoir plus sur Klaviyo Customer Hub.

À propos des favoris

Les boutons Favoris permettent aux acheteurs d’enregistrer les produits qui les intéressent. Les éléments mis en favoris par un acheteur s’affichent dans le tiroir du Klaviyo Customer Hub, et peuvent être utilisés dans des flux pour générer des conversions supplémentaires.

Lorsque vous activez la fonctionnalité Favoris dans les paramètres de votre Klaviyo Customer Hub, un bouton Favoris apparaît sur tous les produits affichés dans l’interface de Klaviyo Customer Hub. Lorsqu’un acheteur clique sur ce bouton, l’article est ajouté à sa section Favoris et enregistré dans son profil Klaviyo.

Pour augmenter leur visibilité et encourager leur utilisation, vous pouvez également ajouter des boutons de favoris à :

• Pages des détails du produit
• Pages de collections (également appelées « pages de liste de produits »)

Les articles ajoutés aux favoris depuis l’une ou l’autre de ces pages sont également enregistrés dans la section Favoris des acheteurs dans le tiroir Klaviyo Customer Hub. Notez que tout visiteur peut ajouter des produits à sa liste de favoris, qu’il soit connecté ou non à un compte client. Lorsqu’ils se connectent, tous les favoris qu’ils ont enregistrés seront synchronisés avec leur profil Klaviyo.

Activer les favoris pour les afficher dans le Klaviyo Customer Hub

Pour afficher les favoris dans le tiroir du Klaviyo Customer Hub, vous devez d’abord activer le paramètre Favoris dans Klaviyo.

1. Dans la navigation principale de Klaviyo, à gauche, sélectionnez Service - Klaviyo Customer Hub.
2. Cliquez sur l’onglet Extensions .
3. Sous Favoris, cochez la case Activer les favoris.
   

4. Dans la liste déroulante Choisir une icône, sélectionnez le type d’icône favorite à afficher sous vos produits (par exemple, un cœur ou un signe plus).
   • Par défaut, l’aperçu affiche la version non sélectionnée (c’est-à-dire non ajoutée aux favoris) de l’icône. Cliquez sur l’icône dans l’aperçu pour la voir passer à l’état ajouté aux favoris.
5. Cliquez sur Enregistrer.

Un bouton Favoris apparaîtra désormais sous tous les produits présentés dans l’interface Klaviyo Customer Hub. En cliquant dessus, vous ajoutez l’article à la section Favoris.

Poursuivez vers la section suivante pour obtenir des conseils sur l’ajout de boutons de favoris aux pages de détails des produits.

Importer des listes de souhaits existantes dans Klaviyo Customer Hub

Si vous passez à Klaviyo Customer Hub depuis une autre application de liste de souhaits, vous pouvez migrer en toute fluidité les articles enregistrés de vos clients avec une migration de données raisonnablement sans perte. Klaviyo propose un workflow standard pour importer l’historique des données des favoris et des listes de souhaits afin que vos acheteurs ne perdent pas leurs produits enregistrés.

Importations d’applications natives

Klaviyo offre une prise en charge native, prête à l’emploi, pour importer des données directement depuis des applications de liste de souhaits populaires, notamment :

• Swym
• Wishlist King

Importation CSV

Si vous migrez depuis un autre fournisseur de liste de souhaits, vous pouvez importer vos données directement dans Klaviyo. Accédez aux paramètres des favoris de Klaviyo Customer Hub et déposez votre fichier CSV dans la zone de chargement — aucun modèle requis. L’importateur reconnaîtra automatiquement le format de votre fichier et associera les données en conséquence afin de renseigner les profils Klaviyo Customer Hub de vos acheteurs.

Ajouter des boutons Favoris aux pages de détail des produits

Générez un engagement nettement plus élevé en ajoutant des boutons « ajouter aux favoris » à vos pages de détails de produit.

1. Dans le paramètre Favorites de Klaviyo, sélectionnez Ajouter un bloc d’application.
2. Cela ouvre l’éditeur de thème Shopify dans une nouvelle fenêtre et affiche une fenêtre modale indiquant que le bloc d’application Klaviyo Favorites a été ajouté à votre modèle de page de produit par défaut. Cliquez sur Compris.
   

3. Cliquez et faites glisser l’application pour ajuster sa position sur votre page de détails du produit selon vos besoins.
4. Lorsque vous êtes prêt, cliquez sur Enregistrer pour enregistrer vos modifications dans Shopify. À ce stade, les boutons Favoris s’afficheront sous les produits sur vos pages produit.
5. Facultatif : pour ajouter du style, retournez dans Klaviyo. À l’aide de la liste déroulante Style de bloc d’application, vous pouvez personnaliser l’apparence du bouton des favoris sur les pages produit. Vous avez le choix entre deux options :
   • Hériter pour synchroniser les styles des boutons de votre site (par défaut).
   • Personnalisé pour sélectionner une police et une couleur de texte spécifiques pour les boutons.
     

6. Enregistrez toutes les modifications.

Retournez sur votre site web. Vous devriez voir des boutons de favoris s’afficher sous les produits sur vos pages de détails des produits.

Ensuite, passez à la section Ajouter des boutons Favoris à vos pages de collections.

Installez manuellement les boutons favoris (thèmes vintage ou configuration personnalisée)

Si vous utilisez un thème Shopify vintage ou une configuration personnalisée qui ne prend pas en charge les blocs d’application, vous devrez peut-être installer manuellement l’application Klaviyo Wishlist sur les pages sur lesquelles vous souhaitez des actions de mise en favori (par exemple, les pages produit).

Pour cela, procédez comme suit :

1. Ouvrez l’interface d’administration de votre boutique Shopify.
2. Sous les canaux de vente, sélectionnez Boutique en ligne.
3. Cliquez sur le menu à trois points de votre thème actuel, puis sélectionnez Edit code (Modifier le code). Si vous préférez plutôt le tester sur un thème de brouillon, dupliquez d’abord votre thème actuel, puis modifiez le code du thème dupliqué.
   

4. Trouvez le fichier de votre page de détails du produit. Cela varie selon le thème, mais son nom contient généralement le mot « product ». Par exemple, dans le thème Dawn, il s’appelle « main-product.liquid ».
5. Collez l’extrait de code suivant à l’endroit où vous souhaitez que le bouton Favoris apparaisse :
   <div class="klaviyo-wishlist-slot" data-product-id="{{ product.id }}"></div>
6. Cliquez sur Enregistrer.
7. Cliquez sur Aperçu du magasin.
8. Naviguez vers une page de produit dans l'aperçu de votre magasin. Le bouton Favoris ajouté devrait être visible à l’emplacement prévu.

Ajouter des boutons de favoris à vos pages de collections

Installez un petit extrait de code sur votre site Shopify pour ajouter des boutons de favoris à vos pages de collections afin que les acheteurs puissent rapidement enregistrer des articles tout en parcourant vos produits. Cela est particulièrement utile pour les acheteurs sur appareils mobiles.

Pour cela, procédez comme suit :

1. Ouvrez l’interface d’administration de votre boutique Shopify.
2. Sous les canaux de vente, sélectionnez Boutique en ligne.
3. À côté de votre thème actuel, cliquez sur le menu à trois points, puis sélectionnez Modifier le code.
   • Si vous souhaitez effectuer un test sur un thème de brouillon, dupliquez d’abord votre thème actuel, puis modifiez le code dans le thème dupliqué.
4. Dans la barre latérale de gauche, recherchez et ouvrez votre fichier de collections. Nous utiliserons le fichier featured-collections.liquid pour cet exemple, mais votre thème peut utiliser un fichier différent.
   

5. Dans le fichier collections, utilisez le raccourci de recherche (Commande+F sur Mac ou Contrôle+F sur Windows) pour rechercher le mot « render » dans le fichier. Cela vous aide à identifier le nom de l’extrait contenant votre grille de produits.
   • L’extrait apparaîtra probablement dans un format similaire à : {% render 'snippet-name'%}, où « snippet-name » est le nom du fichier d’extrait pertinent (par exemple, card-product).
     

6. Dans la barre latérale gauche, recherchez et ouvrez le fichier de snippet identifié à l’étape précédente (par exemple, card-product.liquid).
7. En haut de ce fichier, notez la valeur de l’objet indiquée sous « Accepts » (par exemple, « card_product »).
   

8. Copiez le code suivant et collez-le dans le fichier d’extrait :
   • Conseil : recherchez la première occurrence de l’affichage du prix dans votre fichier et collez le code au-dessus.
     <div

    class="klaviyo-favorites-plp-slot"

   data-product-id="{{ OBJECT.id }}"

   data-product-url="{{ OBJECT.url }}"

   data-variant-id="{{OBJECT.selected_or_first_available_variant.id}}"

  ></div>
9. Dans le code que vous avez collé, remplacez OBJECT par la valeur d’objet que vous avez notée plus tôt.
   • Par exemple, si la valeur d’objet de votre fichier est « card_product », le code ressemblera à ceci lorsqu’il sera collé dans le fichier au-dessus du prix.
     

10. Cliquez sur Enregistrer dans Shopify.
11. Accédez à la page des collections de votre site et actualisez-la.

Vous devriez maintenant voir apparaître les boutons Favoris sur chaque produit. Notez que leur chargement peut prendre quelques secondes. Par défaut, ils sont positionnés dans le coin supérieur droit. Si vous souhaitez modifier le positionnement, consultez votre développeur pour obtenir de l’aide concernant le CSS personnalisé.

Si les boutons Favoris n’apparaissent toujours pas, essayez ces étapes de dépannage :

• Confirmez que vous avez remplacé OBJECT dans l’extrait de code par la valeur d’objet de votre fichier.
• Essayez de coller le code ailleurs dans le fichier.
• Vérifiez que vous avez collé le code dans le bon fichier d’extrait.

S’ils n’apparaissent toujours pas, demandez de l’aide à un développeur. L’équipe d’assistance de Klaviyo n’est pas en mesure de modifier directement les fichiers de votre thème.

Prochaines étapes

Maintenant que vous avez ajouté des boutons de favoris sur votre site, configurez un flux de rappel des favoris afin de stimuler les conversions en rappelant aux acheteurs les articles qu’ils ont récemment enregistrés.

Ressources supplémentaires