Web Chat is a chat bubble that talks to a published agent. You install it with one <script> tag that carries your widget key.

Get your snippet

1. Publish the agent in the Agent Builder. An unpublished agent has no snippet.

2. Open the agent and select Share. Under Web chat, copy the Embed snippet. The Widget key is shown below it.

3. Paste the snippet into your pages, just before </body>.

The snippet looks like this:

<script async
  id="natiq-chat-script"
  src="https://cx.na6iq.com/webchat/js/natiqLoader.min.js"
  data-widgetkey="YOUR_WIDGET_KEY"></script>

Workspaces in other regions get a different host — always copy the snippet from the dashboard. You can also copy it from Connect on the Web line.

Part	Why it matters
src	The loader. It is tiny and has no dependencies. It adds the widget bundle after your page's load event, when the browser is idle.
id="natiq-chat-script"	The widget reads its settings from the element with this id. Keep it exactly.
data-widgetkey	Tells the widget which agent to open.
async	Optional but recommended; the loader does not block rendering either way.

All other settings are optional data-* attributes on this same tag. See Configuration.

Loading the bundle directly

The loader appends https://cx.na6iq.com/webchat/static/js/webchat.js and a <natiq-webchat-wrapper> element for you. Paste the loader, not the bundle, unless you are building a test page like Natiq's own preview.html.

Check that it works

Reload the page. A bubble should appear in the corner shortly after the page finishes loading, because the widget waits for the page and the browser to be idle. Open it and send a message; the agent you published should answer.

Open, the chat greets the visitor with the agent’s welcome and a menu of choices.

To try a key without touching your site, open https://cx.na6iq.com/preview.html?widgetKey=YOUR_WIDGET_KEY.

Symptom	What to check
No bubble	The tag is on the page, id is natiq-chat-script, and the browser console shows no blocked request.
Bubble appears but the chat will not start	The key is wrong or was replaced. An invalid key is refused with a 403. Copy the snippet again.
Works on the preview page, not on your site	A Content Security Policy is blocking it. See below.

Content Security Policy

If your site sets a CSP, allow:

• the script host, https://cx.na6iq.com (or https://sa.na6iq.com), in script-src. The widget loads further script chunks from the same /webchat/ path when it opens;
• your API host (https://api.cx.na6iq.com or https://api.sa.na6iq.com) in connect-src, for HTTPS calls and the WebSocket (wss://);
• https://fonts.googleapis.com in style-src and https://fonts.gstatic.com in font-src (the widget loads its font from Google Fonts);
• the widget adds its own <style> elements, so style-src also needs 'unsafe-inline'.

Look at the console for any other blocked host; we have not listed every asset the widget may request.

Single-page apps

Inject the tag once, after the page is ready, and set the attributes before inserting it:

function installNatiqChat(widgetKey) {
  if (document.getElementById('natiq-chat-script')) return
  const s = document.createElement('script')
  s.id = 'natiq-chat-script'
  s.async = true
  s.src = 'https://cx.na6iq.com/webchat/js/natiqLoader.min.js'
  s.setAttribute('data-widgetkey', widgetKey)
  document.head.appendChild(s)
}

Route changes do not need any call. The widget lives in the page, not in your router. To remove it, delete the <natiq-webchat-wrapper> element; removing it unmounts the widget, and adding one back starts a fresh instance. This is how the element behaves rather than a documented API, so test it before you rely on it.

Keys and security

The widget key is public by design: it sits in your page source. It is not a secret and it grants no access to your Natiq data. It only lets a visitor start a chat with that agent. Web Chat has no allowed-domains setting in the dashboard (unlike the accessibility widgets), so assume any site that copies the key can show your agent. If that happens, open Share → Replace key. Every page with the old key stops reaching the agent until you paste the new snippet.

ConfigurationEvery data attribute the tag accepts.JavaScript APIWhat you can and cannot call from your page.