Docs

Mignuti Chatbot ist eine Web Component. Wenn deine Plattform einen <script>-Tag erlaubt, kannst du Mignuti Chatbot einbetten. Unten: der 60-Sekunden-Quickstart und sechs plattform-spezifische Rezepte.

Nicht technisch? Für WordPress gibt es ein Plugin ganz ohne Code. Für alle anderen Plattformen genügt eine Zeile, die dein Team in zwei Minuten einfügt.

Quickstart (60 Sekunden)

Registriere dich auf /signup (kostenlos, keine Kreditkarte).
Der Onboarding-Wizard legt dein erstes Projekt an. Wähle ein Vertical-Template oder lade ein Dokument hoch (PDF, Text, Markdown) oder füge eine URL ein.
In Schritt 3 generieren wir deinen Embed-Code — eine Zeile HTML mit data-project-Attribut.
Diese Zeile auf deine Seite einfügen. Reload. Der Chat-Launcher erscheint unten rechts.

Embed-Tag Anatomie

<script
  src="https://widget.mignuti.com/v1.js"
  data-project="prj_4f9c…"           // public Widget-Key
  data-secret="sec_9b21…"          // bcrypt-bound Secret
  data-consent="granted"                 // 'pending' | 'granted' | 'denied'
  async></script>

data-project: öffentlicher Key, darf im HTML stehen.
data-secret: server-seitig validiert; ohne ihn bootet das Widget nicht. Es steht — wie bei jedem Embed-Widget — im öffentlichen HTML. Die eigentliche Absicherung sind Domain-Binding, Rate-Limits und kurzlebige Session-JWTs; das Secret bindet das Embed nur eindeutig an dein Projekt.
data-consent: Default pending — das Widget wartet auf einen expliziten window.MignutiChatbot.setConsent('granted')-Call, bevor es Sessions startet oder localStorage schreibt. Verbinde das mit deinem Cookie-Banner (siehe Consent) — oder lass es weg: bei pending zeigt das Widget dem Besucher einen eigenen Einwilligungs-Button, bevor ein Chat startet.
async: nie blockierend. Das Widget wiegt unter 35 KB (gzip).

WordPress

Drei Optionen, sortiert nach Empfehlung:

1. Plugin „Mignuti Chatbot" (empfohlen)

Das dedizierte Plugin richtet sich per 1-Klick selbst ein — inklusive Seiten-Targeting, DSGVO-Consent-Bridge (Borlabs, Complianz, Cookiebot, Usercentrics, Real Cookie Banner) und „Verbindung testen". Alle Details & Download →

Plugin-ZIP herunterladen.
WP-Admin → Plugins → Installieren → Plugin hochladen → aktivieren.
Einstellungen → Mignuti Chatbot → „Connect with Mignuti" klicken, Projekt wählen — Key und Domain werden automatisch gesetzt.

Bald auch direkt im WordPress-Plugin-Verzeichnis. Bis dahin ist der ZIP-Download der offizielle Weg. Wer keinen Connect-Flow will, kann data-project + data-secret unter „Enter details manually" auch von Hand eintragen.

2. Header-Footer-Injection-Plugin (Insert Headers and Footers, WPCode)

Embed-Snippet in den „Body"- oder „Footer"-Hook einfügen. Funktioniert auf jedem Theme.

3. Theme functions.php

add_action('wp_footer', function () {
  echo '<script src="https://widget.mignuti.com/v1.js" data-project="prj_…" data-secret="sec_…" async></script>';
});

Shopify

Online-Shop → Themes → Code bearbeiten am aktiven Theme.
layout/theme.liquid öffnen.
Embed-Snippet direkt vor </body> einfügen.
Speichern. Das Widget erscheint auf Shop-, Produkt-, Warenkorb- und Kollektions-Seiten.

Auf Checkout-Seiten erlaubt Shopify Scripts nur über das App-SDK (Plus-Plan). Mignuti Chatbot lädt absichtlich nicht im Checkout — Chatbots lenken bei der Conversion ab. Falls du es brauchst, meld dich bei uns.

Webflow

Project Settings → Custom Code → Footer Code.
Embed-Snippet einfügen.
Speichern → Publish.

Auf Staging (webflow.io-Domains) musst du die Staging-URL zu „Allowed Origins" in deinen mignuti-chatbot-Embed-Einstellungen hinzufügen. Das Widget bootet nicht auf nicht-allow-listed Origins — Anti-Key-Diebstahl-Schutz.

Plain HTML / statische Sites (Astro, Hugo, Eleventy, Jekyll)

Snippet ins Layout-Template einfügen, direkt vor </body>:

<!-- in deinem <body> -->
<script src="https://widget.mignuti.com/v1.js"
  data-project="prj_…" data-secret="sec_…" async></script>
</body>

React / Next.js

Sauberstes Pattern ist ein Layout-Effect, der das Script einmal injiziert:

// app/layout.tsx (Next.js 14 App Router)
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html lang="de">
      <body>
        {children}
        <Script
          src="https://widget.mignuti.com/v1.js"
          strategy="lazyOnload"
          data-project="prj_…"
          data-secret="sec_…"
        />
      </body>
    </html>
  );
}

Warum lazyOnload: Das Widget ist nicht-kritische UI. Erst nach Window-Load laden hält Largest Contentful Paint sauber.

Vue 3 / Nuxt 3

In nuxt.config.ts:

export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: 'https://widget.mignuti.com/v1.js',
          'data-project': 'prj_…',
          'data-secret': 'sec_…',
          async: true,
        },
      ],
    },
  },
});

Mit data-consent="pending" (Default) startet Mignuti Chatbot keine Session, bis du window.MignutiChatbot.setConsent('granted') aufrufst. Das verbindest du mit deinem Cookie-Banner-Akzeptieren-Button:

// nachdem der Besucher Marketing-/Funktional-Cookies akzeptiert:
window.MignutiChatbot?.setConsent('granted');

// nachdem der Besucher abgelehnt hat:
window.MignutiChatbot?.setConsent('denied');  // Widget blendet sich aus

Mignuti Chatbot ist technisch ein „Funktional"-Cookie nach den meisten CMP-Kategorisierungen (speichert eine Session-ID in localStorage, damit das Gespräch über Page-Loads bestehen bleibt). DSGVO Art. 6 Abs. 1 lit. a (Einwilligung) ist die sauberste Rechtsgrundlage für B2C-Sites; B2B-Sites mit Berechtigtem-Interesse-Argument (Art. 6 Abs. 1 lit. f) funktionieren auch.

Leads ins CRM (Zapier, Make, n8n)

Mignuti Chatbot bewertet jedes Gespräch mit einem Lead-Score (0–100) und erfasst – wenn der Besucher sie nennt – dessen E-Mail. Heiße Leads (Score ≥ 70) übergibst du automatisch an dein CRM: per Webhook, ganz ohne Programmierung. Die Leads siehst du außerdem jederzeit im Admin unter Leads (inkl. CSV-Export).

In Zapier, Make oder n8n einen Webhook / Catch Hook-Trigger anlegen und die URL kopieren.
Im Admin unter Integrationen → Webhooks eine Subscription mit dieser URL anlegen und das Event hot_lead wählen.
Im CRM-Schritt data.lead_email als Kontakt-E-Mail mappen; lead_score und intents als Notiz. Fertig für HubSpot, Pipedrive, Salesforce, Google Sheets, Slack, Notion …

Beispiel-Payload (POST, JSON):

{
  "id": "hot_lead:8f3c…",
  "event": "hot_lead",
  "occurred_at": "2026-08-27T10:15:00Z",
  "data": {
    "conversation_id": "8f3c…",
    "project_id": "a91b…",
    "lead_score": 82,
    "lead_email": "kunde@example.com",
    "intents": ["buying_intent", "price_question"],
    "first_message": "Was kostet das Enterprise-Paket?"
  }
}

Jeder Request ist HMAC-SHA256-signiert. Verifiziere den Header und lehne Requests älter als 5 Minuten ab:

x-mignuti-chatbot-signature: t=<ts>,v1=<sig>
x-mignuti-chatbot-timestamp:  <unix-seconds>
x-mignuti-chatbot-event:      hot_lead

// sig = HMAC_SHA256(secret, ts + "." + rawBody)   // hex

Das secret wird beim Anlegen der Subscription einmalig angezeigt. Kein CRM-Automations-Tool im Einsatz? Der CSV-Export auf der Leads-Seite funktioniert mit jedem CRM.

Fehlerbehebung

Meine Seite nutzt eine strikte Content-Security-Policy (CSP)

Das Widget braucht diese CSP-Freigaben — sonst lädt es zwar, aber Sessions/Antworten scheitern still:

script-src  ... https://widget.mignuti.com;
connect-src ... https://widget.mignuti.com https://api.chatbot.mignuti.com;
font-src    ... https://widget.mignuti.com;

script-src: lädt v1.js.
connect-src: Chat-Session, Antwort-Stream und UI-Übersetzungen (beide Hosts nötig).
font-src: nur falls du in der Bot-Konfig eine eigene Schrift gewählt hast.

Der Launcher erscheint nicht

DevTools → Network — wird v1.js mit Status 200 geladen?
Console — gibt es „origin_not_allowed"-Fehler? Host zu „Allowed Origins" hinzufügen.
Sicherstellen, dass data-secret gesetzt ist und mit sec_ beginnt.

Bot antwortet, sagt aber oft „Das weiß ich nicht"

Wissensbasis prüfen — ist der Dokument-Status „bereit" (nicht „wartend"/„fehlgeschlagen")?
Similarity-Schwellwert in der Chatbot-Konfig prüfen (Standard 0,35) — bei knappem Inhalt leicht senken, bei irrelevanten Antworten leicht anheben.
Q&A-Paare für die häufigsten unbeantworteten Fragen ergänzen (siehe „Offene Fragen"-Seite).

„Bot ist am Limit"-Nachricht

Du hast die Hard-Cap erreicht (3× Plan-Limit). Plan im Billing upgraden oder bis nächsten Monat warten. Die Hard-Cap existiert, damit ein außer Kontrolle geratenes Widget dir nie 10 000 € berechnet.

Widget bricht unser Site-CSS

Kann es nicht — das Widget läuft in einem closed Shadow Root mit :host { all: initial }. Falls du CSS-Bleed siehst, schreib uns an media@mignuti.com mit deiner URL — das wäre ein Bug, den wir wissen wollen.

Etwas, das nicht in den Docs steht?

Antwort an Werktagen innerhalb eines Arbeitstages.

media@mignuti.com