Live Chat Widget

​

Overview

​

Features

• Real-time Communication: WebSocket-powered instant messaging
• Customizable Appearance: Match your brand colors and style
• Mobile Responsive: Works seamlessly on all devices
• File Attachments: Support for document and image uploads
• Session Management: Persistent conversations across page reloads

​

Setup Instructions

​

Step 1: Create the Channel

1. Navigate to Agents → Your Agent → Channels
2. Click “Create Channel”
3. Select “Live Chat” as the channel type

​

Step 2: Configure the Widget

• Widget Name: Display name shown to customers (e.g., “Support Chat”)
• Allowed Domains: Websites where the widget can be embedded (e.g., example.com)

​

Step 3: Save and Get Installation Code

1. Click “Save”
2. Copy the widget installation code provided
3. Add the code to your website’s HTML (before the closing </body> tag)

​

Installation

<script src="https://yourdomain.com/widget.js" data-agent-id="your_agent_id"></script>

​

Configuration Options

​

Managing the Channel

​

Activate/Deactivate

​

Edit Settings

1. Navigate to Agents → Your Agent → Channels
2. Click the Live Chat channel
3. Update the configuration
4. Click “Save Changes”

​

Delete Channel

1. Navigate to Agents → Your Agent → Channels
2. Click the Live Chat channel
3. Click “Delete Channel”
4. Confirm the deletion

​

Best Practices

1. Test First: Install the widget on a staging site before production
2. Secure Domains: Only add trusted domains to the allowed list
3. Monitor Performance: Track response times and customer satisfaction
4. Keep Updated: Regularly check for widget updates and improvements
5. Mobile Testing: Verify widget works well on mobile devices

​

Troubleshooting

​

Widget Not Appearing

• Verify the widget code is installed correctly on your website
• Check that the domain is listed in allowed domains
• Ensure the channel is activated
• Clear browser cache and refresh the page
• Check browser console for JavaScript errors

​

Messages Not Sending

• Verify internet connection is stable
• Check that WebSocket connections are not blocked by firewall
• Ensure the agent has active data sources configured
• Check browser console for connection errors

​

Widget Displaying Incorrectly

• Check for CSS conflicts with your website
• Verify widget code is placed before </body> tag
• Clear browser cache and hard reload
• Test in different browsers to isolate the issue

​

Next Steps