Add and Configure Your Website Channel

Step 1. Go to the Channels page. Go to Settings → Channels → "Add Channel" button.

Step 2. Click the "Website" icon.

Step 3. Hooray! You have successfully created a website channel. Now, add the widget to your website.

Copy and paste the code snippet shown on the page to your website and start supporting your customers. You can click the Copy button to copy and then paste in the root file of your website.

If you click the More settings button, you will be taken to the Additional Settings for channel. If you click the Take me there button, you will be taken to the newly created channel directly.

Additional Channel Settings

On your channels screen, click the gear icon to reach the Settings page. You will see the following screen:

Settings Tab

Here are a couple of examples for your understanding:

Enable email collect box is enabled by default. It means an automatic message to collect the e-mail ID will be displayed once the customer starts a conversation. The customer/end user will receive a prompt to enter an email ID.

Click the **Update** button to save the changes you have made.

Step 4. Enter your website name, URL, and other details as described below.

Field Name	Value	Remarks
Website Name	Enter the name of your Website.	e.g. Example Inc.
Website Domain	Enter the link to your Website.	e.g. www.example.com
Widget Color	Select the color by clicking the palette.
Welcome Heading	Give a greeting with which you would like to address the customer.	e.g. Welcome!
Welcome Tagline	Give a tagline representing your company.	e.g. Welcome to Example! We are at your service 24/7.
Enable Channel Greeting	Select enabled or disabled.	Auto-send greeting messages when customers start a conversation and send their first message.
Channel Greeting Message	Give a greeting which you would like to start the conversation with.	e.g. Hi. How can we help you?
Send message before auto-resolving	Select enabled or disabled.	Sent to the customer right before the conversation is auto-resolved. Leave empty to skip.
Set Reply time	Select the expected reply time.	This reply time will be displayed on the live chat widget. Options: In a few minutes, In a few hours, In a day.
Enable email collect box	Select enabled or disabled.	Enable or disable the email collect box on new conversations.
Send transcript on resolution	Select enabled or disabled.	When enabled, a transcript of the conversation will be automatically sent to the user's email when the chat is marked as Resolved.
Auto-Assign Upon Reply	Select enabled or disabled.	Auto-assign pending conversations upon agent's reply.
Allow messages after conversation resolved	Select enabled or disabled.	Allow end-users to send messages even after the conversation is resolved.
Allow Message When User is Queued	Select enabled or disabled.	Allow end-users to send messages after the conversation is queued.
Show Previous Conversations	Select enabled or disabled.	Allows users to see a history of their previous conversations.
Limit History Conversations	Enter a number.	Set the maximum number of previous conversations to display in the widget. Leave empty or set to 0 to show all conversations.
Enable conversation continuity via email	Select enabled or disabled.	Conversations will continue over email if the contact email address is available.
Help Center	Select a Help Center.	Attach a Help Center with the channel.

Once all details are entered, click the “Create Channel” button.

Collaborators Tab

Click the Collaborators tab.

Agents

Here, you can add or remove agents from the channel. Select agents from the drop-down list and click Update to save.

Conversation Assignment

Manage how new conversations are assigned to agents:

• Enable auto assignment — Automatically assign new conversations to agents added to this channel.
• Auto assignment limit — Limit the maximum number of conversations from this channel that can be auto-assigned to a single agent.
• Show queue position to visitors — When enabled, visitors waiting in the queue will see their numeric position (e.g. "You're 3rd in line"). Visitors beyond the top 10 will see "10+ in line".
• Request a Callback While Waiting — Lets clients request a callback while waiting in the queue. After a configurable wait time set in Settings, a form appears for the client to fill in.
• Queued Message — The message displayed to users when they are in the queue.
• Delay before sending (seconds) — How long to wait after a conversation enters the queue before this message is sent. Enter 0 to send it immediately. Maximum 600 seconds.

Click Update to save the Conversation Assignment settings.

First Response Time Calculation

Configure the start point used to calculate the first response time for this channel. Select from the FRT start point dropdown (e.g. "Conversation Assigned").

SLA

A contract defining service expectations, performance metrics, and accountability between the provider and the client.

• Enable SLA — Enable or disable SLA for this channel.
• SLA — Select the SLA policy to apply.
• Event — Select the event that triggers the SLA (e.g. "Message Created").

Click Update to save the SLA settings.

Set Inactivity Timeouts

If the agent goes offline after the set time, the conversation will be reassigned.

• Enable Inactivity Timeout — Enable or disable inactivity timeouts, after which a visitor will be transferred to a new agent.
• Set Inactivity Timeouts — Define the inactivity period in Minutes and Seconds before reassignment is triggered.

Require label before resolving

Prevent agents from resolving a conversation in this channel until a required label is applied.

• Require a label before resolving — When enabled, agents must apply at least one of the labels selected below before they can resolve a conversation.
• Allowed labels — Select the labels that allow a conversation to be resolved. Applying any one of them is enough.

Click Update to save.

CSAT Tab

Click the CSAT tab.

Automatically trigger CSAT surveys at the end of conversations to understand how customers feel about their support experience. Track satisfaction trends and identify areas for improvement over time.

• Enable CSAT — Enable or disable the CSAT survey.

Display Type

Select a display type:

• Emojis — Allow customers to rate using emoji faces.
• Stars — Allow customers to rate using stars.
• Numbers — Allow customers to rate using numbers.

Message

Add a custom message to include in the survey using the rich text editor.

Response Time Limit

• Prevent customers from rating after the configured time — When enabled, customers will no longer be able to submit a rating after the specified duration from conversation resolution.

Survey Rule

• Send the survey if the conversation — Choose the condition from the dropdown when the survey should be sent.
• any of the labels — Filter by selecting labels so the survey is sent only for conversations with those labels.

Click Update CSAT to save.

Business Hours Tab

Click the Business Hours tab. In this section, you can set the working hours of your team.

Click the checkbox for Enable business availability for this channel if you have well-defined business hours.

Once the checkbox is ticked, the below section opens up. You can write your message to be displayed to the customer outside business hours.

You can also select the available business hours for each day of the week, along with the proper timezone.

Click the Update Business Hour Setting button.

Pre-Chat Form Tab

Click the Pre Chat Form tab.

With this, you can collect information about your customers as soon as they enter your live-chat window/website widget. You can use this to collect customer info such as name and email address before beginning the chat.

Field Name	Value	Remarks
Enable pre-chat form	Select yes or no.	Yes, if you want to use the pre-chat form. No, if you do not want to.
Pre-chat message	Give a message to start a conversation with the customer.	Hi, we need some information to serve you better.
Visitors should provide their name and email address before starting the chat.	Tick in the checkbox if you need the name and email address mandatorily.	This will help us maintain our contact list better.

Click the Update button. The pre-hat form is enabled now.

Configuration Tab

Click the Configuration tab to find the widget installation script and identity validation settings.

Messenger Script

Place this script snippet inside the <body> tag of your website. You can click the Copy button to copy the code, or click Open in CodePen to view and test it.

User Identity Validation

With this key, you can generate a secret token that can be used to verify the identity of your users. Click Copy to copy the key.

Enforce User Identity Validation

• Enable — If enabled, requests that cannot be verified will be rejected.

Custom User Identity Validation URL

If set with a valid URL, the system will force the user to go to this URL to verify their identity (e.g., https://example.com/login).

Widget Builder Tab

You can customize your web widget with simple settings given on this page. You will be able to see your changes live.

Widget Builder Home page

• Show home screen — Adds a Home tab to the widget with a welcome message and an image. Visitors land here when they open the widget.

When enabled, configure the following fields:

• Home icon — Upload an icon for the home tab (Max 5MB).
• Home heading — Enter a heading message displayed on the home screen (up to 60 characters).
• Home subtitle — Enter a subtitle displayed below the heading (up to 140 characters).
• Welcome message font — Select a font for the welcome message from Google Fonts (falls back to the default font if blocked).
• Welcome message font size (px) — Specify the font size in pixels for the welcome message.
• Welcome message color — Pick a color for the welcome message text.
• Home background color — Pick the primary background color for the home screen.
• Home background gradient end — Set the ending color for a background gradient. Set the same color as above for a flat background.
• Home image / banner — Upload an image or banner to display on the home screen (Max 5MB).
• Banner orientation — Select Horizontal or Vertical. A vertical banner shrinks to the available space so the home screen never scrolls.
• Heading and subtitle position — Select the position of the heading and subtitle relative to the banner (e.g. Above the banner).
• Content vertical position — Choose the vertical alignment of the content (e.g. Bottom).
• Content horizontal position — Choose the horizontal alignment of the content (e.g. Left). Positions the heading, subtitle, and banner while keeping the icon top-left and the button pinned to the bottom.

Example of the Home page

Widget Notification Style and Widget position settings

Next Steps

Find the detailed steps to configure each channel below:

➡️ Facebook messenger channel

➡️ WhatsApp channel

➡️ SMS channel

➡️ Email channel

➡️ Connect a channel using API

➡️ Telegram channel