Erfahren Sie, wie Sie Ihren benutzerdefinierten Chatbot problemlos in Ihre Website integrieren können.

Die Integration des Swiftron-Chatbots in Ihre Website ist einfach und schnell. Mit nur einer einmaligen Integration und ohne laufende Änderungen können Sie das Engagement Ihrer Kunden nahtlos verbessern. Befolgen Sie diese einfachen Schritte, um loszulegen:

Schritt 1: Kopieren Sie den Integrationscode

Gehe zu Swiftron Integrationsseite und kopiere den folgenden Code:

<script async type="module" project-id="YOUR_PROJECT_ID" lang="auto" src="https://swiftron.eu/static/js/chatbot-boot.min.js"></script>
  • projekt-id: Dies ist Ihre eindeutige Projekt-ID und wird vorausgefüllt.
  • lang: Die Zielsprache für Ihren Chatbot. Sie können verwenden:
    • Jeden gültigen Sprachcode aus ISO 639 Sprachcodes (z.B. 'en' für Englisch, 'de' für Deutsch).
    • 'auto', das die Sprache basierend auf den Einstellungen des Browsers des Benutzers auswählt.
    • 'site', das die Sprache verwendet, die im HTML-Header der Website angegeben ist. Dies liest den Wert von document.documentElement.lang und setzt die Sprache des Chatbots entsprechend.

Schritt 2: Fügen Sie den Code auf Ihrer Website ein

Verwendung eines Website-Baukastens:

Wenn Sie Website-Builder wie Jimdo, WordPress oder Squarespace verwenden, folgen Sie deren Anweisungen, um benutzerdefinierten Code einzufügen:

Eigenen Code verwalten:

Fügen Sie den kopierten Integrationscode in den HTML-Code jeder Seite ein, auf der der Chatbot erscheinen soll. Hier ist ein Beispiel:

<! DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Site</title>
  </head>
  <body>
    <div>Your Content</div>
  </body>
  <script async type="module" project-id="YOUR_PROJECT_ID" lang="auto" src="https://swiftron.eu/static/js/chatbot-boot.min.js"> </script>
</html>

Toggle-Chatbot-Button festlegen (Optional)

Wenn Sie bereits ein vorhandenes Kommunikationsfeld haben oder Ihren eigenen Button zum Öffnen oder Schließen des Chatbots erstellen möchten, können Sie ihn ganz einfach integrieren, indem Sie seine ID in den 'Toggle-Chatbot-Button' Einstellungen auf der Swiftron-Integrationsseite hinzufügen.

Beispiel:

<button id="btn-toggle-chatbot">Ihr Chatbot-Symbol</button>

Setzen Sie einfach das 'Toggle-Chatbot-Button' Feld auf die ID Ihres Buttons, z.B. 'btn-toggle-chatbot'. Der Button-Typ kann beliebig sein (z.B. div, span). Sie müssen kein JavaScript oder Ereignis-Handler hinzufügen; der Swiftron-Chatbot erkennt diesen Button automatisch und verarbeitet die erforderliche Logik.

Wenn kein Element mit der angegebenen ID gefunden wird oder wenn das Feld 'Toggle-Chatbot-Button' leer ist, erstellt Swiftron einen eigenen Toggle-Button für den Chatbot auf Ihrer Seite.

Chatbot-Platzierung anpassen (Optional)

Sie können den Chatbot in ein bestimmtes Element einfügen, indem Sie dessen ID im 'Chatbot-Platzierung anpassen'-Feld auf der Swiftron-Integrationsseite angeben. Der Chatbot wird innerhalb dieses Elements angezeigt und ersetzt jeden vorhandenen Inhalt darin.

In diesem Fall wird kein Toggle-Chatbot-Button gerendert oder verwendet. Der Chatbot wird immer innerhalb des angegebenen Elements sichtbar sein und kann vom Benutzer nicht minimiert werden.