Integrations

Add ChatNox to any website

Works with plain HTML sites, React, Next.js, Webflow, Wix, Squarespace, or literally anything that lets you paste a script tag.

Copy your site key

Find it in your ChatNox dashboard under Settings → Install. Every site on your account has a unique key.

Paste the snippet before `</body>`

Add this to every page you want the chat widget to appear on — or just your site-wide template/layout file.

Reload your site

The chat bubble will appear in the bottom-right corner automatically. No further setup needed.

Add before </body> HTML

<script>
  window.ChatNoxConfig = {
    siteKey: "YOUR_SITE_KEY",
    apiBase: "https://chatnox.xyz/api"
  };
</script>
<script src="https://chatnox.xyz/widget/widget.js"></script>

Replace YOUR_SITE_KEY with the key from your dashboard. That's the entire integration — no build step, no npm package required.

Add ChatNox to your Shopify store

Install it once in your theme and it shows up on every page of your storefront — product pages, cart, checkout landing, all of it.

Open your theme code

In your Shopify admin, go to Online Store → Themes, find your published theme, click the ⋯ menu, then Edit code.

Open `theme.liquid`

Under the Layout folder, open theme.liquid. Find the closing </body> tag near the bottom of the file.

Paste the snippet and save

Paste the code below right above </body>, then click Save. The widget goes live immediately across your store.

theme.liquid — add before </body> Liquid / HTML

<script>
  window.ChatNoxConfig = {
    siteKey: "YOUR_SITE_KEY",
    apiBase: "https://chatnox.xyz/api"
  };
</script>
<script src="https://chatnox.xyz/widget/widget.js"></script>

Tip: some Shopify themes wrap third-party scripts to run only on storefront pages, not the theme editor preview — that's expected, it'll still load correctly for real visitors.

Add ChatNox to your WordPress site

Two ways to install — pick whichever fits how comfortable you are editing theme files.

Option A — Theme editor (fastest)

Go to Appearance → Theme File Editor, open footer.php, and paste the snippet right before the closing </body> tag. Click Update File.

Option B — Plugin (no code editing)

Install a free plugin like "Insert Headers and Footers" from Plugins → Add New. Paste the snippet into its Footer box and save.

Check your site

Visit your site in a new tab. The chat bubble should appear in the bottom-right corner on every page.

footer.php — add before </body> HTML

<script>
  window.ChatNoxConfig = {
    siteKey: "YOUR_SITE_KEY",
    apiBase: "https://chatnox.xyz/api"
  };
</script>
<script src="https://chatnox.xyz/widget/widget.js"></script>

Note: if you switch WordPress themes later and used Option A, you'll need to re-add the snippet to the new theme's footer.php — Option B (plugin) survives theme changes.

✦

More integrations — Wix, Squarespace, Webflow app, and a Zapier connector — are on the way.