# Chat-Widget in Shopify einbinden

> Bring die intoCHAT-Chat-Bubble in deinen Shopify-Shop: ein Script-Tag in theme.liquid einfügen und den Shop verbinden, damit der Agent Produkte durchsucht.

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:

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

## Ins Theme einfügen

> Dupliziere dein Theme vorher, damit du eine Sicherung hast.

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](/de/docs/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.

> Ein Update auf eine neue Theme-Version oder ein Wechsel des Themes kann eingefügten Code entfernen. Prüfe danach, ob die Bubble noch da ist, und füge das Snippet bei Bedarf erneut ein.

## 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](/de/docs/connect-your-store).

## 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](/de/docs/troubleshooting). Was der Agent in einem Shopify-Shop kann, zeigt die [Shopify-Integrationsseite](/de/integrationen/shopify).