Logo Site EngageLab Mark Colored TransparentDocument
Search

Website

LiveDesk supports adding the Website Channel chat widget to web pages to receive visitor inquiries, assign conversations, and provide real-time chat capabilities on your website.

The real-time chat widget is compatible with most modern browsers. The following browser versions are supported:

Browser
Mozilla Firefox: v52 and above
Google Chrome: v57 and above
Chromium: v57 and above
Apple Safari: v14.1 and above
Microsoft Edge: v16 and above

How to Add a Website Channel

"Add Channel" - "Website"

create_website4.png

Enter configuration information

Follow the on-screen prompts to complete the basic information for the Website Channel, then click "Confirm" to create the channel. After it is created, you can continue with additional configuration in tabs such as "Integration," "Settings," "Widget Builder," "Conversation Assignment," "Human Agent," and "AI Agent."

Add the chat widget to the website

After creation, the page will redirect to the channel's detailed configuration page. In the "Integration" tab, you can copy the generated code snippet and paste it into your website to complete the installation.

The following installation methods are currently supported:

Installation Method Description
Bubble code Embeds the standard chat bubble code into a web page and is suitable for most scenarios
iframe code Embeds the chat window using an iframe and is suitable for scenarios that require an independent container
GTM installation Deploys the chat code through Google Tag Manager

Detailed Settings

Scroll down to view more settings. Here, you can configure Website Channel integration, basic settings, pre-chat forms, business hours, and widget appearance.

Integration

"Integration" mainly provides methods for implementing chat bubble code integration and related security settings.

  • Messenger script

    Supports switching between "Bubble code," "iframe code," and "GTM installation," and copying the corresponding installation code. The code includes the websiteToken for the current Website Channel and the sdk.js reference address required for operation.

messger.png

  • User identity verification

    Disabled by default. After it is enabled, the page will display identity verification key information, which can be copied and used by the server side to generate visitor identity verification parameters, improving the reliability of user identity.

identity.png

  • Domain whitelist

    Disabled by default. After it is enabled, only domains in the whitelist are allowed to initialize the Website widget. If there are multiple domains, enter them on separate lines. For local debugging, you need to include the port number, for example, localhost:3000 or 127.0.0.1:8080.

whitelist.png

Settings

Configure the basic parameters, visitor interaction methods, and pre-chat form for the Website Channel.

  • Channel information

    Supports modifying the name of the current Website Channel.

  • Enable Channel greeting

    Disabled by default. After it is enabled, when a user initiates an inquiry for the first time, the system will automatically send a default reply message.

  • Quick commands

    Disabled by default. After it is enabled, a quick command title will be fixed above the chat window input box to guide users to quickly send frequently asked questions. Multiple quick commands can be added, and they are recommended for common questions, inquiry entry points, or routing guidance.

  • Enable CSAT

    Disabled by default. After it is enabled, when the conversation status changes to "Resolved," a satisfaction survey will be sent to the user to collect service feedback.

basicsetting.png

  • Email collection

    Supports the following two configurations:

    • Email collection field: Automatically displays an email input field to the user at the start of the conversation, but completing it is not required.

    • Conversation continuity: When the user is offline, email can be used to continue the conversation with the user. Before using this feature, you need to complete the relevant configuration for the Email Channel.

  • User behavior control

    Supports the "User ends conversation" setting. After it is enabled, users can proactively end the current conversation in the widget, and the system will change the conversation status to "Resolved."

othersetting.png

  • Pre-chat form

    The pre-chat form has been moved to the "Settings" tab for unified configuration. After it is enabled, users must complete the form before officially entering the chat.

    The following content is supported:

    • Form body: Used to explain the purpose of the form, for example, "Hello, please fill in the information below so that we can contact you."

    • Form options: Supports configuring form fields one by one, including parameters such as "Enable," "Variable name," "Variable type," "Name," "Placeholder," and "Required."

    • System preset fields: Supports common fields such as email, phone, firstname, and lastname.

    • Conversation attribute fields: Supports selecting existing conversation attributes as pre-chat fields, which will be written to the corresponding conversation attributes after submission.

    • Email field: Can be used to track visitor identity and also for subsequent transfer to a human agent or offline contact.

prechatting.png

  • Business hours

    Disabled by default. After it is enabled, you can configure business hours, time zone, and non-business-hours message copy for the current Website Channel. During non-business hours, the system will notify visitors that the service is currently unavailable according to the configured content and handle human reception in combination with conversation assignment rules.

worktime.png

Widget Builder

"Widget Builder" is used to configure the appearance and displayed content of the visitor-side chat component. The preview area on the right will display the configuration effect in real time.

  • Theme settings

topic.png

Supports configuring the following parameters:

  • Theme color: Sets the primary color of the widget.

  • Text color: Sets the display color of titles, body text, and other copy.

  • Background image: Supports uploading and replacing the background image of the welcome area.

  • Width: Sets the widget width. The default is 400.

  • Height: Sets the widget height. The default is 700.

  • Bubble settings

bubble.png

Supports configuring the following content:

  • Bubble style: Supports three display modes: "Icon," "Icon + Text," and "Text."

  • Icon: The default icon can be replaced.

  • Text: When the "Icon + Text" or "Text" style is selected, the bubble copy can be configured. The text length cannot exceed 20 characters.

  • Size: Supports different sizes such as mini, small, medium, large, and extra large.

  • Bubble position: Supports setting the display position and configuring the spacing from the bottom and the side.

  • Welcome message

welcome.png

Supports configuring:

  • Title: The main title of the welcome area.

  • Content: The body content of the welcome area.

  • Guidance text: Displayed in the "Instant Answer" area to guide users to quickly start an inquiry.

  • Social media

sns.png

Disabled by default. After it is enabled, you can configure social media platforms or contact channels and display them in the widget welcome card.

  • Submit ticket

ticket.png

Disabled by default. After it is enabled, a ticket entry will be displayed in the widget, allowing users to view or submit tickets.

  • External links

url.png

Disabled by default. After it is enabled, you can add external link cards to display an external help center, FAQ page, or other navigation entry points.

Conversation Assignment

Displays the conversation assignment rules for the current channel. It supports routing rules, AI Agent, and Human Agent responses. The conversation assignment priority is: routing rules > AI Agent > Human Agent.

When routing rules exist, the system will first determine whether the routing conditions are met. If multiple rules exist at the same time, they will be matched one by one in order. If the current conversation does not meet any routing rule, it will be assigned to the AI Agent first; if no AI Agent is configured, it will then be assigned to the corresponding Human Agent.

Automatic assignment is supported, with two mechanisms provided: assignment by concurrent workload and average assignment in sequence.

conversation_collabor5.png

Human Agent

Supports configuring human agents to handle conversation messages for this channel, and members can be added or removed.

set_Humanagent5.png

AI Agent

Supports configuring AI agents to handle conversation messages for this channel. They can be enabled or disabled, and a GPT AI Agent can also be added.

set_aiagent5.png

Icon Solid Transparent White Qiyu
Contact Sales