# Интеграция онлайн-чата на сторонние ресурсы

## Создание виджета

Чтобы создать виджет на сайт, для начала нужно создать открытую линию: В панели управления корпортала, слева перейдите во вкладку "Контакт-Центр".

<p class="callout info">Если вкладки "Контакт-Центр" нет - нажмите на опцию "Ещё", тогда панель управления увеличиться</p>

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

[![image-1699618125284.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618125284.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618125284.png)

После чего во всплывающем окне настройки онлайн-чата Битрикс уже предлагает подключить виджет онлайн-чата - виджет он предоставляет в виде js-скрипта, который вы интегрируете в любой сторонний ресурс.  
В пункте "Настройки канала" можно выбрать уже созданную открытую линию(если мы её создали) или создать её с нуля.

[![image-1699618166088.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618166088.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618166088.png)

## Настройка Открытой Линии

Нажимаем на кнопку "Настроить" или "Создать новую открытую линию". Принципиально важными настройками является "Очередь" и "Автоматические действия".  
На "Очередь" мы назначаем сотрудников, которые будут привязаны к данной открытой линии, настраиваем распределение отправки обращений(либо всем и сразу, либо последовательно, либо равномерно). **Так же важным моментом является то, что клиент, который обратился, может не быть в базе crm, поэтому в этом же пункте настраиваем как будет заполняться его лид** **(либо лид создаётся автоматически, либо вручную - клиент сам заполняет все поля).**

[![image-1699618245342.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618245342.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618245342.png)

<span style="text-decoration: underline;"><span style="color: #000000; text-decoration: underline;">Второстепенные пункты настройки:</span></span>

- <span style="color: #000000;">"Рабочее время" - есть возможность указать праздничные дни, выходные дни, добавить автоматическое сообщение, в случае если открытая линия в текущей момент не работает(скриншот номер 4)</span>
- <span style="color: #000000;">"Соглашение" - Битрикс сам подсказывает какое соглашение нужно поставить в рамках РФ(если ваш онлайн-чат вообще его предполагает)</span>[![image-1699618338384.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618338384.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618338384.png)
- "Автоматические действия" позволяет автоматизировать диалог. В плане приветствия, бездействия клиента, завершения диалога. Так же в этом пункте мы указываем способ сбора данных о клиенте. Мы можем создать новую CRM-форму, которую клиент будет заполнять, как только откроет диалог (правило сбора/показа формы настраиваются в соответствующих опциях) 
    
    [![image-1699618427774.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618427774.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618427774.png)
    
    Касательно автоматизации - есть возможность отправлять сообщения автономно о бездействие, при завершении обращения. 
    
    [![image-1699618468402.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618468402.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618468402.png)
- "Список быстрых ответов". При создании нового списка быстрых ответов и последующего его выбора в открытых линиях, в чате каждого сотрудника на этой линии будут доступны быстрые сообщение, которые мы написали в списке. 
    
    [![image-1699618493390.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618493390.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618493390.png)
    
    [![image-1699618497476.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618497476.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618497476.png)
    
    Так же у списка есть свои права доступа, но по логике если группа людей сидит на линии и отвечает на одни и те же вопросы, то и разграничения доступа к списку быстрых ответов не должно быть.
- "Чат-боты" подключается из модулей, которые есть в bitrix Marketplace
-  "Оценка качества". В нём есть два варианта как клиент может оценить диалог с оператором: один вариант предоставляется для web-сайтов, другой для различных ботов соц.сетей.
- "KPI" задаётся для учёта, как быстро операторы реагируют на обращения.
- "Прочее". Это поле ввода названия линии и отметка статуса активности линии. Остальные опции по усмотрению. Нужен ли alert, если клиент закрывает чат - на усмотрение опять же 
    
    [![image-1699618670288.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699618670288.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699618670288.png)

## Итог

После всех настроек линии и подключения чата у нас будет публичная ссылка на чат в браузере **(не забудьте указать URL!)** и сам скрипт-код.

<p class="callout info">Чтобы протестировать его работу, стоит открыть другой браузер, где мы не логинились в битриксе, как сотрудник</p>

[![image-1699619154908.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699619154908.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699619154908.png)

Заполнили форму - лид сразу падает в crm(уведомление придёт на корп ответственным за линию). Всё взаимодействие оператора с клиентом происходит в чате "Открытых линий" (опция ниже оповещений на корпортале). Операторы могут принимать обращение, закрывать, перенаправлять клиента.

[![image-1699619161403.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699619161403.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699619161403.png)

[![image-1699619173858.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699619173858.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699619173858.png)

[![image-1699619180029.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699619180029.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699619180029.png)

[![image-1699619184192.png](https://howto.stankin.ru/uploads/images/gallery/2023-11/scaled-1680-/image-1699619184192.png)](https://howto.stankin.ru/uploads/images/gallery/2023-11/image-1699619184192.png)