Zum Hauptinhalt springen
Unlisted page
This page is unlisted. Search engines will not index it, and only users having a direct link can access it.

Go-Live Embed

Embed Code

Mit dem folgenden Code-Snippet können Sie neurabot auf Ihrer Website als Chat-Bubble einbinden. Ein Einwilligungsbanner ist hier noch nicht enthalten — siehe unten.

<!-- Start neurabot -->
<script>
window.neurabotConfig = {
neurabotConfigId: "TODO",
mode: "FLOATING",
};
</script>
<script async type="module" src="https://prod-chat-app.neurabot.neuraflow.de/embed-loader.js"></script>
<!-- End neurabot -->

Ersetzen Sie TODO durch die ID, die Ihnen neuraflow zukommen lässt.

neurabot eingebettet auf einer Bremerhaven-Webseite

Ereignis-Banner

Das Ereignis-Banner in neurabot wird normalerweise genutzt, um im Chatbot selbst ein Banner zu einem bestimmten Ereignis anzuzeigen. Auf diesem Banner gibt es dann Funktionen für den Liveticker und einen Button, um Nachrichtenvorschläge direkt zu diesem Ereignis zu nutzen.

Es kann bei Bedarf aber auch ein Banner auf der Website direkt angezeigt werden. Meist wird dieser über oder unter der Navigationsleiste eingebunden.

Dazu erstellen Sie ein leeres div-HTML-Element, welches die komplette Breite der Website einnimmt. Dann geben Sie diesem eine ID, z. B. neurabot-website-moment-banner-container. Diese ID können Sie dann in den window.neurabotConfig-Einstellungen unter websiteMomentBannerContainerId angeben.

<body>
<div id="neurabot-website-moment-banner-container"></div>
<h1>Lorem Ipsum</h1>

<!-- Start neurabot -->
<script>
window.neurabotConfig = {
neurabotConfigId: "TODO",
mode: "FLOATING",
websiteMomentBannerContainerId: "neurabot-website-moment-banner-container",
};
</script>
<script async type="module" src="https://prod-chat-app.neurabot.neuraflow.de/embed-loader.js"></script>
<!-- End neurabot -->
</body>

Beispiel-Banner „Aktuelles zum Rathausumzug&quot; mit Buttons „Mehr erfahren&quot; und „Live-Ticker&quot;

Anbindung an Buttons oder Suchfelder

neurabot kann auch von außen gesteuert werden. Das heißt, Sie könnten weitere Buttons (z. B. Support-Buttons) dazu nutzen, neurabot zu öffnen. Dabei können Sie auch eine Nachricht mitgeben, die direkt vom Nutzer abgeschickt werden soll. So könnten Sie neurabot mit der Suchleiste Ihrer Website verbinden.

// Öffnet das Chat-Fenster
window.neurabot.openWindow(): void

// Schließt das Chat-Fenster
window.neurabot.closeWindow(): void

// Öffnet das Chat-Fenster, wenn es geschlossen ist; schließt es, wenn es offen ist
window.neurabot.toggleWindow(): void

// Öffnet das Chat-Fenster und sendet direkt eine Nachricht ab.
// Gibt einen boolean zurück, ob die Nachricht abgesendet werden konnte.
// Nachrichten können nicht direkt abgesendet werden, wenn gerade eine andere
// Nachricht abgesendet wurde und die Antwort noch lädt.
window.neurabot.openWindowAndTrySendMessage(text: string): boolean

// Optional: öffnet einen bereits existierenden Chat mit dem übergebenen
// Verlauf. Wird z. B. von neurafind genutzt, um eine Suchsitzung in den
// Chatbot zu übernehmen.
window.neurabot.openWindowAndTryOpenExistingChat?(
chatId: string,
messages: PublicBaseNeurabotMessageDto[]
): boolean

Beispiel: Suchleiste mit neurabot verbinden

Übergeben Sie die Sucheingabe an openWindowAndTrySendMessage. Der Rückgabewert false bedeutet, dass der Bot noch lädt — fangen Sie diesen Fall mit Ihrer normalen Website-Suche ab.

<input id="suche" type="text" placeholder="Suchen oder fragen ..." />
<button onclick="ladeAnfrage()">Senden</button>

<script>
function ladeAnfrage() {
const text = document.getElementById("suche").value;
const abgeschickt = window.neurabot?.openWindowAndTrySendMessage(text);
if (!abgeschickt) {
// Fallback: klassische Website-Suche
webseiteSuche(text);
}
}
</script>

Empfohlen: Umschalter zwischen Suche und Bot

Damit die klassische Website-Suche erhalten bleibt, bieten Sie Nutzern beide Wege an — z. B. über zwei Buttons oder einen Umschalter:

<input id="suche" type="text" placeholder="Suchen oder fragen ..." />
<button onclick="webseiteSuche(document.getElementById('suche').value)">Website durchsuchen</button>
<button onclick="window.neurabot.openWindowAndTrySendMessage(document.getElementById('suche').value)">Mit neurabot fragen</button>
Best Practice — Landkreis Ludwigslust-Parchim

Beim Landkreis Ludwigslust-Parchim ist die Suchleiste auf jeder Seite mit dem Bot verbunden. Gibt ein Nutzer z. B. „KFZ Anmeldung" ein, öffnet sich der Bot direkt mit der passenden Antwort. Die Suchleiste auf jeder Unterseite einzubinden steigert die Nutzung deutlich.

Suchleiste des Landkreises Ludwigslust-Parchim, verbunden mit dem neurabot

Datenschutzkonforme Einbindung

Disclaimer

Die Verantwortung zur datenschutzkonformen Einbindung des neurabots auf einer Website liegt beim Webseitenbetreiber. neuraflow teilt hier erprobte Erfahrungen, bietet aber keine Rechtsberatung zu diesem Thema an.

Ob und wie Sie ein Einwilligungs- bzw. Cookie-Banner für neurabot einbinden, entscheiden Sie als Webseitenbetreiber. neuraflow stellt Ihnen beide Wege bereit und überlässt Ihnen die Wahl.

Hintergrund: Sobald neurabot lädt, verarbeitet er personenbezogene Daten (siehe Datenschutzerklärung weiter unten). neuraflow bietet hierzu keine Rechtsberatung.

Sie steuern das selbst im Backend: Unter Einstellungen → Disclaimers können Sie einen Cookie-Banner aktivieren und den Text anpassen. Der im Tab „neurabot Integration" kopierte Einbindungscode enthält den Banner dann automatisch — je nachdem, ob und wie Sie ihn konfiguriert haben. Aktivieren Sie keinen Banner, lädt neurabot ohne.

Die Logik eines Cookie-Banners ist, dass er das Laden bestimmter Scripts (und damit den Datenfluss) unterbindet, bis Nutzer ihre Zustimmung gegeben haben. Dazu werden verschiedene Techniken angewandt.

Für Integratoren und Webmaster

Weiter unten finden Sie grundlegende technische Informationen zu unseren Skripten.

Wenn Sie sich für ein Banner entscheiden, haben Sie zwei Möglichkeiten:

A   Es gibt bereits einen Cookie-Banner und neurabot wird dort integriert.
    Beispiel: https://siegburg.de/

B   neurabot erhält ein eigenes Banner. Das eigene Banner erscheint auch dann, wenn das bereits vorhandene Cookie-Banner abgelehnt wird. So können Nutzer, die Cookies grundsätzlich ablehnen, getrennt über den Chatbot entscheiden.
    Beispiel: https://bonn.de/
    Siehe Besonderheiten beim Skript des separaten Banners weiter unten.

In diesem Fall kann eine neue Sektion zum bestehenden Banner hinzugefügt werden.

neurabot darf erst dann laden, wenn zugestimmt wurde. Nutzer müssen die Einwilligung jederzeit widerrufen können. Weitere Informationen zur Datenverarbeitung finden Sie im Textabschnitt weiter unten.

neuraflow hat in diesem Fall keinen Zugriff auf den Inhalt des Banners — die Umsetzung liegt in der Hand des Integrators oder Webmasters.

B — neurabot erhält ein eigenes Banner

In diesem Fall enthält der Code zur Einbindung einen Chatbot-Platzhalter, und der Chatbot ein eigenes Cookie-Banner. Das Banner erscheint, sobald man auf den Chatbot-Platzhalter klickt.

Das Icon ist das eigentliche Icon des neurabot.

So aktivieren Sie Option B im Backend:

  1. Öffnen Sie neurapolis.de und navigieren Sie zu Ihrem neurabot
  2. Sidebar: Einstellungen → Tab „Disclaimers"
  3. Aktivieren Sie den Cookie-Disclaimer (Toggle) und passen Sie bei Bedarf den Text an
  4. Sidebar: „neurabot Integration"
  5. Wählen Sie den gewünschten Modus: Schwebend, Eingebettet, Vollbild oder Gehostet
  6. Klicken Sie auf 🔒 Code kopieren

User-Journey: Disclaimers aktivieren → Integration → Code kopieren

Der exportierte Code enthält:

  • Ihren Cookie-Banner-Text (eingefroren zum Zeitpunkt des Exports)
  • Ihr Bot-Icon als eingebettetes Bild (data:image)
  • Die CookieConsent-Bibliothek

Das Script ist dadurch deutlich größer als der Standard-Embed-Code (~50–200 KB statt ~2 KB).

Wichtig — Re-Export bei Änderungen

Wenn Sie später Icon, Farbe oder Cookie-Text im Backend ändern, müssen Sie den Embed-Code neu exportieren und auf Ihrer Webseite ersetzen — die alte Version zeigt weiterhin die eingefrorenen Werte.

Die Einwilligung muss hier separat verwaltet werden. Hierzu kann dieser Befehl aufgerufen werden:

window.CookieConsent.showPreferences()

Wir empfehlen ein Element im Footer mit dem Attribut data-cc="show-preferencesModal":

<a href="#" data-cc="show-preferencesModal">Cookie-Einstellungen</a>

Grundlegende technische Information zu unseren Skripten

Die bekannteste Technik ist es, den Typ des Scripts vom Standard (text/javascript) zu ändern, z. B. in cookiebanner-block. Dadurch erkennt der Browser das Script nicht mehr als solches an und führt es deswegen auch nicht aus. Erst wenn der Cookie-Banner den Typ wieder auf text/javascript setzt, lädt das Script und wird dann automatisch ausgeführt. Oft nimmt der Cookie-Banner das type-Attribut vom Script-Tag auch einfach komplett runter, da der Standard sowieso text/javascript ist.

Das neurabot-Embed besteht aus zwei Teilen. Der erste enthält allerdings nur Einstellungen, die nichts weiter laden oder ausführen. Deswegen muss nur das zweite Script — der embed-loader — von Ihrem Cookie-Banner geblockt werden.

Beispiel mit dem bekannten Cookie-Banner „CookieConsent v3":

<script
type="text/plain"
data-category="necessary"
data-service="Chat Widget"
data-type="module"
async
src="https://prod-chat-app.neurabot.neuraflow.de/embed-loader.js"
></script>
vorsicht
Achtung — type="module" wichtig

Das embed-loader-Script ist kein normales Script, sondern ein moderneres Module-Script. Deswegen benötigt es type="module" auf dem Script-Tag, anstelle des standardmäßigen text/javascript. Wenn der Cookie-Banner das type-Attribut auf text/javascript setzt oder das type-Attribut komplett entfernt, würde das Script nicht funktionieren.

Besonderheiten beim Skript des separaten Banners

Dieses Skript enthält lokal sowohl alle Inhalte als Text als auch die Bilddatei des Icons als data:image. Das führt dazu, dass das Skript relativ groß ist.

Datenschutzerklärung — Formulierungsvorschlag

Ihr Chatbot und neuraflow als Dienstleister sollten in der Datenschutzerklärung Ihrer Website als Datenverarbeiter aufgelistet werden.

Empfehlung — kein Mustertext

Der folgende Textbaustein ist ein Formulierungs-Vorschlag auf Basis bewährter Kunden-Datenschutzerklärungen. Verantwortlich für Inhalt, Vollständigkeit und rechtliche Prüfung Ihrer Datenschutzerklärung bleibt der Webseitenbetreiber. neuraflow leistet keine Rechtsberatung — bitte mit Ihrem Datenschutzbeauftragten abstimmen und an Ihre Gegebenheiten anpassen.

Das Snippet verlinkt für weiterführende Informationen auf die Datenschutzerklärungen von neuraflow.

neurabot (KI-Chatbot)

Unsere Webseite bietet Ihnen die Möglichkeit, einen KI-Chatbot zu nutzen. Hierdurch möchten wir Sie beim Navigieren und Auffinden der von Ihnen gesuchten Informationen unterstützen. Die Nutzung des Chatbots ist freiwillig und hat keinen Einfluss auf die generelle Bereitstellung der Webseite.

Die Verarbeitung von personenbezogenen Daten erfolgt nur, wenn der Chatbot aktiv durch Sie genutzt wird. Im Folgenden finden Sie Informationen zu den verarbeiteten Daten sowie dem Zweck, der Rechtsgrundlage, der Dauer und dem Ort der Verarbeitung als auch etwaigen Empfängern Ihrer Daten.

Verarbeitete Daten und Verarbeitungszweck

Zur Bereitstellung des Chatbots und des damit verbundenen Services sowie zur Sicherstellung der Qualität der Daten werden durch uns die folgenden Informationen erfasst und verarbeitet:

  • Ihre IP-Adresse
  • der verwendete Browser
  • das Betriebssystem
  • die vollständigen Gesprächsverläufe inklusive Zeitstempel der Anfragen
  • Daten zu technischen Störungen während der Chats (sogenannte „Error Logs“)
  • Feedback, das Sie während des Chats geben

Rechtsgrundlage der Verarbeitung / Widerruf

Die Verarbeitung Ihrer Daten erfolgt auf Grundlage einer von Ihnen erteilten Einwilligung, Art. 6 Abs. 1 lit. a) DSGVO. Die Einwilligung können Sie jederzeit für die Zukunft widerrufen.

Empfänger der Daten

Mit der Bereitstellung, dem Betrieb und dem Hosting des Chatbots haben wir die neuraflow GmbH, Barkhausenstraße 4, 27568 Bremerhaven, [email protected], www.neuraflow.de, beauftragt. Dieser Dienstleister wird für uns auf Grundlage eines Auftragsverarbeitungsvertrags gem. Art. 28 DSGVO tätig.

Verarbeitungsort

Ihre Daten werden ausschließlich in der EU/EWR verarbeitet.

Speicherdauer

Ihre Daten werden nur so lange verarbeitet, wie es für die Erfüllung der oben beschriebenen Zwecke erforderlich ist bzw. bis Sie die uns erteilte Einwilligung widerrufen. Eine darüber hinausgehende Verarbeitung erfolgt nur, sofern wir aufgrund rechtlicher Vorschriften zur Verarbeitung verpflichtet sind.