Afficher des cartes produit et permettre l'ajout au panier depuis le chat

Lorsqu'Olvio recommande d'autres produits de votre catalogue, il affiche des cartes produit sous sa réponse. Par défaut, chaque carte renvoie vers la page produit. Vous pouvez aussi permettre aux acheteurs de choisir une variante et de l'ajouter à leur panier sans quitter le chat. Les deux sont disponibles sur tous les forfaits.

Quand les cartes produit apparaissent

Les cartes apparaissent sous une réponse qui recommande, propose ou décrit d'autres produits de votre catalogue. Elles sont alignées sur une rangée que les acheteurs font défiler horizontalement.

Dans le chat de la page produit, une réponse n'affiche généralement pas plus de 6 cartes.
Dans les conversations Olvio Advisor, une réponse affiche jusqu'à 4 cartes. Olvio Advisor est disponible sur les forfaits Growth et Scale. Consultez Qu'est-ce qu'Olvio Advisor ?.

Aucun réglage ne permet de désactiver les cartes produit.

Ce qu'affiche une carte

Par défaut, chaque carte affiche l'image du produit (s'il en a une), son titre et son prix. Un clic sur une carte ouvre la page produit dans un nouvel onglet.

Prix : un produit à prix unique affiche ce prix, mis en forme selon la langue de la page de la boutique en ligne, par exemple €24.90 en anglais ou 24,90 € en français. Les prix des cartes sont exprimés dans la devise par défaut de votre boutique et correspondent aux prix synchronisés depuis votre catalogue. Ils ne sont pas convertis dans la devise dans laquelle l'acheteur navigue. Un produit à plusieurs prix affiche Dès suivi de son prix le plus bas. Un produit dont toutes les variantes sont gratuites affiche Gratuit.
Badge de réduction : lorsqu'un produit a un prix unique et un prix avant réduction supérieur à ce prix, un badge tel que -20% apparaît sur l'image. Le pourcentage est arrondi à l'inférieur.
Badge Épuisé : lorsqu'aucune variante du produit n'est disponible à la vente, un badge Épuisé apparaît sur l'image à la place du badge de réduction. Les produits de 50 variantes ou plus n'affichent jamais ce badge.

Les produits sans image n'affichent aucun de ces deux badges.

Activer l'ajout au panier dans le chat

Ouvrez Apparence dans le menu de l'application Olvio.
Cliquez sur l'onglet Avancé.
Dans la carte Ajout au panier dans le chat, cochez Activer l’ajout au panier dans le chat.
Cliquez sur Enregistrer dans la barre d'enregistrement. Le message Modifications enregistrées le confirme.

L'option est désactivée par défaut. Une fois que vous avez enregistré, elle s'applique aux réponses suivantes dans le chat de la page produit et dans les conversations Olvio Advisor.

Ce que voient les acheteurs quand l'ajout au panier est activé

Les cartes changent pour les produits qui ont au moins une variante disponible pouvant être proposée dans les menus déroulants :

Un bouton Ajouter au panier apparaît sous le prix.
Sous le bouton, un menu déroulant s'affiche pour chaque option qui a plus d'une valeur, comme Couleur ou Taille. Un produit sans option de ce type n'affiche que le bouton.
Les menus déroulants sont d'abord positionnés sur la première variante disponible. Les valeurs indisponibles avec les autres options sélectionnées sont grisées et barrées, et ne peuvent pas être choisies.
Le prix suit la variante sélectionnée. Une variante gratuite affiche Gratuit.
Si aucune variante disponible ne correspond aux options sélectionnées, le bouton indique Rupture de stock et n'est pas cliquable.
L'image, le titre et le prix ouvrent toujours la page produit dans un nouvel onglet. Ces cartes n'affichent pas le badge de réduction.

Les autres produits conservent la carte par défaut décrite plus haut. Les menus déroulants comprennent au maximum 50 variantes d'un produit.

Ce qui se passe quand un acheteur clique sur Ajouter au panier

Olvio ajoute une unité de la variante sélectionnée au panier Shopify de l'acheteur. Les acheteurs ne peuvent pas choisir de quantité dans le chat.
Le bouton affiche Ajout en cours... avec un indicateur de chargement, puis Ajouté au panier avec une coche.
Environ une seconde plus tard, la page se recharge pour que le panier de votre thème affiche le nouvel article, et le panneau de chat se rouvre.

Si le panier refuse l'article, le bouton affiche Erreur - réessayer, puis revient à Ajouter au panier au bout de quelques secondes pour que l'acheteur puisse réessayer.

Masquer les variantes gratuites

La carte Ajout au panier dans le chat contient aussi une case Masquer les variantes gratuites (prix 0). Elle est cochée par défaut et agit sur les prix des cartes même lorsque Activer l’ajout au panier dans le chat est décoché.

Cochée : les variantes à prix 0 sont ignorées quand Olvio calcule le prix de la carte et, si l'ajout au panier est activé, elles sont masquées dans les menus déroulants. Cela ne se produit que si le produit a aussi des variantes payantes. Un produit dont toutes les variantes sont gratuites reste affiché, au prix Gratuit, et si l'ajout au panier est activé, ses variantes restent sélectionnables. Si les seules variantes disponibles d'un produit sont gratuites, sa carte garde l'apparence par défaut, sans ajout au panier.
Décochée : les variantes à prix 0 sont prises en compte. Sur les cartes sans ajout au panier, un produit qui combine variantes gratuites et payantes affiche Dès avec un prix nul, par exemple Dès 0,00 €. Si l'ajout au panier est activé, ses variantes gratuites apparaissent dans les menus déroulants.

Cliquez sur Enregistrer dans la barre d'enregistrement pour appliquer la modification.

Le bouton Ajouter au panier du panneau de chat

Sur les pages produit qui affichent le widget Olvio, le panneau de chat affiche un bouton Ajouter au panier au-dessus du champ de question, pour le produit que l'acheteur consulte. Ce bouton ne dépend pas de Activer l’ajout au panier dans le chat.

Il affiche le prix et ajoute la variante actuellement sélectionnée sur la page produit.
Si cette variante est indisponible, il indique Rupture de stock et n'est pas cliquable.
Un clic fonctionne comme sur le bouton d'une carte : une unité est ajoutée, Ajouté au panier s'affiche, et la page se recharge avec le panneau de chat ouvert.
Il est masqué lorsque le panneau de chat affiche une conversation Olvio Advisor.

Accorder les cartes et les boutons à votre marque

Couleurs : les boutons d'ajout au panier utilisent votre Couleur d'accent et votre Avant-plan d'accent. Les noms de produit sur les cartes utilisent Texte, et les prix Texte atténué. Si la case « Use custom colors for this block » est cochée sur le bloc Olvio — Product page dans l'éditeur de thème, les couleurs du bloc remplacent celles-ci sur les pages produit qui affichent ce bloc. Consultez Personnaliser les couleurs du widget.
Rayon des coins : le curseur Bouton d'ajout au panier, dans la carte Forme de l'onglet Panneau de chat, règle les coins des boutons des cartes comme du bouton du panneau de chat. Les menus déroulants de variantes suivent le curseur Champ de saisie, et les images des cartes le curseur Bulle de conversation. Consultez Personnaliser le rayon des coins du widget.
CSS personnalisé : utilisez .olvio-card pour chaque carte, .olvio-card-atc pour les boutons des cartes et .olvio-atc-btn pour le bouton du panneau de chat. Ajoutez !important à chaque propriété que vous remplacez. Consultez Ajouter du CSS personnalisé au widget.

L'Aperçu en direct de la page Apparence montre le bouton Ajouter au panier du panneau de chat, mais pas les cartes produit. Vérifiez les cartes sur votre boutique en ligne.

Textes des cartes dans d'autres langues

Sur les cartes, Dès, Gratuit, Épuisé, Rupture de stock, Ajouter au panier, Ajout en cours..., Ajouté au panier et Erreur - réessayer suivent la langue de la page de la boutique en ligne. Ces textes existent en anglais, français, allemand, espagnol, italien et portugais, et les cartes utilisent l'anglais sur les pages dans d'autres langues. Vous ne pouvez pas les modifier. Les titres des produits et les valeurs des menus déroulants de variantes proviennent de votre catalogue, dans la langue par défaut de votre boutique, quelle que soit la langue de la page. Les liens des cartes ouvrent la page produit à son adresse par défaut, sans le préfixe de langue de la page où se trouve l'acheteur : le nouvel onglet peut donc afficher la page dans la langue par défaut de votre boutique. Consultez Multilingue : choisir les langues couvertes par votre widget.

Suivre les ajouts au panier

Lorsqu'un acheteur qui a discuté avec Olvio ajoute un produit au panier sur une page produit qui affiche le widget Olvio, dans les 7 jours avant ou après la conversation, que ce soit depuis une carte, le bouton du panneau de chat ou le bouton de votre thème quand celui-ci ajoute le produit sans charger une nouvelle page :

La conversation est marquée dans la colonne Ajouté au panier de Conversations.
Elle compte dans le Taux d'ajout au panier avec Olvio du Tableau de bord (cliquez sur Olvio dans le menu de l'application).

Un ajout effectué avant le premier message de l'acheteur n'est rattaché que si le même panier a déjà servi lors d'une conversation précédente avec Olvio. Sinon, les ajouts suivants faits avec le bouton de votre thème ne sont pas rattachés non plus, tant que l'acheteur n'a pas rechargé la page ou ouvert une autre page, même s'il discute entre-temps.

Les ajouts depuis les cartes Olvio Advisor sur des pages qui n'affichent pas le bloc du widget Olvio ne sont pas enregistrés comme ajouts au panier. Ces conversations ne sont marquées Ajouté au panier que si l'acheteur ajoute aussi un produit au panier dans les 7 jours sur une page produit qui affiche le widget Olvio, ou s'il a une commande attribuée.

Une conversation avec une commande attribuée dans les 7 jours avant ou après elle est aussi marquée Ajouté au panier et compte dans le Taux d'ajout au panier avec Olvio. Consultez Comment fonctionne l'attribution de conversion.

Tester votre configuration

Cochez Activer l’ajout au panier dans le chat et cliquez sur Enregistrer.
Ouvrez l'une de vos pages produit et demandez des alternatives, par exemple « Montrez-moi d'autres options. »
Sur une carte à plusieurs options, choisissez une valeur dans un menu déroulant, puis ouvrez un autre menu déroulant et vérifiez que les valeurs en rupture de stock avec ce choix sont barrées.
Si un produit combine variantes gratuites et payantes, vérifiez que sa carte correspond à votre choix pour Masquer les variantes gratuites (prix 0).
Cliquez sur Ajouter au panier sur une carte. Une fois la page rechargée, vérifiez que votre panier contient la variante et que le panneau de chat est de nouveau ouvert.
Ouvrez Conversations dans le menu de l'application Olvio et vérifiez que votre conversation de test est marquée Ajouté au panier.

Pour une vérification complète de votre boutique en ligne, consultez Tester Olvio sur votre boutique en ligne.