So fügen Sie den Asyntai-KI-Chatbot zu October CMS hinzu

Schritt-für-Schritt-Anleitung für October CMS-Websites

Plattform:

Schritt 1: Ihren Einbettungscode erhalten

Gehen Sie zunächst zu Ihrem Asyntai Dashboard und scrollen Sie zum Abschnitt "Einbettungscode". Kopieren Sie Ihren einzigartigen Einbettungscode, der so aussieht:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></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: Zur Layout-Vorlage hinzufügen (Empfohlen)

Der empfohlene Weg, den Chatbot hinzuzufügen, ist die Bearbeitung Ihres Standard-Layouts im October CMS-Backend:

Melden Sie sich in Ihrem October CMS-Backend an
Gehen Sie im Hauptmenü zu CMS > Layouts
Öffnen Sie Ihr Standard-Layout (normalerweise default.htm)
Suchen Sie das schließende </body> Tag und den {% scripts %} Platzhalter
Fügen Sie Ihren Asyntai-Einbettungscode direkt vor ein {% scripts %} und </body>:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% scripts %} </body>
Klicken Sie auf "Speichern", um Ihre Änderungen anzuwenden

Tipp: Placing the script before {% scripts %} and </body> ensures it loads after the page content, which is recommended for chat widgets and won't slow down your page loading.

Alternative Method 1: Using {% put scripts %} Block

Sie können den Scripts-Platzhalter von October CMS verwenden, um den Chatbot von einer Seite oder einem Partial einzufügen:

Öffnen Sie eine beliebige Seite oder ein Partial im CMS-Editor
Fügen Sie den folgenden Code hinzu unter Verwendung des {% put scripts %} Block:
{% put scripts %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endput %}
Ersetzen Sie YOUR_WIDGET_ID durch Ihre tatsächliche Widget-ID aus dem Dashboard
Klicken Sie auf "Save"

Hinweis: For this method to work, your layout must include the {% scripts %} placeholder in its markup. This is where October CMS renders all injected scripts. Most default layouts already include this tag.

Alternative Methode 2: Component-PHP verwenden

Wenn Sie einen programmatischen Ansatz bevorzugen, können Sie das Chatbot-Skript über eine benutzerdefinierte Komponente hinzufügen:

Erstellen oder ändern Sie eine Komponente in Ihrem October CMS-Plugin
Verwenden Sie in der Methode onRun() der Komponente die Methode addJs():
public function onRun() { $this->addJs('https://asyntai.com/static/js/chat-widget.js', [ 'async' => true, 'data-asyntai-id' => 'YOUR_WIDGET_ID' ]); }
Ersetzen Sie YOUR_WIDGET_ID durch Ihre tatsächliche Widget-ID
Registrieren Sie die Komponente auf den Seiten, auf denen der Chatbot erscheinen soll

Tipp: Die Verwendung einer Komponente gibt Ihnen programmatische Kontrolle darüber, wann und wo der Chatbot geladen wird. Sie können bedingte Logik in onRun() hinzufügen, um das Laden basierend auf Benutzerrollen, Seitentypen oder anderen Kriterien zu steuern.

Alternative Methode 3: Ein Partial verwenden

Sie können ein wiederverwendbares Partial für das Chatbot-Widget erstellen:

Gehen Sie im October CMS-Backend zu CMS > Partials
Klicken Sie auf "+ Hinzufügen", um ein neues Partial zu erstellen
Benennen Sie es asyntai-widget.htm
Fügen Sie Ihren Asyntai-Einbettungscode zum Partial hinzu:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Klicken Sie auf "Save"
Öffnen Sie Ihre Layout-Vorlage und binden Sie das Partial vor </body> ein:
{% partial 'asyntai-widget' %}
Speichern Sie das Layout

Tipp: Die Verwendung eines Partials erleichtert das Aktivieren oder Deaktivieren des Chatbots auf Ihrer gesamten Website, indem Sie einfach die Partial-Einbindung in Ihrem Layout hinzufügen oder entfernen.

Schritt 3: Installation überprüfen

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

Widget nicht sichtbar? Stellen Sie sicher, dass Sie alle Änderungen im CMS-Backend gespeichert haben. Leeren Sie Ihren Browser-Cache oder öffnen Sie die Seite in einem Inkognito-Fenster. Wenn Ihre Website Caching verwendet, leeren Sie den October CMS-Cache, indem Sie php artisan cache:clear über die Kommandozeile ausführen, oder verwenden Sie die Option Settings > System > Clear Cache im Backend.

Layout-Auswahl: Stellen Sie sicher, dass die Seiten, auf denen der Chatbot erscheinen soll, das richtige Layout verwenden. Sie können überprüfen, welches Layout eine Seite verwendet, indem Sie die Seite unter CMS > Pages öffnen und das Layout-Dropdown in den Seiteneinstellungen ansehen.