Skip to content

Widget Look & Feel

Customize the appearance and branding of your agent's chat widget.

Overview

The Widget Look & Feel customization allows you to brand your agent's chat interface to match your company's visual identity and user experience requirements.

Accessing Widget Settings

  1. Navigate to MY AGENTS
  2. Select your agent
  3. Click Widget Look and Feel from the agent menu

Customization Options

Branding

Logo - Upload your company logo - Recommended size: 200x50 pixels - Supported formats: PNG, JPG, SVG

Colors - Primary color: Main theme color - Secondary color: Accent elements - Background color: Chat window background - Text color: Message text color

Chat Window

Position - Bottom right (default) - Bottom left - Top right - Top left

Size - Small: 320x400px - Medium: 400x600px (default) - Large: 500x700px - Custom dimensions

Welcome Message

  • Customize the initial greeting
  • Add agent avatar
  • Include quick action buttons

Chat Bubble

  • Bubble color
  • Bubble icon
  • Bubble text
  • Animation style

Preview & Testing

Use the live preview to see changes in real-time before publishing.

Preview Options: - Desktop view - Mobile view - Tablet view

Publishing Changes

  1. Review your customizations in the preview
  2. Click Save
  3. Click Publish to make changes live
  4. Widget updates typically take 1-2 minutes to propagate

Code Snippet

After customization, get the embed code:

<script src="https://PLATFORM-URL-PLACEHOLDER/widget.js"
        data-agent-id="your-agent-id"
        data-theme="custom">
</script>