Chat-Widget in Shopify einbinden

In Shopify fügst du die Chat-Bubble mit einem einzigen Script-Tag in dein Theme ein. Du musst keine App installieren, und die Produktsuche funktioniert mit den öffentlichen Daten deines Shops, ganz ohne API-Key.

Snippet kopieren

Öffne den Tab Share deines Agenten. Klicke auf der Karte Shopify auf Copy Code. Es ist dasselbe Script wie auf der Karte Bubble Chat, deine Agenten-ID ist bereits enthalten:

<script src="https://www.intochat.ai/api/embed.js" data-chatbot-id="YOUR_AGENT_ID"></script>

Ins Theme einfügen

1. Gehe im Shopify-Admin zu Onlineshop → Themes.
2. Klicke neben deinem aktuellen Theme auf ⋯ und wähle Code bearbeiten.
3. Öffne im Ordner Layout die Datei theme.liquid.
4. Füge das Snippet direkt über </body> ein und klicke auf Speichern.
5. Öffne deinen Shop. Die Chat-Bubble erscheint unten in der Ecke jeder Seite, die dieses Layout nutzt, mit den Farben und der Position aus dem Tab Appearance.

Direkt über </body> ist der empfohlene Platz, das Snippet funktioniert aber auch im <head>-Bereich von theme.liquid. Steht es zweimal im Theme, erscheint trotzdem nur eine Bubble.

Produkte durchsuchen lassen

1. Öffne den Tab Actions (Aktionen) und wähle Connect your website.
2. Füge die Adresse deines Shops ein. intoCHAT erkennt Shopify und legt zwei Aktionen an: Search products mit bis zu fünf Treffern pro Suche und Get product details mit Varianten, Preisen und Lagerbestand.
3. Teste im Playground: Frag nach einem Produkt, einem Preis oder ob etwas vorrätig ist. Die Antworten zeigen Produktkarten mit Bild, Preis und Link zur Produktseite.

Die Produkte werden live gesucht, während Besucher chatten. Neue Produkte und Preisänderungen erscheinen also ohne neues Training. Die Verbindung liest nur öffentliche Produktdaten. Bestellungen, Warenkörbe und Kundendaten sieht sie nicht, der Agent kann also keine Bestellungen abfragen, keine Rücksendungen abwickeln und nicht im Chat zur Kasse gehen. Stattdessen verweist er auf die passende Seite.

Ist dein Shop passwortgeschützt, sieht der Agent keine Produkte. Entferne das Passwort unter Onlineshop → Präferenzen und verbinde den Shop erneut. Details unter Shop verbinden.

Mit den Inhalten deines Shops trainieren

Gib im Tab Knowledge (Wissen) die Adresse deines Shops ein und wähle deine Versand-, Rückgabe- und FAQ-Seiten aus. Lade Größentabellen oder Richtlinien als Dateien hoch und lege Q&A-Paare für Antworten an, die genau so formuliert sein müssen.

Fehlerbehebung

• Keine Bubble im Shop. Prüfe, ob du das veröffentlichte Theme bearbeitet hast und nicht eine Kopie, und ob das Snippet in theme.liquid über </body> steht.
• „Chatbot not found.“ in der Browserkonsole. Die Agenten-ID im Snippet stimmt nicht. Kopiere sie erneut aus dem Tab Share.
• „Connect your website“ schlägt fehl. Prüfe, ob die Adresse deine öffentliche Storefront ist und der Shop nicht passwortgeschützt ist.

Weitere Fälle findest du unter Fehlerbehebung. Was der Agent in einem Shopify-Shop kann, zeigt die Shopify-Integrationsseite.