Hier zeigen wir die Codes, mit denen du deinen Chatbot ganz einfach auf deiner Webseite integrieren kannst
Das Chat-Widget von moinAI wird mit einem einfachen Javascript auf der Website hinzugefügt.
Im moinAI Hub findest du im Menü Widget & Teaser unter Widget Darstellung den Integrationscode:
Für den Go-live muss der folgende Code des Chat-Widgets
a) im Head-Bereich der Website oder
b) z.B. über den Google Tag Manager integriert werden.
<script type="text/javascript" id="moinloader" src="https://widget.moin.ai/moin-loader.js?id=IHRE_BOT_ID_HIER"></script>
Vor dem Go-Live muss der Stand des Chatbots im Hub veröffentlicht werden, sodass der Live-Chatbot auf den aktuellen Stand gesetzt wird.
In dem Artikel zu Chat-Widget Anpassungen sind mögliche Änderungen des Chat-Widgets beschrieben.
Chat-Widget API
Das Widget bietet eine JS API Funktion, über die weitere Steuerungsoptionen zur Verfügung stehen, die in der technischen Dokumentation beschrieben sind.
Teaser Set Up und Integration
Der Teaser kann im moinAI Hub im Menü Widget & Teaser unter Teaser Setup erstellt werden, sobald das Chat Widget live auf der Website ist.
Google Tag Manager - Integration von Tags
YouTube Video (1 Min.) mit einer Anleitung für das Anlegen von Tags im GTM.
- Neues “benutzerdefiniertes HTML-Tag” anlegen.
- Widget Code einfügen.
- Als Trigger "All pages" wählen, um das Widget auf allen Unterseiten identisch zu integrieren. Alternativ die Unterseiten definieren, auf denen das Widget erscheinen soll.
- Den Vorgang identisch für den Teaser Code durchführen.
Anschließend empfiehlt es sich, die GTM-Testumgebung o.ä. aufzurufen, um die Integration zu überprüfen. Es gibt eine offizielle Anleitung zu dem GTM Preview Mode. Die Vorschau Funktion wird auch in diesem YouTube Video gezeigt.