Erste Schritte mit Shopify

Verbinden Sie Ihren Shopify-Shop, damit die KI und die Agenten von HelpStack Fragen zu Bestellungen, Sendungsverfolgung und Produkten beantworten und optional ein Live-Chat-Widget auf Ihrer Storefront anzeigen können.

Was Sie bekommen#

Keine technischen Kenntnisse erforderlich. Die folgenden Schritte dauern etwa 10–15 Minuten und erfordern nichts weiter, als sich durch ein paar Einstellungsseiten zu klicken.

Gerade registriert? Wenn Sie beim Onboarding angegeben haben, dass Sie auf Shopify verkaufen, verbindet der Installationsschritt Ihren Shop für Sie und endet mit einem Klick im Theme-Editor. Die Schritte 1 und 3 unten können Sie dann überspringen.

Abrechnung. Ein verbundener Shopify-Shop bezahlt HelpStack über Shopify, auf der Preisseite der App in Ihrem Shopify-Admin, Sie zahlen also nie doppelt. Shops, die noch nicht verbunden sind, werden gebeten, sich vor der Tarifwahl zu verbinden.

Schritt 1 — Ihren Shop verbinden#

1. Gehen Sie in Ihrem HelpStack-Dashboard zu Einstellungen → Integrationen.
2. Suchen Sie die Shopify-Karte und klicken Sie auf Shopify verbinden.
3. Geben Sie die .myshopify.com-Domain Ihres Shops ein, zum Beispiel your-store.myshopify.com, und klicken Sie auf Verbinden.
4. Sie werden zu Shopify weitergeleitet. Klicken Sie auf Install (oder Approve), um HelpStack lesenden Zugriff auf Ihre Bestellungen, Kunden und Produkte zu gewähren.
5. Sie landen wieder in HelpStack mit einem grünen Verbunden-Status.

Das war's schon. Ab sofort sehen Agenten bei jeder Konversation ein Bestellungen-Panel in der Seitenleiste, und die KI kann Bestell- und Produktfragen beantworten.

Schritt 2 — Bestell- und Kundendaten freigeben (einmalig)#

Shopify verlangt eine separate Genehmigung, bevor eine App Bestell- und Kundendetails lesen darf. Bis das erledigt ist, antwortet die KI auf Bestellfragen mit „Zugriff eingeschränkt"; Produktfragen funktionieren auch ohne diese Genehmigung.

1. Öffnen Sie das Shopify-Partner-Dashboard unter dev.shopify.com und melden Sie sich an.
2. Klicken Sie in der linken Seitenleiste auf Apps und wählen Sie die HelpStack-App aus.
3. Gehen Sie zu API access (oder App setup → API access).
4. Suchen Sie Protected customer data access und klicken Sie, um es zu öffnen.
5. Aktivieren Sie das Order-Objekt und markieren Sie Name, Email und Phone.
6. Schreiben Sie als Grund: customer service — agents look up order status for shoppers.
7. Klicken Sie auf Save und warten Sie auf die Genehmigung von Shopify (für neue Apps in der Entwicklung normalerweise sofort).

Das machen Sie nur einmal. Die Berechtigung gilt auf App-Ebene und bleibt über Updates hinweg bestehen.

Die E-Mail-Adresse ist hier nicht optional. HelpStack vergleicht die E-Mail-Adresse der Bestellung mit der, die der Kunde angibt, bevor irgendetwas vorgelesen wird (siehe „Wie Bestellabfragen Ihre Kunden schützen" weiter unten). Ohne das Feld Email in Schritt 5 kann die KI nicht bestätigen, dass die Bestellung der fragenden Person gehört, und meldet deshalb, dass keine passende Bestellung gefunden wurde.

Wie Bestellabfragen Ihre Kunden schützen#

Die Chat-Blase in Ihrem Shop kann jeder öffnen, und Bestellnummern laufen meist fortlaufend — 1001, 1002, 1003. Eine Bestellnummer allein ist deshalb kein Nachweis. HelpStack behandelt sie nur als halbe Antwort:

• Für die Abfrage einer bestimmten Bestellung braucht die KI die Bestellnummer und die E-Mail-Adresse, mit der die Bestellung aufgegeben wurde. Hat der Kunde nur eine Nummer genannt, fragt der Assistent zuerst nach der E-Mail-Adresse.
• Passen beide nicht zusammen, erhält der Kunde die Auskunft, dass keine passende Bestellung gefunden wurde. Er erfährt nicht, dass die Bestellung existiert und nur die E-Mail-Adresse falsch ist, denn schon das würde bestätigen, dass eine fremde Bestellung echt ist.
• Kundenverlauf (Anzahl der Bestellungen, Gesamtausgaben) wird ausschließlich für die Person in dieser Konversation angezeigt. Die KI lässt sich nicht dazu überreden, den von jemand anderem zu holen.
• „Meine Bestellungen per E-Mail finden" funktioniert unverändert: Wer seine Adresse angibt, bekommt seine eigenen Bestellungen zurück.

Ihr eigenes Team ist davon nicht betroffen. Das Bestellungen-Panel in der Seitenleiste ist für angemeldete Agenten gedacht, die in Ihren eigenen Shop schauen, und zeigt weiterhin alles wie bisher.

Schritt 3 — Das Chat-Widget auf Ihrer Storefront anzeigen (optional)#

Dieser Schritt fügt eine Chat-Blase zu Ihrem Shopify-Shop hinzu, damit Kunden Fragen stellen können, ohne die Seite zu verlassen. Überspringen Sie diesen Schritt, wenn die KI nur Fragen beantworten soll, die über andere Kanäle eingehen (E-Mail, Instagram und so weiter).

3a — Das Widget in HelpStack aktivieren

1. Gehen Sie zu Einstellungen → Integrationen und öffnen Sie den Bereich Storefront-Widget.
2. Aktivieren Sie den Schalter Storefront-Widget aktivieren.
3. Wählen Sie unter Standardkanal den Website-Chat-Kanal aus, den Sie verwenden möchten. (Legen Sie zuerst einen unter Einstellungen → Kanäle an, falls Sie das noch nicht getan haben.)
4. Optional können Sie sprachspezifische Zeilen hinzufügen: Kunden, deren Browser auf diese Sprache eingestellt ist, werden zu einem anderen Kanal geleitet. Nicht zugeordnete Sprachen verwenden den Standardkanal.
5. Klicken Sie auf Speichern.

3b — Das Widget zu Ihrem Theme hinzufügen

Wählen Sie eine der beiden folgenden Methoden:

Option A — App embed (empfohlen, kein Code)

Mit der Methode App embed können Sie das Widget mit einem einzigen Klick im Shopify-Theme-Editor ein- und ausschalten. Es sind keine Code-Änderungen nötig. Dies funktioniert mit allen Online Store 2.0-Themes.

1. Gehen Sie in Ihrem Shopify-Adminbereich zu Online Store → Themes.

2. Klicken Sie neben Ihrem aktiven Theme auf das Stift-Symbol (Edit) oder auf Customize.

   

3. Suchen Sie im sich öffnenden Theme-Editor in der linken Seitenleiste nach dem Bereich App embeds (Puzzle-Symbol, weiter unten).

4. Suchen Sie in der Liste HelpStack Chat und schalten Sie es auf ON.

   

5. Klicken Sie oben rechts im Theme-Editor auf Save.

Die Chat-Blase erscheint sofort auf Ihrer Storefront.

Option B — Manuelles Snippet

Verwenden Sie diese Methode, wenn Ihr Theme keine App embeds unterstützt (ältere Debut- oder Brooklyn-Themes).

1. Gehen Sie in HelpStack zu Einstellungen → Integrationen und kopieren Sie das Snippet, das im Bereich Storefront-Widget angezeigt wird. Es sieht so aus:

   <script src="https://helpstack.eu/api/shopify/storefront-widget.js?shop=your-store.myshopify.com" async></script>
   

2. Gehen Sie in Ihrem Shopify-Adminbereich zu Online Store → Themes → Edit code.

3. Öffnen Sie theme.liquid (im Ordner Layout).

4. Fügen Sie das Snippet direkt vor dem schließenden </body>-Tag ein.

5. Klicken Sie auf Save.

Problembehandlung#

Verwandte Themen#

• Widget-Einbettung
• Benutzerdefinierte Agent-Tools
• Erste Schritte mit WooCommerce
• Kanal-Leitfaden