Customize Widget

Adapt the widget to your brand identity and customer needs.

Access Customization

1. Go to Agents > Select agent
2. Click on Widget tab
3. You'll find all customization options

Theme Options

Colors

| Option | Description | |--------|-------------| | Primary Color | Button and header color | | Background | Chat window background | | Text | Text color | | User Bubble | Your visitors' message color | | Bot Bubble | Agent response color |

Position

Choose where to display the widget:

• Bottom Right (default)
• Bottom Left

Size

• Standard: 380x600px
• Compact: 320x500px
• Large: 420x700px

Texts

Customize all displayed texts:

Welcome Title: "Hello! 👋"
Welcome Message: "How can we help you?"
Input Placeholder: "Write a message..."
Send Button: "Send"

Button (Launcher)

The button that opens the chat:

• Icon: Choose from available icons
• Text: Optional text next to icon
• Animation: Pulse, bounce, or none
• Delay: Time before appearing

Behavior

Auto-open

Auto-open: Yes/No
Delay: 5 seconds
Only First Visit: Yes/No

Welcome Messages

Configure automatic welcome messages:

1. First message: Immediate greeting
2. Second message: After X seconds
3. Quick actions: Suggested buttons

Sound

• Enable/disable notification sound
• Volume
• Custom sound (Pro)

Branding

Logo

Upload your company logo:

• Format: PNG, JPG, SVG
• Recommended size: 120x40px
• Appears in header

Company Name

Displayed name in the header.

"Powered by" Removal

Available in Pro plans.

Advanced CSS

For advanced customization:

/* Custom CSS example */
.leader24-widget {
  --l24-primary: #your-color;
  --l24-radius: 12px;
}

Preview

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

Best Practices

Save and Publish

1. Make desired changes
2. Use Preview to verify
3. Click Save
4. Changes are live immediately

Next steps

• Get embed code
• Monitor conversations
• Manage leads