- You must be the account owner or admin to configure these options in the channels
- As you begin to customize your live chat, you’ll see a preview of your changes on the right-hand side of your screen.
Set up Live chat widget mode

Step 1: Style your Live chat appearance
- Headings in your live chat
- Buttons
- Customer response
- Live chat launch icon
Step 2: Configure welcome message behavior
Display version | Welcome message | Welcome message + Reply suggestion |
![]() | Disable the welcome message | |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
- The live chat will send the reply suggestion under the team avatar even after enabling the Show agent avatar option in the Appearance setting.
- The Automatically expand only applies to the full welcome message window.
Step 3: Identify potential leads
- Disable: Disable the lead identification form.
- Enable and non-skippable: Every visitor needs to fill in this form to start the conversation with your business
- Enable and skippable: Visitors can choose to leave their data to become your business's lead or start the conversation like a normal guest by clicking Continue as guest option.
- Check out our documents here about the type of Contacts in Chative to understand how we evaluate customers
- After a lead leaves their details, the data will be added to their profile, which can be found in the Contact
Step 4: Set up Live chat language
- Live chat appearance language: You can add another language for the header text, the welcome message,... which you have set up in the steps above. All you need to do is click the + Add language button > click the eye icon until it turns green > start to edit the text
- Live chat system language: The text such as "a moment ago", "type here",... All of these texts can be edited in the Translation section in your Account Settings.
- If the language you set up doesn't match with the customer's browser language, the system language will automatically default as the Preferred language.
- You can read this document for more details on how to set up a multilingual live chat.
Step 5: Set up Live chat notification
- Blink browser tab: Blink the browser tab when unread messages arrive
- Unread message popover: Let the unread message become visual by having them automatically pop up
- Pop up disappear after: The timing for the Unread message popover
- Place red circle dot: Let customers know there are unread messages by showing a red circle dot above the live chat launcher icon.
Set up Chat as the content mode

- The position option (left / right) in Appearance section
- In the Notification section, only the "Blink browser tab" is available
2. Set up the appearance, language, and notification.
- Chat background: The chat background's color. We recommended choosing the colors that show your Brand or match the Website.
- Display header: The live chat header shows the bot name and avatar
- Fix height: The height of the live chat
- Composer mode:
- Interaction mode: Only show reply composer after an agent's message to prevent the user from typing messages.
- Static mode: Always show reply composer
Set up Chat as the landing page mode

Chat as the landing page setup will have all the settings like in the live chat normal mode. But in the Notification section, only the "Blink browser tab" option is available
After you have set up the live chat appearance, behavior language, lead identification, notification, you can also set up the whole webpage appearance to make it more attractive.
Please follow this guideline customize the Chat as the landing page live chat mode:
2. Set up the appearance, language, and notification.
- Chat background: The chat background's color.
- Display header: The live chat header shows the bot name and avatar
- Composer mode:
- Interaction mode: Only show reply composer after an agent's message to prevent the user from typing messages.
- Static mode: Always show reply composer
5. Customize your Page Content with:
- Page Theme: There are two types of theme that you can choose which are:
- Gradian: Your page background will be the color you choose.
- Image: The image you choose will be the background. And if you choose this option, you will be able to add a layer filled with a solid color in the Background image color mask option.
- Page logo: The web page logo, which is like the "Disney" logo in the example above.
- Page description: The description for your live chat.
- Landing page URL: The webpage link.
Note: the Background image color mask option will only appear when you choose to add an Image in the Page Theme