Intelligente Suchleiste Integration
Die Intelligente Suchleiste bettet die KI-gestützte Suchantwort direkt in Ihre Website-Suche ein: Nutzer stellen eine Frage in eigenen Worten, die Intelligente Suchleiste durchsucht Ihre Inhalte und streamt eine formulierte Antwort direkt in Ihre Suchergebnisse - ohne dass sich der Chatbot öffnet. Auf Wunsch kann der Nutzer die Suchsitzung anschließend im neurabot fortsetzen.
Diese Seite beschreibt die technische Einbindung der Intelligenten Suchleiste. Ihre Bot-ID sowie den Backend-Zugang erhalten Sie von neuraflow.
Client einbinden
Die Intelligente Suchleiste wird über einen kleinen Client eingebunden - kein Paketmanager, kein Build-Schritt. Ein Script-Tag im <head> lädt den Loader; dieser stellt NeurafindClient und die zugehörigen Klassen global bereit.
<script type="module" src="https://prod-chat-app.neurabot.neuraflow.de/neurafind-client-loader.js"></script>
Der Loader hängt folgende Klassen an globalThis: NeurafindClient, NeurafindOptions, NeurafindSession, NeurafindSucceededResult. Da es sich um einen statischen Module-Import handelt, wartet der Browser, bis das Bundle geladen ist - new NeurafindClient(...) funktioniert direkt im nächsten Script-Block.
Suche ausführen
<script>
// Basis-URL erhalten Sie von neuraflow.
const neurafindClient = new NeurafindClient(NEURAFIND_BASE_URL);
const session = neurafindClient.find(new NeurafindOptions({
neurabotConfigId: "TODO", // Ihre Bot-ID, die Ihnen neuraflow zukommen lässt
query: "Wann hat das Bürgerbüro geöffnet?",
isSimplifiedLanguage: false,
isAlternativePersona: false,
callingWebsiteDomain: window.location.origin,
onTextDelta: (deltaText, fullText) => {
// Wird pro Text-Fragment aufgerufen. Entweder deltaText anhängen
// oder einfach fullText an Ihr Element binden.
},
onError: (errorEvent) => {
// Fehler behandeln (z. B. Fallback auf die klassische Website-Suche).
},
onSucceeded: (result) => {
// result.aiMessage.content - die vollständige Antwort
// result.chatId, result.userMessage, result.aiMessage - für den Handoff (siehe unten)
},
}));
// Laufende Suche abbrechen, wenn der Nutzer eine neue Anfrage stellt oder navigiert:
session.cancel();
</script>
Jede Suche terminiert in genau einem der beiden Callbacks onError oder onSucceeded. onTextDelta wird während des Streamings mehrfach aufgerufen.
Optionen
| Option | Bedeutung |
|---|---|
neurabotConfigId | Ihre Bot-ID (erhalten Sie von neuraflow). |
query | Die Suchanfrage des Nutzers. |
isSimplifiedLanguage | true fordert eine Antwort in Leichter Sprache an. |
isAlternativePersona | true nutzt die alternative Persona des Bots, falls konfiguriert. |
callingWebsiteDomain | Die Domain Ihrer Website, i. d. R. window.location.origin. |
UI-Empfehlungen
Ladeindikator
Eine Suche dauert typischerweise einige Sekunden. Zeigen Sie während der Suche einen Ladeindikator (Spinner oder Skeleton). Beschriften Sie ihn mit „KI-Suche …“ statt nur „Suche …“ - so verstehen Nutzer die etwas längere Wartezeit und dass sie sich anschließend das Durchklicken sparen können.
Antwort rendern
Die Antwort wird als einfacher Text geliefert und kann direkt in einem Absatz gerendert werden. Nutzen Sie das Streaming über onTextDelta, um die Antwort schrittweise erscheinen zu lassen, statt auf das Ende zu warten.
Übergabe an neurabot (Handoff)
Nachdem ein Nutzer ein Suchergebnis erhalten hat, möchte er eventuell eine Nachfrage stellen. Wenn zusätzlich neurabot auf der Website eingebunden ist, können Sie einen Button anzeigen, der die Suchanfrage und die Antwort in den neurabot übernimmt - der Nutzer chattet dort nahtlos weiter.
- Zeigen Sie den Button nur, wenn neurabot eingebunden ist:
window.neurabotConfig !== undefined. - Zeigen Sie ihn erst nach Eintreffen der Antwort - nicht während der Suche.
const wurdeUebernommen = window.neurabot.openWindowAndTryOpenExistingChat(
result.chatId,
[result.userMessage, result.aiMessage],
);
// true = der Chat wurde geladen
// false = im neurabot lädt bereits eine Antwort, der Chat wurde nicht geladen
Der Handoff setzt voraus, dass neurabot ebenfalls auf der Website eingebunden ist (siehe Go-Live Embed). Läuft nur die Intelligente Suchleiste, lassen Sie den Button weg.