Live Chat Setup

A Guide on Setting Up Live Chat for your Chatbot.

Wonderchat's built-in feature allows AI chatbots to transfer user queries to a live agent when live chat is preferred. The chatbot administrator can enable this feature for users to access live support.

---

Step 1: Activating Live Chat

1. To activate Live chat, go to "Dashboard" > Actions (⋮) > “Edit Chatbot”.

Click on "Edit Chatbot"

1. Navigate under “Live Chat” tab.

Go under "Live Chat" tab

1. Turn on “Enable Live Chat”.

Turn on "Enable Live Chat"

1. Set the number of messages required before the Live Chat button becomes visible.

Set the number of messages for Live Chat button to be visible

---

Step 2: Select Opening Hours

Hours displayed are hours in your local timezone

1. Once the live chat is enabled, you can set the opening hours in which your site users can engage live support.

2. Drag to toggle your live chat opening hours, where you would wish to allow your site users to contact live support.

3. To disable live chat for off-work days, simply toggle the switch located on the weekday/weekend label

Drag the slider to adjust your opening hours

---

Step 3: Turn On Notifications for Live Chat

1. To turn on notifications for live chats, go to 'Settings' > under 'Notifications' tab

Click on 'Settings' > under 'Notifications' tab

1. Play ringing sound when there is a new live chat

Turn on for Ringing Sound for New Live Chats

• Toggle this to enable a sound alert when a new live chat begins. You can adjust how long the sound will play, such as e.g. (once / until the chat is viewed) from the dropdown menu.

1. Enable desktop notifications for new live chat messages

Enable for Desktop Notifications for New Live Chat Messages

• Activate this option to receive desktop notifications for new live chat messages.

Note: If you see a message stating that "Wonderchat lacks browser notification permissions," follow these steps to enable notifications:

1. Click on the lock icon near the website URL in your browser.

2. Find the "Notifications" setting.

3. Select Allow from the options.

4. Ensure that browser notifications are enabled in your desktop settings as well.

1. Once you've made the desired changes, click the Save Settings button to apply them.

---

Step 4: Preview Live Chat in Testing Mode

1. To test the live chat function before embedding it, go to "Dashboard" > Actions (⋮) > “Embed to Website”

Go to "Embed to website"

1. Click on ‘Preview Widget’

Click on "Preview Widget"

1. In the preview page, you can test out your live chat by clicking on the live chat button

"Speak to a Live Agent" button

---

Step 5: Embed and Test Live Chat on Your Website

1. Once live chat is enabled, you can copy your chat widget embed code and embed it on the website of your choice. For detailed instructions on how to embed a chat widget, you may refer to the guide below:

Chat Widget Embedding

1. Once the widget is embedded, ensure that the ‘live chat’ icon is visible on the top right of the widget. This icon indicates the availability of live chat.

'Live Chat' icon

---

Step 6: Triggering your Live Chat

There are two ways to trigger your live chats

1. By saying the words “live chat”

2. By clicking on the widget button on the top right

Sample Demo for Live Chat

---

Step 7: Responding to Live Chat requests

How to Chat with Customers in Real Time

Whenever a user triggers a live chat, your support agents would receive a live chat request via email

Ensure your support agents are being invited by the chatbot master administrator as at least a "member" or "admin" of the chatbot.

Sample of Live Chat Request notification email

Your support agents will be able to respond to your site visitors in real time. To do so, go to "Live Chats" (left navigation panel). Select the chat and type in your responses live in the chat.

Type your response in the space to reply your customers live.

How to Mark Chats as Resolved

Once you have finished the live chat, you can mark the conversation as resolved.

Click on "Mark as Resolved" on the top-right corner of the chat

Click "Resolve" to confirm

Resolved chats will now be kept under "Resolved" tab.

How to End Live Chat for Site Users

Site users can also end a live session by clicking on the tick icon, on top-right corner of the chat.

'Tick' icon for ending live chat.

Prompt to end live chat

Options for user to save chat history or start a new chat session

---

Step 8: How to Set-Up SMS Alerts for Live Chat requests

Now that you have live chat set-up, you can also create SMS notifications on your phone by setting up this template on Zapier.

To set-up, you may refer to the guide below here:

Twilio

---

If you have any more questions, feel free to reach out to us at [email protected]