Widget Attributes
All configuration is done via data-* attributes on the <script> tag. No JavaScript API calls are needed.
Attribute Reference
| Attribute | Type | Required | Default | Description |
|---|---|---|---|---|
data-server | string | No | https://widget.webnav.ai | Webnav.ai backend server URL |
data-base-url | string | Yes | — | The website URL to crawl and index |
data-theme | string | No | light | Color theme: light or dark |
data-lang | string | No | Auto-detected | UI language: zh, en, zht, ja |
data-logo | string | No | Webnav.ai logo | URL of a custom logo for the widget header |
data-mode | string | No | bubble | Widget display mode |
data-exclude | string | No | — | Comma-separated routes to exclude from crawling |
Examples
Minimal
html
<script src="https://widget.webnav.ai/widget/chat-widget.js" data-base-url="https://yoursite.com"></script>Dark Theme with English UI
html
<script src="https://widget.webnav.ai/widget/chat-widget.js" data-base-url="https://yoursite.com" data-theme="dark" data-lang="en"></script>Exclude Admin Routes
html
<script src="https://widget.webnav.ai/widget/chat-widget.js" data-base-url="https://yoursite.com" data-exclude="/admin,/login,/dashboard"></script>Custom Logo
html
<script src="https://widget.webnav.ai/widget/chat-widget.js" data-base-url="https://yoursite.com" data-logo="https://yoursite.com/logo.png"></script>