# Онлайн-чат Установив Онлайн-чат на сайт, вы сможете собирать данные о клиентах, автоматизировать общение с ними на сайте или организовать работу отдела продаж, подключая менеджеров к диалогам с клиентами. Вести диалоги с клиентами можно как из интерфейса Salebot на сайте, так и в нашем мобильном приложении для Android и iOS.

## Как создать онлайн-чат Для создания чата перейдите в пункт меню "Каналы" и нажмите на кнопку "Online-chat".

Сразу после клика по кнопке "Online-chat" откроется форма настроек созданного онлайн-чата. Внешний вид чата будет отличаться в зависимости от настроек. В правой панели отображается внешний вид чата, который вы создали, его можно открыть и закрыть. ### Как установить онлайн-чат на сайт Чтобы установить онлайн-чат на сайт, необходимо скопировать скрипт во вкладке код:

Затем вставить данный код в настройках сайта в поле HTML-код head:

{% hint style="info" %} **Вставьте данный код на каждую страницу вашего сайта внутри тега \**. {% endhint %} На этом подключение онлайн-чата к сайту завершено. ## Основные настройки ### Оформление

#### Заголовок чата В этом поле прописывается наименование для онлайн-чата - самое верхнее поле.

#### Подзаголовок чата Это поле находится ниже, чем заголовок чата, и позволяет Вам уточнить роль онлайн-чата на вашем ресурсе.

#### Надпись на кнопке виджета Надпись на кнопке виджета отображается при свернутом состоянии онлайн-чата. По умолчанию отображается текст из полей заголовка и подзаголовка: можно установить другую надпись при необходимости:

Поле "Надпись на кнопке виджета" заполнено

Без заполнения поля "Надпись на кнопке виджета"

#### Приветственное сообщение в чате В этом поле заполняется текст предварительного сообщения от бота:

#### Ориентация текста С помощью панели ориентации текста можно выравнивать заголовок и подзаголовок онлайн-чата относительно правого, левого края или центра по аналогии с любыми текстовыми редакторами типа Word или Googledoc. Ориентация по центру:

Ориентация по левому краю:

#### Кнопка чата Эта кнопка предназначена для открытия онлайн-чата при клике на нее. Можно выбрать, как будет выглядеть кнопка онлайн-чата на разных устройствах: веб-версия сайта и мобильная версия сайта. Возможны несколько вариантов:

Расположить кнопку можно по правому или левому краю:

#### Цветовая палитра Для оформления онлайн-чата по своему вкусу можно применить не только настройки цвета, но и также отобразить интересные узоры на фоне чата и хедера:

Безусловно, можно выбрать цвет и яркость узоров, а также иных элементов онлайн-чата. Для этого активируйте чекбокс "Расширенные настройки:

Также можно установить иные расширенные настройки цветового отображения для онлайн-чата. Например, для хедера можно выбрать градиентную заливку:

#### Аватар онлайн-чата С помощью него можно поменять аватар помощника в онлайн-чате. Аватар может быть добавлен как ссылкой, так и загружен файлом.

Также в случае необходимости, можно не отображать аватар чата с помощью данного чекбокса:

#### Логотип В настройках можно отображать логотип Salebot:

### Настройки

#### **Надпись внутри поля ввода** В этом поле по умолчанию установлен следующий текст - "Введите сообщение и нажмите Enter". Вы можете самостоятельно указать свое значение или оставить по умолчанию.

#### **Надпись в мобильной версии** По умолчанию установлен текст "Выберите удобный способ связи"

#### **Сообщение при назначении клиенту оператора** Если вставить в поле #{operatorName}, то будет показано имя оператора, указанное в разделе Сотрудники. Назначить оператора можно вручную: кликнуть в диалоге с клиентом кнопку "Взять клиента" или "Передать клиента". Или настроить автораспределение клиентов между операторами в разделе Сотрудники.

#### **Сообщение при отсутствии операторов в сети** По умолчанию будет высвечивать следующее сообщение: "На данный момент операторов нет в сети. Оставьте нам сообщение и мы обязательно вам ответим в ближайшее время"

Статус "В сети" бот получает из раздела "Сотрудники". Возможные статусы: В сети, Перерыв, Отсутствует.

Сменить свой статус также можно в верхней строке, находясь в любом разделе проекта. Пример данного сообщения в онлайн-чате:

#### Язык в чате Можно выбрать русский или английский язык для служебных сообщений в чате, которые установлены по умолчанию

Пример сообщений по умолчанию из поля "Сообщение, когда операторов нет в сети" и "Сообщение, когда клиенту назначается оператор при включенном" при включенном английском языке в настройках онлайн-чата :

#### **Звуковые уведомления в чате.** Данные настройки позволяют включить/выключить звуковые уведомления открытия чата и о новых сообщениях в онлайн-чате для клиентов на сайте:

#### **Отображение мессенджеров** Можно выбрать какие мессенджеры будут отображаться на сайте при наведении курсора на виджет (значок) онлайн-чата. {% hint style="warning" %} Кнопки мессенджеров появятся только после того, как эти мессенджеры будут подключены к конструктору. {% endhint %}

#### **Ползунок Отображать только мессенджеры.** Если включить данный переключатель, то на сайте появятся только кнопки мессенджеров. Остальные функции онлайн-чата будут отключены.

Пример отображения кнопок при включенном ползунке **Отображать только мессенджеры**

При неактивном положении "Отображать только мессенджеры" вид онлайн-чата будет таким:

#### **Надпись к мессенджерам** По умолчанию "Написать в"

#### **Начальное сообщение в Whatsapp** Этот текст будет записан в поле ввода у пользователя в приложении Whatsapp при переходе по кнопке с сайта. Ему будет достаточно нажать "Отправить". Так же прописывайте этот текст в условии стартового блока цепочки сообщений.

#### **Свои ссылки** Добавлена возможность, помимо кнопок мессенджеров, выводить свои кнопки с ссылками.

В настройках можно указать url ссылки и добавить изображение:

**Загрузка файлов** Данная настройка даёт возможность получать вложения от клиентов сайта, например, изображения.

{% hint style="warning" %} Ограничения на размер входящего файла через онлайн-чат : 20 МВ {% endhint %} #### **Данные пользователя** В первом сообщении можно получить согласие на обработку персональных данных и/или собрать данные пользователя, используя форму для сбора данных, а также задать или изменить почту через приветственное окно. Заполнение формы можно пропустить или сделать обязательной, включив ползунок *Сделать заполнение формы обязательным.*

Пример первого сообщения со сбором данных:

После настройки формы существует поле с выпадающим списком для выбора отображения настроек страны:

#### Запрос на звонок Чекбокс "Запрос на звонок" отображается в настройках онлайн-чата, если в проекте подключена Телефония.

*Принцип работы:* При заполнении формы пользователь может поставить галочку на запрос обратного звонка, тогда автоматически будет выбран один из сотрудников, у кого подключена телефония и будет совершен звонок клиенту. {% hint style="info" %} Сотрудник назначается автоматически. При выборе сотрудника проверяется\ \- статус "На смене"\ \- любая роль, в т.ч. администратор\ \- у сотрудника подключена(настроена) телефония После звонка этот сотрудник будет назначен ответственным этому пользователю. {% endhint %} #### **Запрашивать разрешение на обработку персональных данных** Данный параметр по умолчанию отключен. При включенном ползунке при первом запуске онлайн-чата появится сообщение Даю согласие на обработку персональных данных и кнопка **`Подтвердить`**

Пример первого сообщения для получения разрешения на обработку персональных данных:

#### Настройка начальных кнопок

При клике по кнопке ***Добавить кнопку*** откроется форма создания начальной кнопки:

Кнопка может иметь одну из функций: 1. **Ссылка:** позволяет добавить ссылку для перехода на другую страницу сайта или сторонний веб-ресурс.

2. Почта: клиент будет перенаправлен на почтовый сервис, чтобы написать письмо на почту, указанную в настройках кнопки:

3. Телефон: запустится приложение для звонков. Или будет предложено выбрать с помощью какого приложения позвонить. Зависит от устройства, на котором пользователь (клиент) переходит по этой кнопке. Вызов будет на номер, указанный в настройках кнопки

4. Сообщение (от администратора / пользователя) данная функция позволяет делать быстрые ответы от бота при клике на кнопку. \ Например, можно сделать кнопку с названием Адрес, а в поле Сообщение указать точный адрес и время работы офиса.

{% hint style="info" %} Текст в поле "Сообщение" будет без переноса строк. Учитывайте этот момент в работе. {% endhint %} **Обработка клиентов с разных доменов.** Эта настройка позволяет разделить диалоги, если один и тот же человек пишет в онлайн-чат, размещенный на разных доменах. По умолчанию это один и тот же диалог.

Данный переключатель необходим, если разные онлайн-чаты установлены на разных сайтах на одном домене, и нужно разделить диалоги, когда пишет один и тот же человек > Например: > > ; > > **Кнопки в тексте будут отображаться в истории онлайн чата (Переключатель).** Включите его, чтобы кнопки в тексте из конструктора воронок отображались в истории онлайн -чата с клиентом

#### **Скрыть онлайн-чат** Необязательно удалять онлайн чат с сайта. Емо можно просто скрыть с помощью соответствующего переключателя:

### Автоматические действия Принцип работы автоматических действий следующий: для того чтобы автоматическое действие сработало, необходимо установить определенный триггер для данного действия - условие.

Сначала устанавливаем условия, в какой момент должно выполниться настраиваемое действие. Можно добавлять условия в зависимости от времени дня, страны посетителя, города, URL текущей страницы и т.п. Подробнее об условиях: 1. **Время дня**. Выставьте автоматическое срабатывание онлайн-чата в зависимости от того, в какой промежуток клиент взаимодействует с онлайн-чатом (например, в счастливые часы после 16:00 при посещении вашего лендинга клиент может получить скидку).

Пример условия (время дня) и автоматического действия (сообщение от им. администратора)

2. **Выполнить это действие только один раз за день для пользователя.** Данное условие может быть применено в различных случаях: например, для направления партнерских или иных ссылок в сообщении от имени администратора/пользователя (как доступ к новым материалам курса); для накопительной системы и т.п.:

3. **Город посетителя. Страна посетителя.** Выставив данное условие, можно установить необходимый круг пользователей, которым бы была полезна ваша предоставляемая услуга, если, например, необходимо для покупки товара (услуги) личное присутствие клиента.

В данном случае можно установить соответствие как равно, так и не равно. Например, если вам необходимо установить город или страну (или список стран), для которых автоматическое действие воспроизводиться не будет, поставьте не равно. 4. **День недели.** Данное условие является триггером для автоматических действий, исходя из дня недели. Здесь также можно установить чекбоксы (галочки) напротив дней недели, выставить соответствие равно/не равно и выбрать выполняемое онлайн-чатом автоматическое действие. Например, можно установить все рабочие дни недели ваших операторов/менеджеров для последующей их связи с клиентами. 5. **URL текущей страницы**. Автоматическое действие будет срабатывать в зависимости от того, содержится/не содержится или равно/не равно URL ссылки.

Пример, как отключить онлайн-чат на некоторых страницах сайта

5. **Сообщение пользователя**. Чтобы автоматическое действие сработало с таким условием, необходимо в поле вставить определенное слово от пользователя:

7. **Время на странице**. Данное условие схоже с временем дня, однако, например, если ваша клиентская база находится в разных часовых поясах и есть необходимость выполнения автоматического действия только в одно и то же время у каждого часового пояса, можно воспользоваться этим условием. 8. **Время от закрытия окна Salebot**. Такое условие выставляется аналогично времени дня или времени на странице, однако зависит от действия самого пользователя по закрытию соответственно окна Salebot. 9. **Время от первого сообщения посетителя.** Автоматическое действие сработает спустя определенный промежуток времени (в секундах), после того как ваш клиент написал какое-либо сообщение в онлайн-чат. 10. **Время без ответа оператора с первого сообщения пользователя.** Данное условие также выставляется в секундах и выполняется соответственно вне зависимости от того, ответил клиенту оператор или нет. При необходимости условия можно сочетать друг с другом и выставлять срабатывание автоматического действия исходя из нескольких условий:

Исходя из примера выше, автоматическое действие выполнится только для клиентов из Москвы после 16:00 часов в понедельник, вторник и среду. Далее выбираем какое действие для онлайн-чата должно выполниться автоматически:

1. **Автоматическое открытие чата**. Данное действие соответственно откроет онлайн-чат для пользователя. Для данного действия не требуется дополнительных настроек. 2. **Автоматическое приглашение к диалогу**. Такое автоматическое действие направит пользователю любое прописанное в поле сообщение:

Также при необходимости можно скрыть поле ввода сообщения с помощью одноименного чекбокса:

3. **Скрыть ярлык онлайн-чата с сайта**. Данное действие можно применить, например, по истечении рабочих часов ваших администраторов. 4. **Показать ярлык онлайн-чата**. Аналогично предыдущему действию, можно показать ярлык онлайн-чата для клиентов в определенный промежуток времени (или по иным другим необходимым условиям). 5. **Отправить сообщение от имени администратора**. Данное действие направит соответственно сообщение в онлайн-чате от имени администратора.

6. **Отправить форму**. Данное действие служит для сбора данных (информации) клиента, где вы можете заполнить текст формы, выбрать необходимые поля сбора данных (имя, номер телефона, email, чекбокс или иное поле ввода, которое можно настроить самостоятельно).

Иное поле ввода можно настроить, например, для сбора города проживания или для другой информации:

### Отправление формы для заполнения клиентами В онлайн-чат также представлена функция отправления формы клиентам для сбора информации о пользователе, добавления его в систему для дальнейшей работы с ним:

Такая форма отправляется с помощью функции **online\_chat\_send\_form(),** где передаются параметры: 1. **name;** 2. **phone;** 3. **privacy;** 4. **callback (**данный параметр работает только в случаях, если есть телефония в проекте); 5. age; 6. email\_group\_ID (если добавить этот параметр с имейлом, то будет создан email клиента и привязан к клиенту чата); 7. wa\_group\_ID (если добавить этот параметр с телефоном, то создаст ватсап клиента и привяжет к клиенту чата) *Если указать несуществующую группу, то просто отправит форму, но клиента не создаст.* {% hint style="danger" %} Важно! Все параметры записываются одной строкой через запятую! *Пример записи в Калькуляторе:* online\_chat\_send\_form("name,email,email\_group\_ID") {% endhint %}

уведомление, которое придет в диалог после заполнения формы

{% hint style="info" %} В карточке онлайн-клиента из отправленной формы **значения сохраняются в переменных клиента** (см. ниже) {% endhint %}

#### ! online\_chat\_send\_form(arguments, texts) Принимает два обязательных аргумента arguments - строка параметров texts - имя формы Например, в калькуляторе можно ввести таким образом: **online\_chat\_send\_form("name,phone", "Привет, Заполни форму")**

Пример ответа Онлайн-чата:

### Баннеры

В настройках виджета онлайн-чата во вкладке "Баннеры" можно добавить кликабельные изображения в стартовое окно онлайн-чата. Перейдем к настройкам. Нажмите на "Добавить баннер":

И загрузите изображение:

{% hint style="warning" %} Размер изображения фиксированный. Рекомендуемый формат изображения: 1. Если прописываете заголовок и подзаголовок, то размер баннера — 345x194 или 16/9. {% endhint %} Чтобы баннер был кликабельным (то есть ваш клиент мог переходить по ссылке при клике на баннер), укажите ссылку в соответствующем поле:

При необходимости пропишите заголовок и подзаголовок, а затем нажмите "Сохранить":

После чего баннер отобразится в виджете онлайн-чата:

### Оценка качества

Теперь в онлайн-чате существует еще один раздел настройки - Оценка качества. Чтобы добавить такой функционал, перейдите в соответствующую вкладку в настройках:

На выбор в функционале присутствует пятибалльная, трехбалльная и двухбалльная шкала оценивания качества работы:

В поле с соответствующим названием вводится текст перед самой оценкой:

В этом поле нет значения по умолчанию, если его пропустить, то в плашке с оценкой качества будет виден такой текст:

Также можно самостоятельно обозначить название поля для отзыва клиентом:

Для этого достаточно прописать свой текст в названии поля, а также подсказку внутри поля (текст в поле для отзыва). По умолчанию (см. пример выше) назначение и текст каждого поля уже указаны для вашего удобства. Можно активировать чекбокс с обязательным текстом отзыва клиента об оценке:

Далее можно заполнить сообщение обратной связи клиенту при положительном или отрицательном отзыве. Чтобы проверить, как выглядит последнее сообщение онлайн-чата после отправки оценки, нажмите на кнопку в чате для отправки оценки:

#### Чекбокс "Пользователь может оценивать диалог"

В разделе "Клиенты" в диалоге с пользователем сам оператор может завершить диалог с клиентом и в тех случаях, если данный чекбокс активирован, то пользователь сможет поставить оценку. {% hint style="success" %} Сам оператор не видит оценку, которую клиент ему поставил за диалог. Все оценки качества работы будут видны в разделе "Аналитика". {% endhint %} В диалоге с пользователем сам оператор может нажать на кнопку "Завершить диалог". Тогда откроется форма с подтверждением действия оператора:

При этом если подключен в каналах почтовик, то появляются варианты отправить сообщения на почту:

После того, как оператор завершил диалог, пользователю направляется форма оценки качества, где сама оценка приходит в Аналитику. В случае, если клиент не оставил оценку, то в статистике отобразится "Пользователь не оставил оценку". ## Видео-инструкция {% embed url="" %}