Documentation

Shopify

Ajoutez votre agent à n’importe quelle boutique Shopify en collant le code d’intégration dans votre thème.

Ajoutez votre agent IA à une boutique Shopify en collant le code d’intégration dans le fichier theme.liquid de votre thème. Fonctionne avec tous les forfaits Shopify.

Récupérez d’abord votre code d’intégration depuis Chatbot > Publier dans le tableau de bord.

Méthode 1 : modifier theme.liquid (recommandé)

Ajoutez le widget sur tout le site en modifiant votre thème publié :

  1. Dans l’administration Shopify, accédez à Boutique en ligne → Thèmes.
  2. Sur la ligne de votre thème actif, cliquez sur le menu ... (Actions) → Modifier le code.
  3. Dans le dossier Layout à gauche, ouvrez theme.liquid.
  4. Faites défiler jusqu’en bas et collez votre code d’intégration juste avant la balise fermante </body>.
  5. Cliquez sur Enregistrer.

Exemple de format (utilisez les valeurs réelles de Chatbot > Publier) :

<script
  src="YOUR_WIDGET_URL"
  data-chatbot="YOUR_CHATBOT_ID"
  async
></script>

Le widget apparaît sur toutes les pages de la boutique : produit, collection, panier, accueil.

Méthode 2 : dupliquer d’abord, puis modifier

Si vous voulez pouvoir revenir en arrière en toute sécurité :

  1. Boutique en ligne → Thèmes.
  2. Sur votre thème actif, cliquez sur le menu ... (trois points) → Dupliquer. Une copie apparaît en bas de la liste des thèmes.
  3. Modifiez le fichier theme.liquid de la copie comme ci-dessus.
  4. Cliquez sur le menu ... de la copie → Aperçu pour tester.
  5. Une fois satisfait, cliquez sur le menu ... → Publier pour la mettre en ligne.

Méthode 3 : coller dans une page précise

Pour ajouter le widget uniquement sur une page (par exemple une page d’assistance) :

  1. Dans l’administration Shopify, accédez à Boutique en ligne → Pages.
  2. Ouvrez la page que vous voulez modifier.
  3. Cliquez sur l’icône <> (Afficher le code HTML) dans l’éditeur de contenu.
  4. Collez votre code d’intégration à la fin du contenu.
  5. Enregistrez.

Le widget ne se chargera que sur cette page.

Prérequis

  • Le thème que vous modifiez doit être un thème publié ou payant. Le code d’un thème d’essai ne peut pas être enregistré.
  • Le domaine de votre boutique doit figurer dans la liste des domaines autorisés de votre agent si les restrictions de domaine sont activées.

Après la publication

Shopify diffuse les ressources de la boutique depuis son CDN. Les changements se propagent en une minute ou deux. Si le widget n’apparaît pas :

  1. Actualisez la page en forçant le cache (⌘+Shift+R sur Mac, Ctrl+F5 sur Windows).
  2. Ouvrez le site dans une fenêtre de navigation privée.
  3. Vérifiez la console du navigateur pour repérer les erreurs.

Dépannage

Le widget n’apparaît pas.

  • Vérifiez que vous avez bien modifié le thème actif (ou publié la copie).
  • Vérifiez que l’extrait est placé avant </body>, et non dans <head>.
  • Vérifiez que le domaine de votre boutique est autorisé dans Chatbot > Publier > Sécurité.

Le widget chevauche le chat ou le tiroir de panier de Shopify.

  • Ajustez la position du widget dans les paramètres Design de votre agent.

Le widget apparaît dans l’éditeur mais pas sur la boutique en ligne.

  • Vérifiez que vous avez bien cliqué sur Enregistrer après le collage — l’éditeur de code n’enregistre pas automatiquement.

Tests

  1. Ouvrez votre boutique dans une fenêtre de navigation privée.
  2. Repérez la bulle de discussion dans le coin.
  3. Cliquez pour l’ouvrir et envoyer un message de test.

Connecter une boutique pour la recherche de commandes et de produits

Intégrer le widget et connecter votre boutique sont deux choses distinctes. Le code d’intégration ci-dessus place le widget de chat sur votre boutique en ligne. Une connexion Shopify distincte — effectuée depuis l’onglet Actions → Intégrations de votre agent — permet en plus à l’agent de rechercher dans votre catalogue en direct et de consulter le statut d’une commande au sein de la conversation.

Vous pouvez utiliser l’une ou l’autre indépendamment. Utilisez le widget seul si l’agent doit répondre uniquement à partir de votre contenu d’entraînement, et ajoutez la connexion à la boutique lorsque vous voulez des données produits et commandes en direct.

Connecter la boutique fournit les identifiants mais n’active rien en soi : ensuite, ajoutez les actions Rechercher des produits et Statut de commande sous l’onglet Actions de votre agent, puis activez chacune que vous voulez que l’agent utilise.

Configurer les actions Shopify →

Étapes suivantes