Website Live Chat Setup
Learn how to set up and configure the live chat widget on your website with Chatwik.
This document will help you fully set up your website live chat. It explains how to create and configure the settings for a desired website inbox.
Compatibility and Requirements
The web dashboard and the live chat widget work with most modern web browsers:
- Mozilla Firefox: v52 onwards
- Google Chrome: v57 onwards
- Chromium: v57 onwards
- Apple Safari: v14.1 onwards
- Microsoft Edge: v16 onwards
Supported mobile OS versions for the Chatwik mobile app:
- Android: v5.0 onwards
- iOS: v11.0 onwards
How to Create a Website Channel on Chatwik?
Go to Inbox Settings
Navigate to Settings → Inboxes → click the Add Inbox button.
Select Website Channel
Click on the Website icon.
Fill in Channel Details
Enter your website name, URL, and branding preferences:
- Website name: Enter your website's name (e.g., Example Inc.).
- Website domain: Enter your website's domain URL (e.g.,
www.example.com). - Widget color: Click the palette and select a color for your live chat widget.
- Welcome heading: Write a greeting message for your customers (e.g., Hello there 👋).
- Welcome tagline: Enter a subtitle (e.g., We are here to help you with your questions. Ask us anything, or share your feedback.).
- Enable/disable channel greeting: Enable to send a greeting message when customer starts conversation.
- Channel greeting message: Custom greeting to start conversation (e.g., Hi. How can we help you?).
Once all details are entered, click the Create Inbox button.
Add Agents
Select the agents from the drop-down and click Add agents.
Conversations will be routed to agents only if they are associated with the inbox. Even if you are an Administrator, you need to add yourself as an agent to the Inbox to see the Inbox on your screen.
Embed Widget Code
Copy and paste the code snippet shown on the page to your website to start supporting your customers.
- Click the More settings button to open the Additional Settings for Inbox.
- Click the Take me there button to navigate to the newly created Inbox.
Manage Inbox Access
If you want to update the agents with access to the inbox, go to Settings → Inboxes. You will see your website inbox listed there. Click on Settings.
Complete the Website Inbox Setup
You already have a functional website inbox. Let's take a look at the additional Inbox settings.
On your Inboxes screen, click the Gear icon to reach the Settings page.
Settings Tab
Scroll down to see more settings, where you can set up the various notifications and preferences when your website inbox starts functioning:
- Enable email collect box: Enabled by default. An automatic prompt to collect the email ID will be displayed once the customer starts a conversation.
- Enable CSAT: Automatically launches a Customer Satisfaction survey every time a ticket is resolved. Results can be viewed under the Reports section.
Click the Update button to save changes.
Collaborators Tab
Click on the Collaborators tab. Here, you can add agents to the Inbox or delete agents already added. You can also enable or disable the automatic assignment of new conversations to the agents assigned to this inbox.
Click on Update to save the changes.
Business Hours Tab
Click on the Business Hours tab to set the working hours of your team.
Check Enable business availability for this inbox if you have well-defined business hours. Once checked, write your unavailability message to display to customers during off business hours.
Wik AI Note
When Wik AI is enabled on an inbox, the unavailability message is automatically suppressed. Wik AI will handle conversations directly outside business hours. The unavailability message will only be sent if Wik AI hands off the conversation to a human agent or if Wik AI is not configured for the inbox.
Select available business hours for each day of the week along with the proper time zone, then click Update Business Hour Setting.
Pre Chat Form Tab
Click on the Pre Chat Form tab to collect information about your customers as soon as they enter your live chat window/website widget.
- Enable pre chat form: Select Yes to use the pre-chat form or No to keep it disabled.
- Pre Chat Message: Write a message to start a conversation with the customer (e.g., Hi, We need some information to serve you better.).
- Pre chat form fields: Select required fields (Name, Email, and Phone are standard attributes; additional fields are created via custom attributes).
Click the Update button to enable the Pre Chat Form.
Configuration Tab
Click on the Configuration tab to view or retrieve your website widget script code.
Click on the Copy button to copy the code snippet to paste into the root file or HTML head of your website.
Widget Builder Tab
Click on the Widget Builder tab to customize your web live chat widget with settings.
Customize launcher styles, colors, positioning, and widget display settings directly on this page.