Zum Inhalt springen
DeutschlandGPT

Erweitertes EinbindenBeta

Inline-iFrame oder schwebender Button, Script-Attribute, Spracherkennung und den Chat aus der eigenen Seite öffnen

Diese Funktion ist in der Beta-Phase. Sie ist nutzbar, einzelne Details können sich aber noch ändern.

Der Code aus Auf der Website einbinden genügt für die meisten Websites. Diese Seite ist für Webteams, die genauer steuern wollen, wo und wann der Chat erscheint.

Schwebender Button oder Inline-Einbettung

Einbinden bietet zwei Codes:

VarianteWas sie tutGeeignet, wenn
Schwebender Chat-Button (Skript)setzt einen Button in eine Ecke jeder Seite; ein Klick öffnet den Chat als Overlayder Chat überall auf der Website verfügbar sein soll
Inline-Einbettung (iFrame)setzt den Chat direkt in den Seitenfluss, in der Größe, die Sie dem iFrame gebeneine eigene Hilfe- oder Kontaktseite den Chat im Inhalt zeigt

Die Inline-Einbettung ist ein einfacher <iframe>. Passen Sie width und height an Ihr Layout an und behalten Sie allow="clipboard-write; microphone" bei; Kopier-Buttons und Spracheingabe brauchen es. Die Erlaubnisliste gilt für beide Varianten gleich.

Script-Attribute

Der schwebende Button liest einige Attribute aus seinem eigenen <script>-Tag:

AttributWirkung
data-widget-idwelches Widget geladen wird. Pflicht und bereits im Code enthalten.
data-positionbottom-left oder bottom-right. Überschreibt für diese Seite die Position aus Identität.
data-primary-colorButton-Farbe, nur wenn die Widget-Konfiguration nicht geladen werden kann.
data-button-labelButton-Beschriftung, nur wenn die Widget-Konfiguration nicht geladen werden kann.

Alles andere kommt aus der veröffentlichten Version. Eine Änderung im Builder erfordert also nie einen Eingriff in Ihre Website.

Den Code zweimal auf einer Seite einzufügen, schadet nicht: Der Loader startet nur einmal.

Sprache

Der Loader liest die Sprache Ihrer Seite aus <html lang="…"> und fällt sonst auf die Browsersprache des Besuchers zurück. Englische Seiten bekommen die englische Oberfläche, alle anderen die deutsche. Ist unter Gehirn → Sprache Deutsch oder Englisch fest eingestellt, gilt diese Einstellung.

Den Chat aus der eigenen Seite öffnen

Sobald der Chat-Button erschienen ist, stellt der Loader auf window.DeutschlandGPTWidget eine kleine Scripting-Schnittstelle bereit:

MethodeWirkung
open()öffnet den Chat
close()schließt ihn
toggle()öffnet ihn, wenn er zu ist, und schließt ihn sonst
prefill(text)öffnet den Chat und legt text ins Eingabefeld (ab Loader 1.7.0)

Damit öffnen Sie den Chat zum Beispiel über einen eigenen Link „Chatten Sie mit uns“. Prüfen Sie vorher, ob das Objekt existiert, denn es ist erst da, wenn der Loader fertig ist:

HTML
<a
  href="#"
  onclick="window.DeutschlandGPTWidget && window.DeutschlandGPTWidget.open(); return false;"
>
  Chatten Sie mit uns
</a>

Die Schnittstelle gehört zum schwebenden Button. Die Inline-Einbettung hat keinen Button, der sich öffnen oder schließen ließe.

Eine Frage vorbefüllen

Ab Loader 1.7.0 kann Ihre Seite Text in das Eingabefeld legen, etwa über einen Button „Frage zu diesem Produkt“. Das Panel öffnet sich und der Text steht im Eingabefeld. Er wird nie automatisch gesendet, das entscheidet der Besucher. Hat er schon etwas getippt, wird der Text in einer neuen Zeile angehängt.

JS
window.DeutschlandGPTWidget.prefill('Frage zum Pro-Tarif');
// oder, ohne auf den Loader zu warten:
window.postMessage({ type: 'dgpt-prefill', text: 'Frage zum Pro-Tarif' }, location.origin);

Angenommen werden nur Nachrichten der Seite selbst, nicht aus anderen Frames darauf. Der Text wird auf 2.000 Zeichen gekürzt.

Seitenkontext

Ab Loader 1.7.0 teilt das Widget dem Bot mit, auf welcher Seite der Besucher gerade ist: den Seitentitel und die Adresse ohne Parameter. Was nach ? oder # steht, wird nie übermittelt. So kann der Bot Fragen wie „Was kostet das hier?“ zur aktuellen Seite beantworten. Von sich aus spricht er die Seite nicht an.

  • Die Angabe geht mit jeder Antwort an das KI-Modell und wird nicht im Transkript gespeichert.
  • Sie wird nur für Seiten auf Ihren erlaubten Domains angenommen.
  • Auf Single-Page-Websites folgt das Widget der Navigation.
  • Sie ist für alle Widgets standardmäßig aktiv, auch für bestehende, sobald Ihre Seite den 1.7.0-Snippet verwendet. Ältere Snippets senden nichts.

Abschalten unter Verhalten → Seitenkontext an den Bot übergeben, danach veröffentlichen. Der Einrichtungsassistent kann das auch.

Öffnungszustand

Ab Loader 1.7.0 bleibt der Chat offen, wenn ein Besucher ihn geöffnet hat und im selben Tab auf eine andere Seite wechselt. Ein neuer Besuch beginnt geschlossen. Blockiert der Browser den Speicher, beginnt das Widget einfach jedes Mal geschlossen.

War diese Seite hilfreich?