Widget Customization
Widget Customization
Section titled “Widget Customization”Personalize the appearance of your chat widget to match your brand and website design.
Settings
Section titled “Settings”All widget customization options are available at Settings → Channels → Web. Select your web channel and open the Appearance tab.
Theme Color
Section titled “Theme Color”The theme color is applied consistently across the entire widget:
- Launcher button background
- Header bar background
- Send button color
- Link highlight color
- User message bubble background
Choose a color that matches your brand identity and ensures good contrast against white text.
Welcome Message
Section titled “Welcome Message”The welcome message is the first text customers see when they open the widget. Keep it friendly and clearly explain what the bot can help with.
Examples:
- “Hi! How can I help you today?”
- “Welcome to Acme Support. Ask me anything about our products and services.”
- “Hello! I’m here to help. What can I assist you with?”
Widget Position
Section titled “Widget Position”| Position | Setting Value | When to Use |
|---|---|---|
| Bottom-right | bottom-right (default) | Standard placement, works for most sites |
| Bottom-left | bottom-left | When right side conflicts with other elements |
Avatar
Section titled “Avatar”Upload a custom avatar image to represent your bot or brand.
- Recommended size: 64 × 64 pixels
- Supported formats: PNG, JPG, WebP
- Tip: Use your brand logo or a friendly bot icon for a consistent look
Preview
Section titled “Preview”After making changes, use the Live Preview panel on the right side of the settings page to see exactly how the widget will appear on your site — before saving.