Das Widget einbetten

1. Snippet kopieren

Öffnen Sie im Studio den Bereich Deploy Ihres Assistenten. Dort finden Sie ein einzeiliges <script>-Snippet. Kopieren Sie es und fügen Sie es einmal in den HTML-Code Ihrer Website ein — idealerweise kurz vor dem schließenden </body>-Tag. Das genügt: Der Launcher-Button erscheint automatisch, und der Assistent lädt asynchron, ohne Ihre Seite auszubremsen.

<script async src="https://kyros.omniratio.de/embed.js" data-kyros="IHR-ASSISTENT-CODE"></script>

Das Snippet funktioniert auf jedem CMS und in jedem Framework — WordPress, Shopify, Webflow, Wix, statisches HTML oder eine React-/Next.js-App. Sehen Sie sich die plattformspezifischen Anleitungen an, wenn Sie genau wissen möchten, wohin der Code gehört.

2. Restriktive Umgebungen: das <iframe>

Manche Baukästen oder streng abgesicherte Seiten erlauben kein eigenes Script. Für diese Fälle stellt Kyros zusätzlich einen <iframe>-Einbettungscode bereit. Er rendert denselben Assistenten in einem isolierten Rahmen — ohne Zugriff auf den umgebenden Seitencode.

<iframe src="https://kyros.omniratio.de/embed/widget/IHR-ASSISTENT-CODE" width="100%" height="640" style="border:0"></iframe>

3. Domains freigeben

Bevor das Widget öffentlich läuft, hinterlegen Sie unter Allowed Domains, welche Websites es einbetten dürfen. So kann niemand Ihren Assistenten auf einer fremden Seite verwenden. Wildcard-Subdomains werden unterstützt — mit einem Eintrag wie *.ihre-domain.de decken Sie Staging, Shop und Blog auf einmal ab.

4. Signierte, ablaufende Einbettungscodes

Jede Einbettung nutzt einen signierten, ablaufenden Code. Er wird serverseitig ausgestellt und in regelmäßigen Abständen erneuert — ein abgefangenes Snippet lässt sich also nicht dauerhaft missbrauchen. Zusammen mit der Domain-Freigabe bleibt die Kontrolle darüber, wo und wie lange Ihr Assistent erreichbar ist, jederzeit bei Ihnen.

5. Live schalten und anpassen

Sobald das Snippet auf Ihrer Seite steht, ist der Assistent live. Branding, Konversationsstarter und Position ändern Sie weiter im Studio — ganz ohne den Code erneut anzufassen. Details zum Widget selbst finden Sie auf der Chat-Widget-Seite; für den programmatischen Zugriff geht es weiter zur API-Referenz.