Skip to content
Mignuti Chatbot

Docs

Mignuti Chatbot is a Web Component. If your platform lets you paste a <script> tag, you can embed Mignuti Chatbot. Below: the 60-second quickstart plus six platform-specific recipes.

Quickstart (60 seconds)

  1. Sign up at /en/signup (free, no credit card).
  2. Onboarding wizard creates your first project. Choose a vertical template or upload a document (PDF, Word, text …) or paste a URL.
  3. Step 3 generates your embed code — one line of HTML with a data-project attribute.
  4. Paste that line into your site. Reload. The chat launcher appears bottom-right.

Embed-tag anatomy

<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: public key, safe to expose in HTML.
  • data-secret: bcrypt-bound, validated server-side. Without it, the widget will not boot.
  • data-consent: defaults to pending — the widget waits for an explicit window.MignutiChatbot.setConsent('granted') call before it loads sessions or writes localStorage. Wire that into your cookie banner (see Consent).
  • async: never blocking. The widget weighs around 27 KB gzipped.

WordPress

Three options, in order of preference:

1. Plugin "Mignuti Chatbot" (recommended)

  1. WP-Admin → PluginsAdd new → search "Mignuti Chatbot".
  2. Install + activate.
  3. Settings → Mignuti Chatbot → paste your data-project + data-secret.

2. Header-footer-injection plugin (Insert Headers and Footers, WPCode)

Paste the embed snippet into the "Body" or "Footer" hook. Works on any 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

  1. Online Store → Themes → Edit code on your live theme.
  2. Open layout/theme.liquid.
  3. Paste the embed snippet just before </body>.
  4. Save. The widget appears on storefront, product, cart and collection pages.

For checkout pages, Shopify only allows scripts via the App SDK (Plus plan). Mignuti Chatbot is intentionally not loaded on checkout — chatbots distract during conversion. If you need it, contact us.

Webflow

  1. Project Settings → Custom Code → Footer Code.
  2. Paste the embed snippet.
  3. Save → Publish.

On staging (webflow.io domains) you must add the staging URL to Allowed Origins in your Mignuti Chatbot Embed settings. The widget refuses to boot on un-allow-listed origins as anti-key-theft.

Plain HTML / static sites (Astro, Hugo, Eleventy, Jekyll)

Paste the snippet into your layout template, just before </body>:

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

React / Next.js

The cleanest pattern is a Layout-level effect that injects the script once:

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

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

Why lazyOnload: the widget is non-critical UI. Loading it after window-load keeps Largest Contentful Paint clean.

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,
        },
      ],
    },
  },
});

With data-consent="pending" (the default), Mignuti Chatbot does not start any session until you call window.MignutiChatbot.setConsent('granted'). Hook this into your cookie-banner accept-button:

// after the visitor accepts marketing/functional cookies:
window.MignutiChatbot?.setConsent('granted');

// after the visitor refuses:
window.MignutiChatbot?.setConsent('denied');  // widget hides itself

Mignuti Chatbot is technically a "functional" cookie under most CMP categorisations (it stores a session id in localStorage so the conversation persists between page-loads). DSGVO Art. 6(1)(a) consent is the cleanest legal basis for B2C sites; B2B with legitimate-interest argument also works.

Troubleshooting

My site uses a strict Content-Security-Policy (CSP)

The widget needs these CSP allowances — otherwise it loads but sessions/answers fail silently:

script-src  ... https://widget.mignuti.com;
connect-src ... https://widget.mignuti.com https://*.supabase.co;
font-src    ... https://widget.mignuti.com;
  • script-src: loads v1.js.
  • connect-src: chat session, answer stream and UI translations (both hosts required).
  • font-src: only if you picked a custom font in the bot config.
The launcher does not appear
  • Open DevTools → Network — is v1.js loaded with status 200?
  • Console — any "origin_not_allowed" errors? Add the host to Allowed Origins.
  • Make sure data-secret is present and starts with sec_.
The bot answers but says "I don't know" a lot
  • Check the Knowledge-base — is your document status "ready" (not "pending"/"failed")?
  • Check the similarity threshold in the chatbot config (default 0.35) — lower it slightly for thin content, raise it if answers feel off-topic.
  • Add Q&A pairs for the most-asked unanswered questions (see Pending Questions page).
"Bot is at quota" message

You hit the hard cap (3× plan limit). Upgrade your plan in Billing or wait until next month. The hard cap exists so a runaway widget cannot bill you €10 000.

Widget breaks our site CSS

It cannot — the widget runs inside a closed Shadow Root with :host { all: initial }. If you see CSS bleed, open an issue at hello@mignuti.com with your URL — that would be a bug we want to know about.

Stuck on something not in the docs?

Reply within one business day on weekdays.

hello@mignuti.com