Comment afficher les boutons favoris sur votre site et dans Klaviyo Customer Hub ?

Objectif de cet article

Apprenez comment permettre aux acheteurs de sauvegarder leurs articles préférés sur votre site. En ajoutant des boutons favoris à côté de vos produits, vous pouvez afficher les articles sauvegardés par les acheteurs dans le tiroir du Klaviyo Customer Hub et envoyer des flux de suivi pour favoriser la conversion.

Avant de commencer

Ce guide explique comment activer le paramètre Favoris à partir des paramètres de Klaviyo Customer Hub dans Klaviyo, et ajouter des boutons favoris sur différentes pages de votre site Web. Avant de procéder, assurez-vous que les fonctionnalités du Klaviyo Customer Hub sont activées sur Klaviyo.

En savoir plus sur Klaviyo Customer Hub.

À propos des favoris

Les boutons "Favoris" permettent aux acheteurs de sauvegarder les produits qui les intéressent. Les articles favoris d'un acheteur s'affichent dans le tiroir de Klaviyo Customer Hub et peuvent être utilisés en flux pour générer des conversions supplémentaires.

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

Pour accroître leur visibilité et encourager leur utilisation, vous pouvez également ajouter des boutons de favoris :

• Pages détaillées sur les produits
• Pages de collections (également appelées "pages de listes de produits") 

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

activer les favoris à afficher dans le tiroir de Klaviyo Customer Hub

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

1. Dans la navigation principale à gauche de Klaviyo, sélectionnez Klaviyo Customer Hub.
2. Cliquez sur l'icône de l'engrenage dans le coin supérieur droit.
   
3. Sélectionnez Extensions.
4. Sous Favoris, cochez la case pour activer les favoris.
   
5. Dans la liste déroulante Choisir l' 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 favorisée) de l'icône. Cliquez sur l'icône dans l'aperçu pour la voir passer à l'état de favori.
6. Cliquez sur Enregistrer.

Un bouton favori apparaît désormais sous tous les produits présentés dans l'interface du Klaviyo Customer Hub. En cliquant dessus, vous ajoutez l'élément à la section Favoris.

Passez à la section suivante pour savoir comment ajouter des boutons de favoris aux pages de détails des produits. 

Ajoutez des boutons "favoris" aux pages de détail des produits

Permettez aux acheteurs de préférer des articles spécifiques qu'ils sont en train de vérifier en ajoutant des boutons de favoris sous les produits sur les pages de détails des produits. 

1. Dans le paramètre Favoris de Klaviyo, sélectionnez Ajouter un bloc d'applications. 
2. Cela permet de lancer l'éditeur de thème de Shopify dans une nouvelle fenêtre et d'afficher une fenêtre modale indiquant que le bloc d'application Klaviyo Favorites a été ajouté à votre modèle de page produit par défaut. Cliquez sur Je l'ai.
   
3. Cliquez et faites glisser l'application pour ajuster son positionnement sur la page de détails de votre produit. 
4. Lorsque vous êtes prêt, cliquez sur Enregistrer pour sauvegarder vos modifications dans Shopify. À ce stade, les boutons favoris s'affichent sous les produits sur vos pages produits. 
5. En option : Pour plus de style, retournez sur le site Klaviyo. En utilisant la liste déroulante du style du bloc App, vous pouvez personnaliser l'aspect du bouton des favoris sur les pages de produits. Vous avez le choix entre deux options :
   
   • Hériter pour synchroniser les styles de boutons de votre site (par défaut).
   • Personnalisé pour sélectionner une police de bouton et une couleur de texte particulières.
     
6. Enregistrez les modifications.

Naviguez à nouveau vers votre site web. Vous devriez voir des boutons de favoris apparaître sous les produits sur vos pages de détails.

Passez ensuite à la section Ajouter des boutons de favoris aux pages de vos collections. 

Installez manuellement vos boutons préférés (thèmes vintage ou personnalisés).

Si vous utilisez un thème Shopify ancien, ou une configuration personnalisée qui n'assiste pas l'app bloc, vous devrez peut-être installer manuellement l'app Klaviyo Wishlist sur les pages où vous souhaitez des actions de favoritisme (par exemple, les pages de produits).

Pour ce faire :

1. Ouvrez votre Shopify point de vente admin.
2. Dans le canal de vente, sélectionnez boutique en ligne.
3. Cliquez sur le menu à trois points de votre thème actuel, puis sélectionnez Modifier le code. Si vous préférez le tester sur un thème provisoire, dupliquez d'abord votre thème actuel, puis modifiez le code du thème dupliqué.
   
4. Recherchez le fichier de la page de détails de votre produit. Elle varie selon le thème, mais comporte généralement le mot "produit" dans son nom. 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 point de vente.
8. Naviguez vers une page de produit dans l'aperçu de votre point de vente. Le bouton d'ajout de favoris doit être visible à l'endroit prévu à cet effet.

Ajoutez des boutons favoris à vos pages de collections

Installez un petit bout de code sur votre site Shopify pour ajouter des boutons de favoris à vos pages de collections afin que les acheteurs puissent rapidement sauvegarder des articles lorsqu'ils parcourent vos produits. C'est particulièrement utile pour les acheteurs qui utilisent des appareils mobiles.

Pour ce faire :

1. Ouvrez votre Shopify point de vente admin.
2. Dans le canal 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 tester un thème provisoire, 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 des 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 permet d'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 concerné (par exemple, card-product).
     
6. Dans la barre latérale de gauche, recherchez et ouvrez le fichier de snippets identifié à l'étape précédente (par exemple, card-product.liquid).
7. En haut de ce fichier, notez la valeur de l'objet répertorié sous "Accepte" (par exemple, "card_product").
   
8. Copiez le code suivant et collez-le dans le fichier snippet :
   • Conseil : Recherchez la première occurrence du rendu de prix dans votre fichier et collez le code au-dessus.
     <div

    class="Klaviyo-favorites-plp-slot"

   données-product-id="{{ OBJECT.id }}"

   données-product-url="{{ OBJECT.url }}"

   données-variante-id="{{OBJECT.selected_or_first_available_variant.id}}"

  ></div>
9. Dans le code que vous avez collé, remplacez OBJECT par la valeur de l'objet que vous avez notée plus tôt.
   • Par exemple, si la valeur de l'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. Allez sur la page des collections de votre site et actualisez.

Vous devriez maintenant voir les boutons de favoris apparaître 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 avec des feuilles de style CSS personnalisées. 

Si les boutons favoris n'apparaissent toujours pas, essayez les étapes de dépannage suivantes :

• Confirmez que vous avez remplacé OBJECT dans l'extrait de code par la valeur de l'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.

Si elles n'apparaissent toujours pas, demandez l'aide d 'un développeur. KlaviyoL'équipe d'assistance du site n'est pas en mesure d'éditer directement les fichiers de votre thème.

Prochaines étapes

Maintenant que vous avez ajouté des boutons de favoris sur votre site, mettez en place un flux de rappel des favoris pour favoriser la conversion en rappelant aux acheteurs les articles qu'ils ont récemment sauvegardés.

Ressources supplémentaires

• Démarrer avec Klaviyo Customer Hub
• Comment activer les recommandations de produits dans Klaviyo Customer Hub ? 
• Comment styliser votre Hub client Klaviyo