Shopify AI Chatbot einbinden: Flyweight Chat direkt auf eurer Seite nutzen

Der Flyweight AI Chatbot kann direkt auf jeder Seite eures Shopify-Shops eingebettet werden – zum Beispiel auf der Support, Kontakt oder FAQ-Seite. Das bietet gleich mehrere Vorteile: Kunden finden sofort Antworten, euer Support-Team wird entlastet und Anfragen werden automatisch effizient geroutet.

Warum den Chat direkt einbetten?

Ein eingebettetes Chat-Fenster sorgt dafür, dass eure Besucher zuerst mit der KI interagieren, bevor sie eine Nachricht an euer Team senden. Das spart nicht nur Zeit, sondern reduziert auch die Anzahl der Support-Tickets.

Win-Win-Situation:

• Kunden erhalten schneller Hilfe.
• Euer Support-Team hat weniger Aufwand.
• Ihr könnt klassische Kontaktoptionen reduzieren oder ganz entfernen.
• Wenn die KI etwas nicht weiß, verweist sie automatisch an den Support.

---

Variante 1: Einbinden via HTML

Wenn ihr euer Theme direkt bearbeiten möchtet, könnt ihr den Chat einfach in den HTML-Code der gewünschten Seite einfügen.

1. Wechselt im Shopify Admin zur gewünschten Seite.
2. Öffnet den HTML-Editor.
3. Fügt folgenden Code an der gewünschten Stelle ein

💡 Wichtig: Ihr müsst euren API Key in das Snippet einfügen. Hier zeigen wir, wie ihr euren API Key findet →

<div id="flyweight-chat-embedded" style="display: flex; align-items: center; justify-content: center;"></div>
<script>
(function flyweightEmbeddedChat() {
  const src = "https://assistant.flyweight.io/chat/index.js?embedded=true&id=flyweight-chat-embedded";
  const loaded = Array.from(document.scripts).some((s) => s.src === src);
  if (loaded) return;
  window.FlyweightChat = {
    embedded: {
      windowAppearance: {
        width: '600px',
        height: '600px',
      },
    },
  };
  const script = document.createElement('script');
  script.src = src;
  script.async = true;
  script.dataset.apiKey = "ADD YOUR API KEY HERE";
  document.head.appendChild(script);
})();
</script>

---

Variante 2: Einbinden in Seiten mit Template

Wenn ihr lieber über den Theme Editor arbeitet, könnt ihr Flyweight AI auch als App-Sektion hinzufügen.

1. Öffnet im Theme Editor das gewünschte Seitentemplate.
2. Klickt auf „Sektion hinzufügen".
3. Wechselt im Menü zu „Apps".
4. Wählt „Flyweight AI" aus.
5. Positioniert und skaliert die Sektion nach Wunsch.

---

Fazit

Mit wenigen Klicks könnt ihr den Flyweight AI Chatbot direkt auf eurer Shopify-Seite einbinden. So stellt ihr sicher, dass Kunden immer sofort Unterstützung erhalten – intelligent, automatisiert und rund um die Uhr.

Tipp: Nutzt die Routing-Funktion von Flyweight AI, um sicherzustellen, dass Anfragen automatisch an den richtigen Ansprechpartner weitergeleitet werden, falls die KI keine passende Antwort findet.