So fügen Sie den Asyntai AI Chatbot zu Shopify hinzu

Schritt-für-Schritt-Anleitung für Shopify-Shops

Plattform:

Schritt 1: Ihren Einbettungscode erhalten

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Hinweis: Der obige Code ist nur ein Beispiel. Sie müssen Ihren eigenen einzigartigen Einbettungscode von Ihrem Dashboard kopieren, da er Ihre persönliche Widget-ID enthält.

Schritt 2: Code zu Ihrem Shopify-Theme hinzufügen

Befolgen Sie diese Schritte, um den Chatbot zu Ihrem Shopify-Shop hinzuzufügen:

Melden Sie sich in Ihrem Shopify Admin-Panel an
Gehen Sie zu Online Store → Themes
Finden Sie Ihr aktuelles Theme und klicken Sie auf die Schaltfläche "..." (drei Punkte)
Wählen Sie "Edit code" aus dem Dropdown-Menü
Klicken Sie in der linken Seitenleiste unter Layout auf theme.liquid
Scrollen Sie nach unten, um das schließende </body>-Tag zu finden
Fügen Sie Ihren Asyntai-Einbettungscode direkt vor dem </body>-Tag ein
Klicken Sie oben rechts auf "Save"

Tipp: Verwenden Sie Ctrl+F (Windows) oder Cmd+F (Mac), um schnell nach </body> in der theme.liquid-Datei zu suchen.

Alternative: Shopify-App verwenden

Wenn Sie keinen Code bearbeiten möchten, können Sie eine Shopify-App verwenden, um benutzerdefinierte Skripte hinzuzufügen:

Gehen Sie zum Shopify App Store
Suchen Sie nach "Custom Script Injector" oder "Header & Footer Scripts"
Installieren Sie die App Ihrer Wahl
Verwenden Sie die App, um Ihren Asyntai-Einbettungscode zum Fußzeilenbereich hinzuzufügen

Schritt 3: Installation überprüfen

Nachdem Sie Ihre Änderungen gespeichert haben, besuchen Sie Ihren Shopify-Shop in einem neuen Browser-Tab oder Inkognito-Fenster. Sie sollten den Chat-Widget-Button in der unteren rechten Ecke Ihres Shops sehen. Klicken Sie darauf, um sicherzustellen, dass er sich öffnet und korrekt funktioniert.

Widget nicht sichtbar? Shopify kann Ihre Theme-Dateien cachen. Versuchen Sie, Ihren Shop in einem Inkognito-/Privatfenster zu öffnen, oder warten Sie einige Minuten und aktualisieren Sie die Seite.

Shopify Plus-Benutzer

Wenn Sie Shopify Plus verwenden, können Sie das Skript auch über die Datei checkout.liquid hinzufügen, um den Chatbot auf Checkout-Seiten anzuzeigen. Beachten Sie jedoch, dass die meisten Shops ihn nur auf den Hauptseiten des Shops benötigen.

Die KI-Suchleiste hinzufügen

Die KI-Suchleiste ist ein eigenes Widget mit eigenem Code. Fügen Sie sie zusätzlich zum Chat hinzu oder allein. Sie erfordert den Standard-Tarif oder höher: in einem niedrigeren Tarif erscheint die Leiste, liefert aber keine Ergebnisse.

Fügen Sie dem Script-Tag das Attribut data-replace hinzu, dann tritt die Leiste an die Stelle der vorhandenen. Fügen Sie es in theme.liquid direkt vor dem schließenden body-Tag ein, in dieselbe Datei wie den Chat-Code. Ihr Theme behält seine eigene Ergebnisseite, Enter funktioniert also genau wie vorher.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>

Die vollständige Anleitung zur KI-Suchleiste lesen