> For the complete documentation index, see [llms.txt](https://premium.gitbook.io/main/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://premium.gitbook.io/main/osnovnye-nastroiki/onlain-chat-chatonio.md).

# Онлайн-чат Chatonio

[Chatonio](https://chatonio.com/) - сервис поддержки клиентов с веб-чатом и возможностью использования ИИ для обработки обращений. В Premium Exchanger доступен отдельный модуль для подключения виджета Chatonio к сайту.

После подключения виджет отображается на страницах обменника. Основные параметры самого чата - внешний вид, приветствие, положение кнопки, база знаний, работа операторов и другие настройки  задаются в личном кабинете Chatonio. Premium Exchanger отвечает непосредственно за подключение виджета к сайту

### 1. Создание проекта и веб-чата в Chatonio

1. Перейдите на сайт[ chatonio.com](https://chatonio.com/) и зарегистрируйтесь, либо войдите в существующий аккаунт.
2. В панели Chatonio создайте проект для вашего обменника.
3. В проекте создайте канал типа Web Chat.
4. В настройках канала,укажите домен обменника в разделе “URL и домены”

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FXixZ8JnvDKVQnGf5YQPZ%2Funknown.png?alt=media&amp;token=71401095-c2d2-41fa-af7e-9c1c88bd52d4" alt="" height="189" width="602">

Домен необходимо указывать вместе со схемой сайта, например <https://site.com>.

После сохранения настроек получение доступа с нового домена может занять некоторое время.

<br>

### 2. Активация модуля Chatonio в Premium Exchanger

Активируйте модуль в разделе:

Модули → Модули<br>

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FufijXuERvO0XK2WqyiHK%2Funknown.png?alt=media&amp;token=fdbee0c3-f3c6-46bf-97f4-c91fb40a9c09" alt="" height="189" width="602">

\
Если вы не видите модуль Chatonio в списке доступных, [потребуется обновить Premium Exchanger до последней версии](https://premium.gitbook.io/main/osnovnye-nastroiki/faq/obnovlenie-failov-skripta-na-servere/kak-obnovit-faily-na-servere#faily-skripta).<br>

### 3. Получение Chatonio Channel ID

Откройте настройки созданного веб-чата в личном кабинете Chatonio, в разделе "Виджет веб-чата" выберите вкладку "Только ID" и полностью скопируйте содержимое поля “ID канала”.<br>

<figure><img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FFx2GrPXX9JG6bqZZxlhi%2Fimage.png?alt=media&amp;token=5ab16027-1916-43ee-a399-ce84f374621c" alt=""><figcaption></figcaption></figure>

### 4. Подключение Chatonio в Premium Exchanger

После активации модуля перейдите в панели управления обменником:

Настройки → Основные настройки

Найдите поле Chatonio Channel ID и вставьте в него скопированный ранее ID канала.&#x20;

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FnC6n4YjXXQx6ELbhGMKX%2Funknown.png?alt=media&amp;token=5020dbd5-93f9-4b47-9252-b3ba7c95c6d2" alt="" height="285" width="602">

Сохраните изменения.

{% hint style="info" %}
Поле Chatonio Channel ID является мультиязычным, однако при использовании одного канала для всего сайта достаточно указать идентификатор в одном из языков. Он будет использоваться на всех языковых версиях сайта. \
\
Указывать отдельные Channel ID для разных языков имеет смысл, если обращения должны поступать в разные каналы Chatonio, например разным операторам.&#x20;

Если поле Chatonio Channel ID оставить пустым, виджет Chatonio на сайте выводиться не будет
{% endhint %}

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

### 5. Настройка внешнего вида и поведения виджета

Внешний вид и поведение веб-чата настраиваются непосредственно в личном кабинете Chatonio. В частности, там можно настроить:

* оформление и цветовую схему
* положение кнопки чата
* приветствие
* работу операторов и ИИ
* базу знаний
* видимость виджета на отдельных URL

{% hint style="info" %}
Если на сайте уже используется другой чат, например Jivo, рекомендуем отключить его после подключения Chatonio. В противном случае на сайте одновременно будут отображаться кнопки обоих сервисов.
{% endhint %}

### Дополнительные настройки

#### Светлая и тёмная тема

Если на сайте используется переключение между светлой и тёмной темой, настройте соответствующую цветовую схему виджета в Chatonio.

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FNKsClLluuycXjKV79nvW%2Funknown.png?alt=media&amp;token=4f301a7f-1c20-4b77-bf04-e8e5e03fcbcd" alt="" height="747" width="602">

<br>

#### Расположение кнопки

По умолчанию кнопка чата может располагаться в нижнем правом углу страницы. Если в этой области уже находятся другие элементы сайта, измените положение кнопки или задайте необходимые отступы в настройках Chatonio.

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FkLt35ToB6gRnYzqgv3Af%2Funknown.png?alt=media&amp;token=c7eb907e-bfae-490f-9321-8461a597250b" alt="" height="868" width="602">

#### Скрытие чата на отдельных страницах

Для управления отображением виджета на отдельных страницах используйте настройки видимости по URL в настройках канала, раздел “URL и домены”.

<img src="https://2574066779-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm9kqZXsNykrN6VyxxXBO%2Fuploads%2FVI3K11gfRROAl1iS2fqb%2Funknown.png?alt=media&amp;token=7ec7888a-529d-42ee-b6c4-a56df08679df" alt="" height="356" width="602">

Настраивать отдельное исключение в панели Premium Exchanger для этого не требуется.

\
\
\ <br>