How do I install the CMD+K widget?

Step 0: choose an auth mode

Before pasting the snippet, decide how visitors will be identified. You can change this any time from the Install tab.

• Public — anyone can chat anonymously. The assistant has no idea who is asking. Good for docs, landing pages, and demos.
• Signed-in only — every chat request carries a JWT your backend signed for that visitor. The assistant knows exactly who is asking, so connected MCP tools can act on their account — not a shared one.

Public widget

Paste this before </body>. No backend required.

<script async
  src="https://commandplusk.com/embed/widget.js"
  data-cmdk-widget="<WIDGET_ID>">
</script>

Signed-in widget

Same snippet, plus data-cmdk-token set to a JWT your backend mints for the current visitor.

<script async
  src="https://commandplusk.com/embed/widget.js"
  data-cmdk-widget="<WIDGET_ID>"
  data-cmdk-token="<USER_TOKEN>">
</script>

<USER_TOKEN> is a short-lived HS256 JWT signed with your widget's secret key. See End-user authentication for the full signing guide.

All snippet attributes

• data-cmdk-widget — required. Your widget UUID from the dashboard.
• data-cmdk-token — signed-in mode only. Short-lived JWT for the current visitor.
• data-cmdk-mode — assistant, onboarding, learning, or investigations. Which assistant mode the chat starts in. Optional — defaults to the first mode enabled on the widget.
• data-cmdk-theme — light, dark, or auto (follows the visitor's OS). Optional — defaults to the widget's dashboard setting.
• data-cmdk-accent — hex color override (e.g. #6366f1). Optional — defaults to the widget's dashboard setting.
• data-cmdk-position — right or left. Optional — defaults to the widget's dashboard setting.
• data-cmdk-launcher — bubble, bar, pill, avatar, tab, embed (full-page assistant), or custom (nothing injected — open from your own UI via window.CommandK.open()). Optional — defaults to the widget's dashboard setting. Each launcher is described with a snippet on Launchers & display modes.
• data-cmdk-display — overlay, inline, or fullpage. Optional — defaults to the widget's dashboard setting.
• data-cmdk-panel-width — width in pixels for inline mode, 320–720 (default 420). A width the visitor saved by dragging the panel edge takes precedence.
• data-cmdk-placeholder — input placeholder text (bar/pill/embed launchers). Optional — defaults to the widget's dashboard setting.
• data-cmdk-target — CSS selector for the bar launcher mount point (e.g. #cmdk-mount). Always required for bar — it's page-specific and can't come from the dashboard.
• data-cmdk-locale — en or tr. Language of the guided-tour chrome (Next, Skip, Done…). Optional — defaults to the visitor's browser language.
• data-cmdk-embed-key — partner embeds only. A per-widget key that bypasses the origin allowlist so a third-party product can host your widget from any origin. See Partner embeds.

The full attribute table with values and defaults lives on Launchers & display modes.

Launchers and display modes

The widget can open as a floating overlay (default), a docked inline side panel that pushes your content aside and can be resized by the visitor, or a fullpage takeover with a conversation sidebar — and it can be triggered by a corner bubble, an avatar, a side tab, a bottom pill, an in-page ⌘K bar, or your own button (custom). Every combination, with a copy-paste snippet and when to use it, is documented on Launchers & display modes; programmatic control (window.CommandK.open() and friends) is covered there and on the postMessage host API page.

Framework tips

• Next.js App Router: add the script to app/layout.tsx inside a <Script strategy="beforeInteractive"> or plain <script> in <head>.
• Vite / CRA: add it to index.html before </body>.
• Remix: add to root.tsx inside the <body> of your Layout.
• Webflow / Framer / Squarespace: use the site-wide custom code injection field.

Verify the install

1. Open your site in an incognito window.
2. You should see the launcher button (bubble / bar / pill) appear.
3. Click it — the chat panel should open within ~200 ms.
4. In signed-in mode, send a message and confirm the conversation appears in the dashboard with the correct visitor sub.