KI-Chatbot zu Shopify hinzufügen

Chatbot in 4 Schritten zu Shopify hinzufügen

1. 1.

   Chatbot erstellen

   Öffnen Sie den AI-Chatbot-Editor und geben Sie die Adresse Ihres Shops ein. Der Agent liest Ihre Seiten und liefert Wissen, einen Namen, einen Ton und eine Begrüßung.

2. 2.

   Mit Ihrem Shop trainieren

   Fügen Sie Produkt-, Versand- und Rückgabeseiten, Dateien und Q&A-Paare für die häufigsten Fragen Ihrer Kunden hinzu.

3. 3.

   Code abrufen

   Passen Sie das Aussehen an, klicken Sie auf Kostenlos zur Website hinzufügen und kopieren Sie den Installationscode.

4. 4.

   In Ihr Theme einfügen

   Gehen Sie im Shopify-Adminbereich zu Online Store → Themes → Customize, fügen Sie einen Custom Liquid-Abschnitt hinzu, fügen Sie den Code ein und speichern Sie.

Was ein Shopify-Chatbot für Ihren Shop leistet

• Antworten vor dem Kauf – Größen, Kompatibilität, Lagerbestand, Lieferzeiten und Rückgaben, rund um die Uhr, wenn ein Kunde sonst abspringen würde.

• Hilfe bei der Auswahl – fragt, was Kunden brauchen, und verweist auf passende Produkte mit Link zur Produktseite. Siehe KI-Einkaufsassistent.

• Leads gewinnen – sammelt E-Mail-Adressen und Fragen vor dem Kauf zum Nachfassen.

• Übergabe an Sie – zeigt Ihre Kontakte (WhatsApp, E-Mail, Telefon), wenn er nicht helfen kann oder ein Kunde nach einer Person fragt.

• Zeigt, was Kunden verwirrt – die Chats verraten, welche Produktbeschreibungen und Richtlinien überarbeitet werden sollten.

Chatbot mit den Inhalten Ihres Shops trainieren

1. 1.

   Webseiten

   Fügen Sie bis zu 200 Seiten hinzu: Produkt- und Kollektionsseiten, Versand, Rückgabe, FAQ, Über uns und Kontakt.

2. 2.

   Dateien

   Laden Sie Kataloge, Größentabellen oder Pflegehinweise als PDF, DOCX, TXT, JSON, HTML oder MD hoch (jeweils bis zu 100 MB). Ein Shopify-Produktexport ist eine CSV-Datei – speichern Sie ihn also zuerst in einem dieser Formate.

3. 3.

   Q&A-Paare

   Schreiben Sie Antworten auf die Fragen, die Sie jede Woche per E-Mail bekommen: „Wie sind Ihre Rückgabebedingungen?“, „Liefern Sie nach Kanada?“, „Verkaufen Sie Geschenkgutscheine?“

4. 4.

   Textblöcke

   Fügen Sie Ihre Rückgaberichtlinie in einfachen Worten ein – nicht die juristische Fassung – sowie alles, was auf keiner Seite steht.

Der Agent baut jede Antwort aus seinem gesamten Wissen auf, daher gibt eine Antwort Ihr Q&A nicht unbedingt wörtlich wieder. Selbst geschriebene Q&A und kurze Zusammenfassungen liefern meist bessere Antworten als lange Marketingtexte. Mehr dazu unter Wissensdatenbank für einen Chatbot erstellen.

Anweisungen für einen Shop-Assistenten schreiben

Legen Sie Rolle, Ton (Freundlich, Professionell, Locker, Direkt oder ein eigener) und Antwortlänge des Agenten fest und fügen Sie dann Regeln hinzu. Ein Beispiel zum Anpassen:

Du bist Eva, die Einkaufsassistentin von [Shopname].
Hilf Kunden, die passenden Produkte zu finden, und beantworte
Fragen zu Größen, Versand und Rückgabe.

- Antworte in 2–3 Sätzen, außer es werden Details gewünscht.
- Wird nach einem Produkt gefragt, schlage 2–3 Optionen aus dem Shop
  mit Link vor und frage nach Budget oder Größe, falls unklar.
- Du kannst keine Zahlungen annehmen oder Bestellungen aufgeben.
- Bei Fragen zu Bestellstatus und Kundenkonto verweise auf
  [Ihre Support-E-Mail] oder [Ihre Seite zum Bestellstatus].
- Erfinde niemals Produkte, Preise oder Richtlinien.

Lesen Sie die ersten Chats und passen Sie die Regeln dort an, wo Antworten abdriften. Siehe KI-Chatbot trainieren.

Chatbot zu Ihrem Shopify-Theme hinzufügen

Wählen Sie eine schwebende Chatblase für den ganzen Shop oder einen eingebetteten Chat auf einer Seite und fügen Sie den Code dann auf eine von zwei Arten hinzu.

Auf einer Seite oder Vorlage (Theme-Editor)

1. 1.

   Theme-Editor öffnen

   Gehen Sie im Shopify-Adminbereich zu Online Store → Themes → Customize.

2. 2.

   Vorlage wählen

   Öffnen Sie über das Drop-down oben die gewünschte Seite: Home page, Products, Collections oder eine bestimmte Seite.

3. 3.

   Custom-Liquid-Abschnitt hinzufügen

   Klicken Sie auf Add section, wählen Sie Custom Liquid und fügen Sie den Installationscode ein.

4. 4.

   Speichern

   Klicken Sie auf Save und laden Sie Ihren Shop neu. In der Products-Vorlage erscheint der Chatbot auf jeder Produktseite.

Auf jeder Seite (Theme-Code)

1. 1.

   Code-Editor öffnen

   Klicken Sie unter Online Store → Themes neben Ihrem Theme auf … und wählen Sie Edit code.

2. 2.

   theme.liquid öffnen

   Öffnen Sie im Ordner Layout die Datei theme.liquid.

3. 3.

   Einfügen und speichern

   Fügen Sie den Code direkt vor dem schließenden </body>-Tag ein und klicken Sie auf Save.

Das funktioniert mit Online-Store-2.0-Themes, kostenlosen und kostenpflichtigen Themes und jedem Shopify-Tarif. Nutzen Sie noch ein Vintage-Theme? Folgen Sie der Shopify-Installationsanleitung ↗ oder fordern Sie eine kostenlose Installation an ↗.

Chatbot an das Design Ihres Shops anpassen

• Starten Sie mit einem von sechs Themes und legen Sie dann Ihre Markenfarbe für jedes Element des Chats und die Schrift Ihres Shops fest.

• Wählen Sie den Launcher – eine Schaltfläche, eine Textschaltfläche, eine Schnelleingabe oder das Profil des Agenten – und platzieren Sie ihn links, rechts oder unten mittig.

• Geben Sie dem Agenten einen Namen, ein Bild und einen Untertitel wie „Ich helfe Ihnen bei der Auswahl“.

• Sie brauchen pixelgenaue Anpassungen? Nutzen Sie eigenes CSS.

Wo der Chatbot erscheinen sollte (und wo nicht)

Auf Produkt-, Kollektions- und Kontaktseiten haben Kunden Fragen. Auf der Warenkorbseite kann eine Chatblase vom Abschließen der Bestellung ablenken – blenden Sie sie dort per Seiten-URL-Regel aus und prüfen Sie, dass sie auf dem Smartphone nicht die Schaltfläche In den Warenkorb verdeckt. Der Shopify-Checkout lädt den Code Ihres Themes nicht, daher erscheint der Chatbot dort nicht.

Shopify Inbox, Chat-Apps oder ein KI-Chatbot?

Der Chatbot funktioniert auch außerhalb von Shopify – er bleibt Ihnen also erhalten, wenn Sie mit Ihrem Shop auf eine andere Plattform umziehen.

Fehlerbehebung

1. 1.

   Der Chatbot erscheint nicht

   Prüfen Sie, ob Sie den gesamten Code unverändert eingefügt und gespeichert haben; öffnen Sie den Shop in einem privaten Fenster, um den Cache auszuschließen.

2. 2.

   Der Code wird als Text angezeigt

   Sie haben ihn in ein Rich-Text-Feld eingefügt. Nutzen Sie stattdessen einen Custom-Liquid-Abschnitt oder theme.liquid.

3. 3.

   Er verdeckt auf dem Smartphone Schaltflächen

   Ändern Sie Position oder Abstände oder blenden Sie ihn für diese Seite auf Mobilgeräten aus.

4. 4.

   Chat-E-Mails kommen nicht an

   Prüfen Sie die Empfänger in den E-Mail-Benachrichtigungen des Chatbots und Ihren Spam-Ordner.