Livechat Widget Appearance

Prev Next

The Livechat Widget's appearance can be customized to fit your branding style for online and offline hours. The fields on the registration form and the messages displayed after a conversation are both customizable.

To access Livechat appearance settings, go to Administration > Omnichannel > Livechat Appearance. This document describes the available settings.

General settings

Field

Description

Hide "powered by Rocket.Chat"

Enable this option to hide the watermark in the widget.

Livechat background

Enter the widget background color as hexadecimal (#F5455C), a color name (red), or an image using a URL (url('https://example.com/image.png')). This field follows CSS standards. See the background property documentation for details.

Livechat widget position on the screen

Select the position of the widget on your site - Left or Right. The widget is displayed at the bottom of the page.

Hide system messages:

Select the system messages that you want to hide in the livechat conversations in the widget. The options are as follows:

  • Hide "User Join" messages

  • Hide "User Leave" messages

  • Hide "Conversation finished" messages

  • Hide "Conversation started" messages

  • Hide "Conversation transfered" messages

Allow visitors to finish conversations

Enable this setting to provide the option to visitors to close an ongoing livechat conversation. When enabled, visitors can click Options at the bottom of the livechat widget and click Finish this chat.

Livechat widget online appearance

Field

Descriptions

Title

Enter the title of your livechat form. By default, the value is Rocket.Chat.

Title bar color

Set the color of the title bar of your widget. The following screenshot shows what the title bar looks like by default:

Enable message character limit

Enable this setting to enforce a limit on the number of characters in livechat messages.

Message Character Limit

Enter a maximum number of characters per message. The Enable message character limit setting must be enabled.

Show agent information

Enable this setting to display the agent names in livechat conversations.

Show agent email

Enable this setting to display agent emails in livechat conversations.

Livechat widget offline appearance

Field

Description

Display Offline Form

Enable this setting to display the livechat form out of operating hours. This form will be displayed when no agent is available. You can set up your operating hours using the Business Hours feature.

Offline Form Unavailable Message

Enter the message visitors will see when the offline Livechat form is unavailable.

Offline message

Enter a message to display during offline hours.

Title offline

Enter a title for the offline livechat form.

Title bar color offline

Set the title bar color for the offline form. The following screenshot shows what the title bar looks like by default:

Email Address to Send Offline Messages

Set the email address to which offline messages will be sent. Make sure that you have configured email in your workspace.

Offline Success Message

Enter the message you want to display to visitors after they successfully send an offline message.

Livechat widget registration form

Field

Description

Enabled

Enable the livechat registration form. This form is displayed when visitors access the livechat widget.

Show name field

Enable this setting to display the name field so visitors can enter their names in the livechat form.

Show email field

Enable this setting to display the email field so visitors can enter their email address in the livechat form.

Registration Form Message

Enter any further instructions or information for your visitors in this field. It is displayed right under the widget title.

  • You can add custom fields that can be displayed on the livechat form for visitors to enter additional details. For example, phone number.

  • Visitors can also select departments if you have enabled the option.

Conversation finished messages

Field

Description

Conversation Finished Message

Enter the message title you want to send to the visitor when the conversation ends.

Conversation Finished Text

Enter the message text you want to display to the visitor when the conversation ends.

For additional configuration options, see Omnichannel Admin's Guide. Refer to the Livechat Widget API for further customization options.