Как вставить виджет UIS в свой элемент сайта (JS API)

Виджеты UIS можно открывать по клику на любой элемент сайта. Для этого можно использовать два решения на выбор:

• прописать код элемента в настройках виджета UIS;
• вызывать виджет с помощью команды JS API.

Первый способ быстрее, а второй — надежнее, потому что при изменении элементов на сайте вам не придется менять настройки в Личном кабинете UIS. Мы опишем оба способа, а вы можете выбрать удобный для себя.

В обоих случаях вам понадобится доступ к коду сайта и в Личный кабинет UIS.

Откройте сайт, кликните правой кнопкой на нужный элемент и нажмите «Просмотреть код»:

Кликните правой кнопкой по выделенному элементу и нажмите «Copy ⟶ Copy selector»:

В Личном кабинете UIS подключите и настройте нужный виджет, а затем выберите «Клик на элементе» в настройке «Событие»:

Вставьте код, который скопировали на сайте, и сохраните.

Готово! Теперь по клику на элемент будет открываться виджет UIS.

В Личном кабинете UIS подключите и настройте нужный виджет, а затем скопируйте его ID из настроек:

В код элемента на сайте вставьте команду JS API для открытия виджета, вместо «ID» в скобках укажите тот ID, который скопировали в Личном кабинете UIS.

Пример кода элемента после вставки команды для вызова виджета:

Если нужно, чтобы виджет открывался только по клику на настроенный элемент, то в настройках виджета выберите «JS API» в поле «Событие»:

Если при этом вы используете в виджете кнопку для заказа обратного звонка, обязательно создайте сценарий для обработки звонка и включите в нем настройку «Использовать сценарий в JS API», иначе обратный звонок работать не будет.

Если нужно, чтобы виджет открывался и по клику на элемент, и в соответствии с логикой, настроенной в ЛК UIS, задайте эту логику в настройках виджета:

В Личном кабинете UIS добавьте адрес сайта в настройки и установите код счетчика UIS в код сайта.

Подключите и настройте нужный канал: Telegram, WhatsApp или VK Groups. В настройках канала включите «Использовать в виджете на сайте», выберите нужный сайт и сохраните:

Обязательно добавьте набор виджетов в разделе Виджеты на сайте ⟶ Виджеты:

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

В код элемента на сайте вставьте команду JS API для перехода в мессенджеры:

Для канала Telegram bot:

В скобках укажите имя бота, пример: onclick="Comagic.omni.forwardTelegram('leadgen3000_bot')".

Для канала Telegram, когда у юзера есть никнейм:

В скобках укажите никнейм без @, пример: onclick="Comagic.omni.forwardTelegram('romashka_shop')".

Для канала Telegram, когда у юзера нет никнейма:

В скобках укажите номер телефона, пример: onclick="Comagic.omni.forwardTelegram('79999999999')".

Для канала WhatsApp:

Если с разных кнопок на сайте нужно вести посетителей в разные каналы WhatsApp, то укажите в скобках номер телефона, пример: onclick="Comagic.omni.forwardWhatsApp('79999999999')".

Для канала VK Groups:

Если с разных кнопок на сайте нужно вести посетителей в разные группы VK, то укажите в скобках ссылку на группу, пример: onclick="Comagic.omni.forwardVkontakteGroup('https://vk.me/example1322')".

Если хотите, чтобы переход в каналы работал не только по клику на элементы, но и через стандартные кнопки UIS, настройте и включите виджеты с типом «Кнопка для сайта».