Mes modifications d'Apparence ne s'affichent pas sur la boutique en ligne

Les paramètres de la page Apparence de l'admin Olvio déterminent l'aspect du widget sur vos pages produit et dans son panneau de chat. Si une modification ne s'affiche pas sur votre boutique en ligne, effectuez les vérifications ci-dessous dans l'ordre.

La page Apparence est disponible dès que vous avez choisi un forfait. La traduction automatique du Nom de l'expert et de la Question d'accroche nécessite le forfait Growth ou Scale.

Vérifier que la modification est enregistrée

Votre boutique en ligne ne reçoit une modification qu'une fois celle-ci enregistrée. L'Aperçu en direct de la page Apparence se met à jour pendant que vous modifiez les paramètres : il peut donc afficher des modifications que votre boutique en ligne n'a pas encore reçues.

Après avoir modifié un paramètre, cliquez sur Enregistrer dans la barre d'enregistrement.
Attendez le message Modifications enregistrées.

Si un message d'erreur s'affiche à la place de Modifications enregistrées (par exemple Too many requests), votre modification n'a pas été enregistrée. Réessayez. Vous ne pouvez pas non plus cliquer sur Enregistrer tant qu'un champ de couleur affiche Format attendu : #rrggbb. Saisissez d'abord un code à six chiffres, par exemple #7b3fe4.

Recharger la page produit

Ouvrez ou rechargez une page produit qui affiche le widget Olvio.
Si elle n'a pas changé, attendez deux minutes et rechargez-la de nouveau.
Vérifiez aussi la page dans une fenêtre de navigation privée. Le widget mémorise une conversation ouverte et ses questions suggérées dans le même onglet du navigateur : une fenêtre privée montre donc la page telle qu'un nouvel acheteur la voit.
Les modifications de l'avatar, ainsi que de Bulle de conversation et de Bouton d'ajout au panier dans la carte Forme de l'onglet Panneau de chat, ne s'affichent que dans le panneau de chat. Posez une question dans le widget pour l'ouvrir.

Il arrive qu'une modification soit enregistrée dans Olvio sans parvenir à votre boutique en ligne, alors que le message Modifications enregistrées s'est affiché. Votre boutique en ligne conserve alors l'aspect précédent jusqu'à ce qu'Olvio envoie de nouveau vos paramètres, par exemple la prochaine fois que vous enregistrez sur la page Apparence. Pour renvoyer vos paramètres, modifiez n'importe quel paramètre et cliquez sur Enregistrer, puis rétablissez-le et cliquez de nouveau sur Enregistrer.

Les couleurs ou la taille de police ne changent pas : vérifier le bloc dans l'éditeur de thème

Le bloc Olvio — Product page de l'éditeur de thème Shopify comporte deux paramètres qui remplacent certains de vos paramètres d'Apparence pour tous les produits qui utilisent ce modèle de produit :

« Use custom colors for this block » : les couleurs propres au bloc remplacent vos sept couleurs d'Apparence.
« Use custom font size for this block » : le paramètre Base font size du bloc remplace celui défini sur la page Apparence.

Tant que l'une de ces cases est cochée, modifier le même paramètre sur la page Apparence n'a aucun effet visible sur ces pages produit ni sur le panneau de chat qui s'ouvre depuis celles-ci. L'Aperçu en direct d'Olvio n'affiche pas ces remplacements.

Dans l'éditeur de thème Shopify, ouvrez le modèle de produit dans lequel vous avez ajouté le bloc Olvio, puis sélectionnez le bloc Olvio — Product page.
Décochez « Use custom colors for this block » et « Use custom font size for this block », ou définissez les valeurs souhaitées dans le bloc.
Cliquez sur Enregistrer dans l'éditeur de thème.

Les paramètres de couleur du bloc partent des couleurs par défaut d'Olvio, et non de vos couleurs d'Apparence. Si vos produits utilisent plusieurs modèles de produit, vérifiez le bloc dans chacun d'eux. La police, le rayon des coins, l'avatar et le CSS personnalisé proviennent toujours de la page Apparence, et le Nom de l'expert et la Question d'accroche de Widget → Product Detail Page. Pour trouver le bloc, consultez Ajouter le widget Olvio à vos pages produit.

La police ne change pas

Olvio ne charge aucun fichier de police. En dehors de Default (système), la police que vous choisissez dans le menu Police, ou que vous saisissez dans font-family CSS après avoir choisi Personnalisée en bas de ce menu, doit déjà être chargée par votre thème Shopify ou installée sur l'appareil de l'acheteur. Sinon, le navigateur de l'acheteur utilise la police disponible suivante dans la liste, par exemple une police sans-serif générique, ou choisit lui-même une police si aucune police de la liste n'est disponible.

Une police peut s'afficher correctement sur votre propre ordinateur parce qu'elle y est installée, et être malgré tout remplacée sur les appareils des acheteurs. Vérifiez aussi la page sur un autre appareil.
L'Aperçu en direct utilise les polices disponibles dans votre navigateur, et non celles que charge votre thème : il peut donc afficher une police que votre boutique en ligne ne peut pas afficher. Par exemple, l'admin Olvio charge Inter : Inter s'affiche donc toujours dans l'Aperçu en direct, même si votre thème ne la charge pas.
Le CSS personnalisé ne peut pas charger une police depuis un autre site web : les règles @import et les liens url() qui commencent par http://, https:// ou // sont supprimés à l'enregistrement.
Dans le menu Police, si vous choisissez Personnalisée et laissez font-family CSS vide, le widget utilise Default (système).

Pour choisir une police chargée par votre thème, consultez Personnaliser la police et la taille de police du widget.

Le CSS personnalisé n'a aucun effet

Le CSS personnalisé ne s'affiche jamais dans l'Aperçu en direct. Comme l'indique la page Apparence : Le CSS personnalisé n'est appliqué que sur le widget en direct. Vérifiez vos règles sur une page produit de votre boutique en ligne, et ouvrez le panneau de chat pour vérifier les règles qui le mettent en forme.

Ajoutez !important à chaque propriété que vous surchargez. Les styles d'Olvio l'utilisent aussi : sans lui, votre règle cède la place au style par défaut d'Olvio.
Olvio ajoute html devant vos sélecteurs pour les aider à primer, mais pas à l'intérieur de @media ni des autres règles @. Commencez vous-même ces sélecteurs par html, par exemple @media (max-width: 600px) { html .olvio-title { font-size: 1.2em !important; } }.
En dehors des règles @, ne commencez pas vous-même un sélecteur par html ou :root : avec le préfixe qu'Olvio ajoute, ce sélecteur ne cible plus aucun élément. Olvio ajoute aussi le préfixe après les virgules à l'intérieur de :has() et à l'intérieur des valeurs d'attribut entre guillemets : cette partie du sélecteur ne cible alors plus rien. Évitez les virgules à ces endroits.
Ciblez les classes d'Olvio, comme .olvio-panel, .olvio-msg-user, .olvio-msg-assistant, .olvio-suggestion-btn, .olvio-atc-btn, .olvio-input-row, .olvio-label et .olvio-title.
Après l'enregistrement, le champ affiche votre CSS tel qu'Olvio l'a enregistré. Comparez-le avec ce que vous avez collé : Olvio supprime les règles @import, les commentaires, les images ou polices chargées depuis d'autres sites web via url(), ainsi que toute règle dont le sélecteur cible la zone inférieure du panneau de chat (.olvio-panel-footer, .olvio-brand-mention ou .olvio-panel-input), même si la règle liste aussi d'autres sélecteurs. Pour mettre en forme le champ de question, utilisez .olvio-input-row.

Pour la liste complète de ce qu'Olvio supprime et d'autres exemples, consultez Ajouter du CSS personnalisé au widget.

Le Nom de l'expert ou la Question d'accroche ne s'affiche pas comme prévu

Vous avez vidé le champ, mais un texte s'affiche toujours. Un Nom de l'expert ou une Question d'accroche vide n'est pas masqué : le widget affiche à la place son texte par défaut, par exemple YOUR EXPERT, ou VOTRE EXPERT lorsque le widget est en français. Le champ de Widget → Product Detail Page affiche lui aussi de nouveau le texte par défaut la prochaine fois que vous ouvrez la page. Pour masquer le Nom de l'expert, ajoutez .olvio-label { display: none !important; } à votre CSS personnalisé.
Le Nom de l'expert est en lettres capitales. Le widget l'affiche en lettres capitales, quelle que soit la casse saisie. Pour changer cela, ajoutez .olvio-label { text-transform: none !important; } à votre CSS personnalisé.
Le texte n'est pas exactement celui que vous avez saisi, ou l'ancienne formulation s'affiche encore (Growth et Scale). Sur ces forfaits, lorsque votre widget couvre, en plus de votre langue par défaut, au moins l'une des langues suivantes : anglais, français, allemand, espagnol, italien ou portugais, Olvio traduit votre Nom de l'expert et votre Question d'accroche à l'enregistrement. Le widget affiche ces traductions en priorité, y compris sur les pages dans votre langue par défaut lorsque celle-ci fait partie de ces six langues. Si votre langue par défaut ne fait pas partie de ces six langues et que votre widget couvre l'anglais, les pages dans votre langue par défaut affichent la traduction anglaise. Dans les deux cas, les acheteurs dans votre langue par défaut voient une version traduite, qui peut différer de ce que vous avez saisi. Si la traduction ne peut pas être effectuée, vos modifications sont tout de même enregistrées, mais le widget conserve les traductions effectuées précédemment : les acheteurs peuvent donc encore voir votre ancienne formulation. Sans clé API, aucune erreur ne s'affiche ; avec une clé, un message indique que vos modifications n'ont pas pu être traduites.

Pour qu'Olvio traduise de nouveau votre texte, vérifiez que votre clé est connectée sur la page Clé API (consultez Connecter votre clé API Anthropic (Claude)). Modifiez ensuite le Nom de l'expert ou la Question d'accroche, cliquez sur Enregistrer, remettez votre formulation et cliquez de nouveau sur Enregistrer. Une nouvelle traduction crée une nouvelle version, qui peut elle aussi différer de ce que vous avez saisi.

Votre texte n'est pas traduit

Olvio traduit le Nom de l'expert et la Question d'accroche lorsque toutes ces conditions sont réunies :

Votre boutique est sur le forfait Growth ou Scale. Sur Starter, le texte que vous saisissez vous-même s'affiche tel que vous l'avez saisi, sur toutes les pages. S'il correspond exactement au texte par défaut (YOUR EXPERT ou « Any question about this product? »), le widget affiche à la place son texte par défaut intégré, traduit lorsque la langue par défaut de votre boutique est le français, l'allemand, l'espagnol, l'italien ou le portugais (par exemple VOTRE EXPERT).
Votre clé API Anthropic est enregistrée sur la page Clé API. Les traductions utilisent votre clé : elles sont donc facturées sur votre compte Anthropic.
La langue fait partie de celles que couvre votre widget, et il s'agit de l'anglais, du français, de l'allemand, de l'espagnol, de l'italien ou du portugais. Olvio ne traduit pas ce texte dans d'autres langues.
Votre widget couvre au moins l'une de ces six langues en plus de votre langue par défaut. Par exemple, si vous avez décoché toutes les langues dans la carte Langues de l'onglet Avancé lorsque vous étiez sur Growth, ou si votre boutique ne publie aucune de ces langues en plus de votre langue par défaut, Olvio ne traduit pas votre texte. Si votre langue par défaut fait partie de ces six langues, que votre widget couvre encore une autre langue et que votre texte a déjà été traduit, les acheteurs continuent de voir cette ancienne traduction au lieu de votre nouveau texte.
Vous enregistrez une modification du Nom de l'expert ou de la Question d'accroche, ou vous enregistrez n'importe quelle modification alors que l'une de ces six langues couvertes par votre widget n'a pas encore de traduction. Olvio complète aussi les traductions manquantes lorsque vous passez à Growth ou Scale alors que votre clé est enregistrée.

Connecter une clé API ne traduit pas votre texte à lui seul. Si votre texte n'a jamais été traduit, cliquez sur Traduire maintenant dans le bandeau Certaines langues ne sont pas encore traduites de Widget → Product Detail Page. Si une traduction existe déjà, modifiez le Nom de l'expert ou la Question d'accroche et cliquez sur Enregistrer, puis remettez votre formulation et cliquez de nouveau sur Enregistrer, comme décrit ci-dessus. Si le widget affiche la mauvaise langue sur une page, consultez Le widget ou l'IA utilise la mauvaise langue.

Autres problèmes

Le widget n'apparaît pas sur les pages dans certaines langues : vérifiez si Masquer le widget sur les langues qu’Olvio ne couvre pas est coché dans la carte Langues de l'onglet Avancé. Consultez Multilingue : choisir les langues couvertes par votre widget.
Le widget n'apparaît pas du tout : consultez Le widget n'apparaît pas sur ma boutique en ligne.
Aucune question suggérée : consultez Les questions suggérées n'apparaissent pas sur mes pages produit.

Si votre modification ne s'affiche toujours pas, contactez-nous via le chat de l'admin Olvio. Indiquez le lien de la page produit et le paramètre que vous avez modifié. Consultez Nous contacter et horaires de support.