Skip to main content
You’ve copied your agent’s embed snippet from Channels & API → Embed/Install — now you need to paste it into the right place on your website. Where that is depends on the platform you build on. This page walks through the most common ones. Every snippet on this page comes straight from the Embed/Install screen, with your agent’s ID already filled in. Copy it from there rather than retyping it — see Embed & install for where each snippet comes from and which option (Share Link, chat bubble, or iframe) to choose.
In the snippets below, <AGENT_ID> is a placeholder. Your real agent ID is already baked into the snippet shown on the Embed/Install screen — copy that one.

​
The two snippets you’ll paste

Most installs use the chat bubble — a floating button that opens the chat. It comes in two short scripts:
If you’d rather embed the chat inline inside a page (for example a dedicated “Help” page), use the iframe instead:
For the chat bubble, paste both scripts into a location that loads on every page (a global footer or site-wide custom-code area) so the bubble appears across your whole site at once.

​
Plain HTML

1

Open your page's HTML

Edit the HTML file (or template) for the pages where you want the chat bubble.
2

Paste before the closing body tag

Add both chat-bubble scripts just before </body>:
3

Save and reload

Save the file, deploy if needed, and reload the page. The chat bubble appears in the corner.

​
WordPress

WordPress doesn’t expose raw HTML on every page, so add the snippet site-wide.
1

Open a header/footer code area

Use a header-and-footer code plugin (most WordPress sites already have one), or your theme’s built-in Custom Code → Footer area. Avoid pasting into post content — the visual editor can strip <script> tags.
2

Paste both scripts into the footer

Add the config script and the loader script to the footer (before </body>) box so the bubble loads on every page.
3

Save and view your site

Save the settings and open your live site. The bubble appears across all pages.
To embed the chat inline on a single WordPress page, add a Custom HTML block to that page and paste the iframe snippet into it.

​
Webflow

1

Choose site-wide or single-page

For the bubble on every page, open Project Settings → Custom Code. For one page only, open that page’s Settings → Custom Code.
2

Paste into the Footer Code area

Add both scripts to the Footer Code (the “Before </body> tag”) box:
3

Publish

Save, then Publish your Webflow site. Custom code only runs on the published site, not in the Designer preview.

​
Shopify

1

Open your theme code

From your Shopify admin, go to Online Store → Themes → ⋯ → Edit code.
2

Edit theme.liquid

Open theme.liquid and find the closing </body> tag near the bottom.
3

Paste before </body>

Add both scripts immediately before </body>:
4

Save

Save the file. The bubble now appears on every storefront page that uses this theme.
Edit a copy of your live theme (Shopify lets you Duplicate a theme first) if you want to preview before publishing. Theme code changes go live immediately on the active theme.

​
Google Tag Manager

If your site already runs Google Tag Manager (GTM), you can deploy the bubble without touching your site’s code.
1

Create a Custom HTML tag

In your GTM workspace, select Tags → New → Tag Configuration → Custom HTML.
2

Paste both scripts

Add the config and loader together in the HTML box:
3

Fire on all pages

Set the Trigger to All Pages so the bubble loads everywhere.
4

Submit and publish

Submit and Publish the container. Use GTM Preview mode first to confirm the tag fires and the bubble appears.

​
Where to paste, at a glance

​
Tips

  • The widget loads inside an isolated container, so it won’t clash with your site’s styles, and your site’s CSS won’t change how it looks.
  • Paste the chat bubble into a global template or footer once, rather than on every page individually.
  • Re-test your agent in the Sandbox before installing so visitors get the final experience.

​
Troubleshooting

Confirm both scripts are present, that chatbotId is filled in, and that your platform didn’t strip the <script> tags (some page editors do — use a code/footer area instead of body content). Check your browser’s console for errors.
You pasted into a single page’s code instead of the site-wide footer or template. Move the snippet to the global footer / All Pages location for your platform.
Webflow and GTM only go live after you Publish. For other platforms, your site or CDN may be caching — hard-refresh and clear any site/CDN cache.
The widget loads its own font and isolates its styles. If your site enforces a strict Content-Security-Policy, allow the widget’s script and font sources.

Embed & install

Where each snippet comes from and which option to choose.

Visitor experience

What people see and can do inside the chat.

Visibility & access

Control who’s allowed to chat with your agent.

Appearance

Style the bubble and chat window.