Widget Installation
Install the Grounded chat widget on your website.
The Grounded chat widget can be installed on any website with a simple embed code. This guide covers the basics - see platform-specific guides for detailed instructions.
Basic Installation
Add this code to your website, just before the closing </body> tag:
<script
src="https://grounded.sh/widget/grounded-widget.js"
data-chatbot-id="YOUR_CHATBOT_ID"
async
></script>
Replace YOUR_CHATBOT_ID with your actual chatbot ID from the dashboard.
Finding Your Chatbot ID
- Go to your Dashboard
- Select your chatbot
- Go to Settings > Embed Code
- Copy the complete script tag
Configuration Options
You can customize the widget using data attributes:
| Attribute | Description | Default |
|---|---|---|
data-chatbot-id | Your chatbot ID (required) | - |
data-position | Widget position: bottom-right or bottom-left | bottom-right |
data-primary-color | Primary button color (hex) | #1a1a2e |
data-welcome-message | Custom greeting message | Set in dashboard |
Example with Options
<script
src="https://grounded.sh/widget/grounded-widget.js"
data-chatbot-id="YOUR_CHATBOT_ID"
data-position="bottom-left"
data-primary-color="#4f46e5"
async
></script>
Platform Guides
Verify Installation
After adding the widget:
- Visit your website
- Look for the chat bubble in the corner
- Click to open and test a conversation
- Check your dashboard for the conversation record
Use your browser's developer tools (F12) to check for any JavaScript errors if the widget doesn't appear.