Skip to main content
The chat widget is a self-contained JavaScript bundle you load on any website. It mounts a floating chat bubble in an isolated container (a Shadow DOM), so it won’t clash with your site’s styles and isn’t affected by them. This page is the developer reference for the widget’s loader and its window.A2V2Widget API. For the copy-paste install most sites need, see Embed & Install.

The loader script

Add the loader to your page. It detects its own host, loads the widget bundle, and auto-initializes when a config object is present.
<script src="https://chat-widget.a2v2.ai/embed.js"></script>
When embed.js runs, it:
  1. Guards against loading twice on the same page.
  2. Loads the widget bundle (a2v2-widget.js) from the same host.
  3. Once the bundle is ready, calls A2V2Widget.init(window.A2V2WidgetConfig) if a config object has been set.

Configure the widget

Set window.A2V2WidgetConfig before (or alongside) the loader. With this in place, the widget auto-initializes — you don’t have to call init() yourself.
<script>
  window.A2V2WidgetConfig = { chatbotId: "<AGENT_ID>" };
</script>
<script src="https://chat-widget.a2v2.ai/embed.js"></script>

A2V2WidgetConfig fields

FieldTypeRequiredDescription
chatbotIdstringYesThe ID of the agent to load. Find it on the agent’s Embed/Install screen.
chatbotId is the only configuration field the widget reads today. The widget’s appearance, welcome message, and visibility are controlled from the dashboard (see Appearance and Visibility), not from this config object. Additional config fields are not currently supported — if you need to pass more options at embed time, confirm availability with support.
If chatbotId is missing, the widget logs an error to the browser console and does not mount. Double-check the value matches your agent’s ID exactly.

The window.A2V2Widget API

Once a2v2-widget.js has loaded, it exposes a global A2V2Widget object.

A2V2Widget.init(config)

Mounts the widget. Pass an object with at least chatbotId.
<script>
  window.A2V2Widget.init({ chatbotId: "<AGENT_ID>" });
</script>
  • Calling init() again while the widget is already mounted is ignored (it guards against double-initialization).
  • The widget renders into a fixed, full-viewport container layered above your page, with pointer events limited to the bubble and chat panel.

A2V2Widget.destroy()

Unmounts the widget and removes the elements it added to the page.
<script>
  window.A2V2Widget.destroy();
</script>
Use destroy() when you need to remove the widget dynamically — for example, on a route change in a single-page app, or when a visitor opts out.

Use cases

The simplest setup. Set the config, drop in the loader, done.
<script>
  window.A2V2WidgetConfig = { chatbotId: "<AGENT_ID>" };
</script>
<script src="https://chat-widget.a2v2.ai/embed.js"></script>

Style isolation

The widget renders inside a Shadow DOM and injects its own styles there, so your site’s CSS can’t reach the widget and the widget’s CSS won’t leak onto your site. It also loads its own web font. A couple of things to know:
  • The widget adds its font’s stylesheet to the page <head>. If your site enforces a strict Content-Security-Policy, allow the widget’s font and script sources or the widget may fail to load or style correctly.
  • Some overlay elements (dropdowns, dialogs) render at the top of the page and are layered above other content using a very high stacking order.

Troubleshooting

Confirm window.A2V2WidgetConfig (or your init() call) includes a valid chatbotId, that the loader script isn’t blocked, and check the browser console for an A2V2 Widget error.
The config was set without a chatbotId, or init() was called with an empty value. Provide the agent’s ID.
The widget bundle may not have loaded yet, or the widget is already mounted. Ensure embed.js has run and window.A2V2Widget exists before calling init(), and call destroy() before re-initializing.
Allow the widget’s font and script sources in your Content-Security-Policy.
Your site or CDN may be caching the page. Hard-refresh and clear any site/CDN cache after embedding.

Embed & Install

The no-code snippets for link, iframe, and chat bubble.

Install on platforms

Add the widget to WordPress, Webflow, Shopify, and more.

Appearance

Control how the widget looks and greets visitors.

API Overview

The Open API for server-to-server integration.