Налаштування онлайн-чату Бітрікс24: інтеграція з сайтом та CRM

Нещодавно до нас звернувся інтернет-магазин електроніки: чат не відображався на мобільних, ліди не створювалися. З'ясували: CSP-політика блокувала скрипт, а ідентифікація не працювала через видалення cookie. Вирішили за 2 години. Підключення онлайн-чату на сайт через Бітрікс24 — це не просто вставка коду, а налаштування ідентифікації, інтеграція з CRM та забезпечення стабільної роботи. Онлайн-чат Бітрікс24 — віджет, який встановлюється на будь-який сайт і направляє повідомлення відвідувачів у відкриті лінії Бітрікс24. Працює незалежно від платформи: WordPress, 1С-Бітрікс, самописний — достатньо вставити JS-код. Ми підключаємо чат під ключ: від налаштування віджета до інтеграції з CRM та фіскалізації за 54-ФЗ. Досвід команди — понад 7 років роботи з Бітрікс. Зв'яжіться з нами для безкоштовної оцінки проекту.

Як технічно працює онлайн-чат?

Відвідувач клікає на віджет → відкривається вікно діалогу → повідомлення через WebSocket потрапляє у відкриту лінію → оператор відповідає → відповідь миттєво відображається на сайті. Дані сесії зберігаються в LocalStorage та на сервері Бітрікс24. Для роботи потрібен PHP 8.1+ та MySQL 5.7+. Віджет завантажується асинхронно, тому не впливає на швидкість завантаження сторінки. При цьому підтримується до 1000 одночасних діалогів на один портал. Згідно з офіційною документацією Бітрікс24, віджет підтримує кастомні події для розширеної логіки.

Як отримати код віджета?

Бітрікс24 → CRM → Контакт-центр → Онлайн-чат → «Створити» → налаштувати зовнішній вигляд → скопіювати код вставки. Приклад коду:

<script>
(function(w,d,u){
  var s=d.createElement('script');
  s.async=true;
  s.src=u+'?'+(Date.now()/60000|0);
  var h=d.getElementsByTagName('script')[0];
  h.parentNode.insertBefore(s,h);
})(window,document,'https://yourcompany.bitrix24.ru/upload/crm/site_button/loader_X_XXXXXXXX.js');
</script>

Вставляйте перед </body> на кожній сторінці. Для WordPress використовуйте хук wp_footer або плагін Insert Headers and Footers. Для 1С-Бітрікс — в footer.php шаблону або через компонент HTML-блок.

Як прив'язати чат до CRM?

При налаштуванні вкажіть відкриту лінію (продажі або підтримка), автостворення ліда при першому повідомленні, джерело «Сайт» (поле SOURCE_ID), форму збору даних — ім'я, телефон, email. Конверсія в заявку зростає на 30%. Для повторних відвідувачів використовується cookie BITRIX_SM_SALE_UID — історія чату відновлюється. Якщо необхідно, налаштовуються бізнес-процеси: при створенні ліда автоматично надсилається повідомлення менеджеру або запускається ланцюжок дій через Bizproc.

Технічні складності та їх вирішення

Порівняння: готовий віджет vs кастомна розробка

Готовий віджет налаштовується в 3 рази швидше, ніж кастомне рішення. Для інтернет-магазину електроніки реалізували проект з 30 операторами, 12 000 діалогів на місяць, інтеграцією з 1С УТ та АТОЛ — час відповіді скоротився на 40%. Середня економія на обробці заявок після впровадження — до 40%.

Що входить в роботу?

• Аналітика поточного сайту (платформа, кешування, CSP).
• Установка віджета на всі сторінки з перевіркою сумісності.
• Налаштування відкритих ліній, автостворення лідів, форма збору даних.
• Інтеграція з CRM: прив'язка до угод, синхронізація контактів.
• Фіскалізація (54-ФЗ) при необхідності — через АТОЛ Онлайн або ОФД.
• Тестування на мобільних та десктопі.
• Передача доступів та коротка інструкція по роботі.
• Гарантія 2 роки на установку.

Як ми це робимо: процес роботи

1. Аналітика — вивчаємо сайт, CSP, стек, кешування.
2. Проектування — обираємо тип віджета, визначаємо поля CRM.
3. Реалізація — вставка коду, налаштування ботів, інтеграція з 1С/ОФД.
4. Тестування — перевіряємо WebSocket, створення лідів, відображення на мобільних.
5. Деплой — публікуємо на бой, моніторимо 24 години.

Терміни та вартість

Терміни — від 2 годин до 3 днів залежно від складності. Вартість розраховується індивідуально після аудиту. Замовте оцінку проекту — вона безкоштовна.

Що перевірити перед запуском

• Вставка коду — використовуйте async або вставляйте перед </body>.
• CSP-політика — додайте *.bitrix24.ru в script-src та connect-src.
• Ідентифікація — налаштуйте cookie BITRIX_SM_SALE_UID.
• Мобільні пристрої — тестуйте на реальних пристроях.

Замовте підключення чату — оцінимо проект за 1 день безкоштовно. Зв'яжіться з нами, щоб обговорити деталі. Чат Бітрікс24 — це не лише зручність для клієнтів, але й зростання конверсії в заявки. Отримайте консультацію прямо зараз.

Як відкриті лінії змінюють комунікацію?

Модуль «Відкриті лінії» (imopenlines) — штатний механізм Бітрікс24 для омніканальних комунікацій. Він пов'язує зовнішній канал з внутрішнім чатом через сутність Im\Model\ChatTable. Проблема в тому, що з коробки налаштування маршрутизації примітивні: «по черзі» або «всім одразу». Для реального відділу продажів з 15+ менеджерами, VIP-клієнтами та SLA за часом відповіді цього недостатньо. Ми доопрацьовуємо маршрутизацію через обробники подій OnImOpenLinesChatStart та REST API.

Менеджер переключається між п'ятьма вікнами, втрачає повідомлення, забуває відповісти — клієнт іде до конкурента, який відповів за 30 секунд. Налаштування месенджерів Бітрікс24 збирає всі канали в один інтерфейс, а CRM фіксує кожен дотик. Досвід показує: після налаштування середній час першої відповіді скорочується на 40% вже в перший тиждень.

Як ми реалізуємо інтеграцію месенджерів

Підключаємо Telegram, WhatsApp, Viber, VK, онлайн-чат, Email та інші канали через штатні конектори або REST API. Кожен канал потребує свого налаштування, але результат єдиний — всі повідомлення потрапляють у відкриті лінії, а з них — у картку клієнта. Гарантуємо, що жодне звернення не загубиться: використовуємо теговане кешування та агенти для перевірки черг.

Як підключити WhatsApp до Бітрікс24?

WhatsApp — головний бізнес-канал. Інтеграція через WhatsApp Business API з верифікованим акаунтом. Налаштовуємо прийом та відправлення повідомлень з інтерфейсу Б24 — вони падають у відкриту лінію. Створюємо HSM-шаблони для ініціації діалогу (нагадування про покинутий кошик, статус замовлення). Шаблони проходять модерацію Meta — закладайте 2-3 дні. Забезпечуємо передачу файлів, зображень, документів. Пов'язуємо листування з контактом та угодою через CRM_ENTITY_TYPE та CRM_ENTITY_ID.

Telegram: безкоштовний канал з високим охопленням

Telegram Bot API безкоштовний і добре документований — приємна рідкість серед месенджерів. Інтеграція в Бітрікс24 виконується через конектор imopenlines. Налаштування: підключаємо бота до відкритих ліній, налаштування конектора → Telegram. Прийом повідомлень, фото, відео, документів — все маппиться в чат Б24. Inline-кнопки та reply-клавіатури для навігації. Webhook для реєстрації конектора. Інтеграція з CRM: вхідне повідомлення створює лід через crm.lead.add або активність в угоді.

Telegram незамінний для:

• Підтримки через бота — типові питання закриваються без оператора (до 70% звернень).
• Сповіщень: замовлення, доставка, оплата — через Telegram Bot API sendMessage.
• Збору лідів: бот задає кваліфікуючі питання → створює лід.

Viber та VK: аудиторія 35+ та соцмережа

Viber тримає позиції в регіонах. Підключаємо бізнес-акаунт через конектор відкритих ліній. Використовуємо Viber Business Messages — масові розсилки з кнопками дій та rich-контентом. Прийом та відправлення з CRM працюють одразу.

VK (ВКонтакті) — найбільша соцмережа. Інтеграція через конектор imopenlines повідомлень спільноти. Обробка повідомлень та коментарів з єдиного інтерфейсу. Автостворення ліда — обробник OnImOpenLinesCrmCreate. Інтеграція з VK Рекламою для трекінгу джерел через UTM. Бот для авто-відповідей — VK Bot API + Callback API.

Чому важлива правильна маршрутизація звернень?

Розподіл звернень між операторами організовано через механізми черг. За замовчуванням — «хто вільний». У реальності потрібно складніше:

• Визначення відповідального за номером або email з CRM — im.chat.get + пошук по crm.contact.list.
• Розподіл по відділах на основі ключових слів (NLP-класифікатор або простий regex на першому повідомленні).
• Пріоритетна черга для VIP — по сегменту в CRM.
• Ескалація при таймауті 5 хвилин — автопереключення на наступного.
• Перехід на дзвінок прямо з чату — telephony.externalcall.register.

Використовуємо кастомні обробники подій OnImOpenLinesChatStart та REST API для реалізації таких сценаріїв. Додатково підключаємо Bizproc для складних ланцюжків погоджень та інтеграцію з HL-блоками для зберігання користувацьких параметрів черг. Результат: клієнт не чекає, оператор не перевантажений.

Що входить у роботу з інтеграції месенджерів

Чат-боти: сценарні та з NLP

Типи

Сценарні (rule-based): кнопкове меню, дерево рішень. «Як оплатити» → «Де моє замовлення» → «Години роботи». Передача на оператора при intent == 'unknown' → transfer_to_queue. Надійно, передбачувано, покриває 60-70% типових звернень.

З NLP: вільний текст на українській або російській. Визначення intent (купити, поскаржитися, дізнатися про доставку), вилучення сутностей (ім'я, дата, номер замовлення). Контекстний діалог — пам'ятає, про що говорили. Реалізуємо на Rasa або Dialogflow, інтеграція з Б24 через REST.

use Bitrix\Main\Loader;
use Bitrix\Imopenlines\Model\SessionTable;

Loader::includeModule('imopenlines');

$eventManager = \Bitrix\Main\EventManager::getInstance();
$eventManager->addEventHandler('imopenlines', 'OnImOpenLinesMessageReceive', function($event) {
    $message = $event->getParameter('message');
    $chatId = $event->getParameter('chatId');
    
    if (preg_match('/статус заказа (\d+)/i', $message, $matches)) {
        $orderId = $matches[1];
        // Отримуємо статус замовлення через API
        $order = \Bitrix\Sale\Order::load($orderId);
        if ($order) {
            $status = $order->getField('STATUS_ID');
            \Bitrix\ImOpenLines\Chat::sendMessage($chatId, 'Ваш заказ №' . $orderId . ' в статусе: ' . $status);
        }
    }
});

Сценарії та реальний ефект

Порівняння: сценарний бот обробляє запити в 5 разів швидше оператора, а NLP-бот знижує fallback rate до 15% після навчання на реальних діалогах. Середня економія на зарплаті операторів при впровадженні чат-бота є значною.

Процес розробки

1. Аналіз звернень — вивантажуємо історію з відкритих ліній, кластеризуємо за темами. Визначаємо 80% типових запитів.
2. Проектування діалогів — карта на miro/figma. Кожна гілка закінчується або відповіддю, або передачею оператору.
3. Розробка — логіка, інтеграція з CRM та зовнішніми API. Для сценарних — кінцевий автомат на станах. Для NLP — pipeline: tokenizer → featurizer → classifier → response selector.
4. Навчання NLP — на реальних діалогах (не менше 500 прикладів). Налаштування threshold confidence.
5. Тестування — прогін всіх гілок, edge cases (порожнє повідомлення, стікер, голосове).
6. Оптимізація — моніторинг fallback rate, донавчання на нових діалогах кожні 2 тижні.

Терміни

Результат — всі звернення в єдиному вікні, рутина автоматизована, жодне повідомлення не губиться. Менеджери продають, а не шукають потрібний чат. Оцініть, які канали потрібні саме вам, — напишіть, підберемо під вашу нішу. Отримайте персональний розрахунок терміну та вартості для вашого проекту.