Set Up a Live Chat Channel

A live chat channel adds a chat widget to your website, allowing visitors to communicate directly with your agents in real time. Unlike SMS, WhatsApp, and Facebook channels, Live Chat does not require an external service—the chat widget is generated by the Cloud PBX and embedded on your website using a code snippet. This article describes how to set up a live chat channel.

Prerequisites

• Website: A website where you want to embed the chat widget. For security reasons, the widget will only load on the specified domain.
• HTTPS (for phone calls): If you would like to allow website visitors to make phone calls through the chat widget (Phone and Chat mode), your website must support HTTPS.
• WebRTC Trunk (for phone calls): To enable phone calls through the chat widget, a WebRTC trunk and a corresponding inbound route must be configured in the PBX beforehand.
• Domain Name: The domain name of your Cloud PBX must not contain underscores (_), as this can interfere with authentication.
• Domain Certificate: If your PBX uses a custom domain (not the provider's default domain), a valid domain certificate must be installed.

Limitations

Set Up the Live Chat Channel

1. Log in to the Cloud PBX administration portal.
2. Navigate to Messaging > Message Channel.
3. Click Add and select Live Chat.

General Tab

Configure the basic settings, interaction mode, and routing for the Live Chat channel.

• Name: A descriptive name (e.g., “Live Chat” or “Website Support”).
• Website Domain: The domain of the website where you want to embed the chat widget (e.g., www.example.com). The widget will only load on this domain.

Interaction Mode:

• Chat Only: Website visitors can communicate with agents via text messages only.
• Phone and Chat: Website visitors can communicate via text messages or phone calls. Requires HTTPS on your website, a WebRTC trunk, and a corresponding inbound route.

Destination: Choose where incoming messages from the chat widget are routed:

• Extension: Messages go directly to a specific extension.
• Message Queue: Messages go to a queue where multiple agents can handle them.

Advanced settings:

• Maximum Concurrent Calls: The maximum number of phone calls supported simultaneously through the chat widget (default: 5, maximum: 10). Only relevant in phone and chat mode.
• Supported Message Types for Visitors: Choose whether visitors can send text only or text and images.
• Close Session Automatically: Enable this option and set a timeout in days to automatically end inactive sessions.

Display & Appearance Tab

Customize the look and feel of the chat widget that appears on your website.

Appearance:

• Theme: Choose between Light Mode and Dark Mode.
• Theme Color: Select a color for the chat widget header and accents.
• Minimized Window Type: Choose how the chat widget appears when minimized—as a bubble or a Bar.
• Chat Icon: Select the icon displayed on the minimized chat widget.

Display:

• Default Agent Profile Photo: Upload a profile photo that is shown by default in the chat widget.
• Default Agent Name: The name displayed in the chat widget header (e.g., “Support”).
• Agent Information Display: Choose what agent information is shown to visitors—None, Name, or Name and Profile Photo.

Message Tab

Configure the language, pre-chat form, and automatic messages for the chat widget.

Language: Select the display language for the chat widget, or choose to follow the visitor's browser language automatically.

Pre-Chat: If enabled, visitors must fill in a form (name, email, phone number) before starting the chat. You can also enable a data privacy and consent checkbox.

Messages:

• Online Greeting Message: Displayed when the chat is opened during business hours and an agent is available.
• Offline Greeting Message: Displayed when the chat is opened outside business hours or when no agent is available.
• Auto-response to the First Message: Automatically sent when a visitor sends their first message.
• Chat Session Closed Message: Sent when a session ends (manually or by timeout).

Save and Get the Embed Code

1. Click Save.
2. After saving, click Embed Code in the top-right corner of the channel configuration.

3. Copy the generated code snippet.
4. Paste the code snippet into your website's HTML, before the closing </body> tag.

Result

After embedding the code snippet, the Live Chat widget appears in the bottom-right corner of your website. Visitors can click on the widget to start a conversation with your agents. The channel is also shown in the channel list under Messaging > Message Channel with a green status icon.

Important Notes

• Domain restriction: The chat widget only loads on the domain specified in the channel configuration. It will not appear on other domains.
• Browser compatibility: The chat widget is supported in Google Chrome, Microsoft Edge, and Firefox. Other browsers may not work as expected.
• Widget position: The chat widget is fixed to the bottom-right corner of the website. Its position cannot be changed.
• Business hours: Online and offline greeting messages depend on the business hours configured in the PBX. Make sure they are set up correctly to ensure visitors receive the appropriate message.
• Session limit: The Live Chat channel supports up to 20 active sessions simultaneously. When the limit is reached, new visitors will not be able to start a chat.