The chat widget

What visitors see in the chat widget, and how to set its colour, position, texts, pre-chat form and offline message, or open it from your own button.

The chat widget comes with the coview snippet: a launcher button in a corner of every page, and a chat panel that opens from it. Its settings are kept per site in Settings › Install & widget, on the Appearance tab, for members with the Widget, install code and sites permission.

What visitors see

  • The header shows your title and whether the team is online: "Online · we usually reply in a few minutes", or "We'll reply by email" when nobody is.
  • A Chat tab with the conversation, and a Tickets tab with their tickets and Report a problem. See Customers reporting a problem.
  • A Call us button in the header when they can call your team. See Voice and video calls.
  • Their messages are marked Sent, then Seen once your team has read them, and they see when someone is typing or joins the conversation.
  • Files your team attaches show under the message: images as thumbnails, other files as a link to download.
  • When your team writes while the panel is closed, the launcher shows how many messages are unread. A message your team starts with Show as a bubble appears next to the launcher.

Messages are up to 5,000 characters. When a conversation is resolved, the widget says so, and the visitor's next message starts again.

The widget speaks English, or Vietnamese when your page's <html lang> starts with vi.

Change its look and texts

  1. Open Settings › Install & widget and the Appearance tab. With more than one site, pick the site at the top.
  2. Edit the fields below. The preview beside the form shows the chat, the pre-chat form and the offline state.
  3. Click Save. Visitors see the change within a minute.
FieldWhat it does
Brand colorThe launcher and accents. Pick a swatch or enter a 6-digit hex colour.
PositionBottom right or Bottom left.
Launcher labelText on the launcher, up to 40 characters. Leave it empty for an icon-only button.
Header titleThe name at the top of the chat, up to 60 characters.
GreetingThe first thing visitors read, up to 500 characters.
Offline messageShown when no agent is online, up to 500 characters.

The pre-chat form

Before their first message, the widget can ask visitors for their Name, Email and Phone. Set each to Required, Optional or Hidden. By default the name is optional, the email required and the phone hidden.

With Allow anonymous chat on, the form has an "Or chat anonymously" link, and visitors can skip it. If every field is hidden, anonymous chat must stay on. The form only asks for what coview doesn't already know about the visitor, for example from identify or an earlier chat.

When nobody is online

The widget shows your team as online while at least one person who can reply is active in the console. When nobody is, and coview doesn't have the visitor's email yet, the widget shows your offline message with a form for their email and message. Your team answers from the inbox; when the visitor has left your site, coview emails them the reply. See Answer chats in the inbox.

Open the chat from your own button

Add data-coview-open to any link or button on your page, or call coview('open') from your code:

<a href="#" data-coview-open>Talk to us</a>

<script>
  document.querySelector('#help').addEventListener('click', () => coview('open'));
</script>

coview('close') and coview('toggle') work the same way. See the coview() JavaScript API.

Still stuck?

A person from coview will help — send us a message, or book a demo and we'll walk through it with you.