Quick Start
Add the Navigic chat widget to your website in under 5 minutes.
Prerequisites
- A Navigic account
- A website you can edit the HTML of
- A published agent deployed to the Website Support channel
1. Create an Embed Key
Go to Settings > Embed in your dashboard. Click Create Embed Key and give it a label (e.g., "Production site").
2. Configure Allowed Origins
Add your website's origin to the key's allowed origins list. For example:
https://yoursite.comThis tells Navigic which domains are authorized to use your key. You can add http://localhost:3000 for local development.
3. Assign a Website Support Agent
Your widget needs a published agent assigned to the Website Support channel. Create or publish the agent in Agent Studio, then open Channels > Website Support, choose Change serving agent, select the published revision, and click Serve channel.
If you have not done that yet, follow Launch a Website Support Agent.
The widget can load without a deployed agent, but it cannot provide useful answers until Website Support has a live serving-agent assignment.
4. Copy the Snippet
Choose the public visibility policy for the embed key before copying the snippet. Tool-call status can be useful for support transparency; reasoning should stay off for public support unless you have reviewed the agent behavior.
The dashboard generates a ready-to-paste snippet. Current widget scripts inherit
the embed key's saved visibility policy when no data-show-* override is set.
It looks like this:
<script
src="https://releases.navigic.ai/embed/embed.js"
data-api-key="pk_wk_YOUR_KEY_HERE"
async
></script>Paste it before the closing </body> tag on your website.
5. Verify
Go back to Settings > Embed. The Installation Status card will show your origin as Active once the widget connects. Then send a test message and verify Channels > Website Support > Runtime activity shows the expected agent revision served the message.
If it doesn't connect, check the Troubleshooting guide.
What's Next
- Launch a Website Support Agent — Full setup path from agent draft to installed widget
- Agent Studio — Understand agent authoring and publishing
- Website Support Channel — Understand the channel behind the widget
- Display Modes — Choose between bubble, panel, or inline
- Identity Verification — Link conversations to your users
- JavaScript API — Control the widget programmatically
- Script Tag Reference — All configuration attributes