1) Why do I need online chat?
2) Placing chat on the site
3) Settings and usage scenarios
You can connect online chat to your website as a channel for receiving requests. EddyDesk provides a fully ready and flexible tool that helps your website visitors to quickly get an answer to their question. There's no need to search for a support email and draft an email, no need to call anywhere or wait for them to call you back, just write your question in the chat and get it answered right away.
The benefits of having an online chat on your site:
- Communicating with customers at any time. A support operator at night can be replaced by a chatbot, which you can also create and set up in EddyDesk. It will help the customer get answers to typical questions, and the operator will join the conversation during working hours if necessary.
- Help with an order, service, or product selection. The operator can help the customer to answer his questions, suggest a replacement, alternative or other ways to solve the problem.
- Feedback from users. At the end of the dialog your customer can evaluate the support service and you can use the data to build a report and analyze the quality of the customer service.
- Possibility to communicate with several clients at a time. An operator can meet only one customer at a time over the phone, while chat allows you to correspond with several customers at the same time.
- Increased communication speed through auto-replies and quick buttons. Sometimes the client doesn't even have to write a question: buttons help them choose a subject and describe the problem. And auto-answers save time for both the customer and the support staff member.
The benefits of using online chat speak for themselves. Now let's see how you can install the widget on your website, how it will look like and what settings are available for it.
Go to the settings by opening the menu "Omni" (in the panel on the left) → section "Settings" → "Widget and chat settings":
Here are the basic tools for setting up the chat, including the widget code. It must be copied and placed in the body block on your site:
Example of the placement and work of the online chat:
Далее чуть ниже в настройках идет визуальная составляющая виджета, где можно задать цвет для текста и фона сообщений либо кнопок, а также выбрать расположение чата на сайте.
In addition to the visual components, the following settings are available:
1) Make e-mails an optional field. In this case the widget will not require the user to enter e-mail and it will be generated automatically when creating a request.
2) Do not show the field "e-mail". When enabled the widget will not ask for the user's e-mail (the field will not be displayed).
3) Do not show the field "Name". When enabled the widget will not ask for a name from the user (the field will not be displayed), and the operator will display "Visitor" (by default) instead of the client's name.
At the bottom of the page is a separate button with a preview of the appearance of the widget, where you can experiment with the settings in real time, before you publish the chat to the site:
Let's consider the different ways of working when using online chat.
The first time a customer contacts you can set up a welcome message (autobuffing), as well as sending quick buttons to help the user select the topic of contact.
To create these buttons, go to menu "Omnichannel buttons" and create a group (set) of buttons for the chat widget:
Then we return to the settings of the widget and chat, and at the bottom select a welcome message and a group of buttons, which were created earlier:
После чего клиенту при обращении в чат отправится выбранный автоответ, а также набор предложенных кнопок (тематик обращения на выбор):
As soon as one of the buttons is pressed, its text content will be sent to the chat. On this basis, you will have a lot of options available to you with the automation tool (menu "Dispatcher"):
- Automatically distribute requests between operators and departments. For example, if the client chose the "Payment" subject, the request will be distributed to the employee of the "Sales" department.
- Build your own chatbot and send automatic answers to the most frequently asked questions. Operators will be happy to get rid of the routine, and customers will get answers to their questions in seconds.
- Send auto-tabs outside of business hours - customers will know that their request is accepted and will be processed a little later.
Q: Can I pass user data to the widget?
A: The system has the ability to pass the name and email to the widget, using the data attributes. To do this, you need to add the field in the widget code, in the script tag:
This will allow to automatically substitute the user's data in the widget and the client will not have to re-enter his/her data to address in the chat each time.
Q: How to set your own widget icon?
О: A: You can find an instruction and a code example on how to install an icon in the article.
Q: Can I display online chat only on certain pages of my website?
A: This feature is available in the widget settings in the menu "Scripts".
Q: How do I change the text labels in the widget?
A: The text labels in the widget, as well as other text elements of the system, can be changed by editing the language file in the "Language" menu. Instructions.
Q: How do I change the language of a widget?
A: The language of the widget can be changed by editing the attribute data-lang="en" in the script. For this purpose, instead of en specify the desired language.
Q: Can I not display the names of the employees in the chat?
A: Instead of the name, you can specify an alias in their cards in the "Contacts" menu. The set nickname will be displayed to the client instead of the real name of the employee:
Q: Do you have ready examples for chat with the description of CSS styles (customization, design)?
A: More flexible editing the appearance of the chat widget is available with the css-code customization of the elements.
The following color palettes are used in the omnichannel settings:
Employee message background: #EBF9FC
Visitor message background: #3D8BF0
Button background: #3D8BF0
Buttons background on hovering: #F054BA
Employee text color: #1E253C
Visitors text color, button text color, button text color on hover: #FFFFFFF
In attachment to the article (at the top of the page) there is additionally available .css file with all styles description - its content should be placed in the Stylesheet (CSS) block according to the instruction above.
Similarly, you can edit the elements and choose the best color palette of your choice.