Web Widget Integration

How to Add NIVA Chat Widget to Your Website

2–5 minutes Easy 5 steps

The NIVA web widget is a lightweight JavaScript snippet that adds a fully branded AI chat bubble to any website or web app. It works on any tech stack — WordPress, Shopify, React, plain HTML — with no framework dependency. Configure it once in NIVA and your bot is live on your site in under 5 minutes.

Before you begin

NIVA botmaster account with a bot configured and active

Access to your website's HTML (or theme settings for CMS platforms)

Step-by-step setup

Get Your Widget Embed Code

Log in to your NIVA botmaster dashboard
Go to Settings → Widget (or Embed)
Copy the JavaScript snippet shown — it includes your unique bot token

Each bot has its own unique snippet. Make sure you copy from the correct bot if you have multiple.

Paste the Snippet into Your Website

Open the HTML of the page (or your global layout/template file)
Paste the snippet just before the closing </body> tag
Save and publish the page

Placing it before ensures the page loads before the widget initialises — no layout shift.

WordPress or Shopify (CMS)

WordPress: Go to Appearance → Theme Editor → open footer.php → paste before </body>. Or use a plugin like Insert Headers and Footers.
Shopify: Go to Online Store → Themes → Edit Code → open theme.liquid → paste before </body>
Wix / Squarespace: Use the Custom Code / Embed section in site settings and paste the snippet there

Verify the Widget Loads

Visit your website — you should see the chat bubble in the bottom-right corner
Click it to open the chat and send a test message
The bot should reply within a few seconds

Customize Appearance (Optional)

Back in NIVA botmaster → Settings → Widget
Change the bubble colour, position, greeting message, and avatar
Changes apply instantly — no need to update the snippet

You can also restrict which domains the widget loads on from Security → Allowed Origins.

Troubleshooting

Widget does not appear

Check the snippet is pasted before . Open browser DevTools → Console for JS errors.

Bot replies with an error

Ensure the bot is active and at least one knowledge source is connected.

Widget blocked by CSP

Add your NIVA domain to your Content-Security-Policy header: script-src and connect-src.

Widget shows on staging, not production

Check Allowed Origins in Security settings — add your production domain.

Ready to connect Web Widget?

Open your NIVA botmaster → Omnichannel → Configure

Open Omnichannel