Як самостійно налаштувати події для онлайн-чату Бітрікс24 через Google Tag Manager
Використання онлайн-чату – відмінний спосіб збільшити кількість звернень клієнтів на сторінках сайту. Користувач може просто написати повідомлення з будь-якої сторінки товару / послуги і дізнатися всі подробиці у менеджера. Багатьом такий спосіб комунікації підходить більше, ніж дзвінки. Тому якщо у вас поки немає на сайті такої функції, можете підключити будь-який чат з онлайн-консультантом і оцінити, наскільки він буде вам корисний для залучення лидов або збільшення продажів.
Сервісів онлайн-чатів багато. Але який ви б не вибрали, буде корисно відстежувати, як часто ним користуються відвідувачі сайту. У цій статті ми розповімо, як налаштувати відстеження звернень в онлайн-чат Бітрікс24 без програмістів.
Даний чат має величезну кількість плюсів і хочеться звернути увагу на те, що його можна використовувати навіть в безкоштовному тарифі «Проект» від Бітрікс. Але є і мінус: за замовчуванням не налаштовані події під час взаємодії з чатом, які приходили б в Google Analytics. Наприклад, в платній версії JivoSite події відправляються в аналітику автоматично.
Тому керуючись цією інструкцією, ви зможете самостійно налаштувати відправку подій онлайн-чату Бітрікс24 і використовувати їх в якості мікроконверсій в Google Analytics. Потрібен тільки доступ до встановленого на сайті Google Tag Manager для здійснення всіх налаштувань і доступ до Google Analytics для встановлення цілей.
За основу був узятий скрипт обробки подій зі статті, який я адаптувала під мету Google Analytics.
Налаштування відстеження подій чату
Для налаштування в Google Tag Manager необхідно створити тег зі скриптом, тег з автоподії для онлайн-чату, тригер з призначеним для користувача подією для відправки автоподії, змінні категорії та дії за подією.
Тепер творемо встановлення контейнера GTM.
- Тег зі скриптом в Google Tag Manager. Цей тег з кодом JS скрипта необхідний, щоб GTM міг миттєво реагувати на дії користувача в чаті і генерувати відповідну для користувача подію на рівні даних ( dataLayer ). Є 2 варіанти скрипта: для всіх взаємодій і вибіркових.
- Обробка всіх подій чату. Цей варіант скрипта для відстеження абсолютно всіх взаємодій з онлайн-чатом. Зробіть в GTM тег типу «Призначений для користувача GTM» з назвою, наприклад, «Скрипт для подій онлайн-чату Bitrix24», і вставте наступний JavaScript -код:12345678910111213141516171819202122232425262728293031<script type="text/javascript">window.addEventListener('onBitrixLiveChat', function(event){var widget = event.detail.widget;widget.subscribe({type: BX.LiveChatWidget.SubscriptionType.every,callback: function(event) {if (typeof(dataLayer) == 'undefined'){dataLayer = [];}dataLayer.push({'event' : 'bx24chatonline', 'eventCategory':'bx24chat','eventAction': event.type});}});});</script>
Встановіть для активації даного тега тригер «Перегляд сторінки» ( All Pages ) і збережіть зміни.Коротке пояснення логіки скрипта: коли відбувається будь-яка взаємодія ( BX.LiveChatWidget.SubscriptionType . every), скрипт відправляє в dataLayer призначену для користувача подію ‘bx24chatonline’. Значення категорії події буде завжди ‘bx24chat’, а дія події буде різною – в залежності від типу взаємодії з чатом.
Перелік взаємодій з чатом Бітрікс24, доступних для відстеження, і дії подій, які будуть передані в dataLayer. Події онлайн-чату Бітрікс24 зі статті.
Назва дії події Тип події configLoaded завантаження інформаціх про «Відкриту лінію» operatorMessage повідомлення оператора widgetClose закриття віджета widgetOpen відкриття віджета sessionStart старт сессії sessionFinish закінчення сессії sessionOperatorChange зміна оператора userFile відправка файла користувачем userForm заповнення формы користувачем userMessage повідомлення користувача userVote голосування користувачем Під час впровадження вищевказаного скрипта в аналітику будуть надходити абсолютно всі події, в тому числі і завантаження «Відкритої лінії». Кожне відкриття і закриття віджета буде враховано як нову окрему подію.
Якщо сайт великий і є ризик перевищення ліміту Google Analytics по хітам, цей скрипт можна модифікувати, щоб в аналітику надходили тільки події з важливих взаємодій з чатом Бітрікс24 (наприклад, початок діалогу, відправка форми, залишена оцінка діалогу.
- Обробка певних подій чату. Уявімо, що вирішено відстежувати тільки такі події: старт сесії (написання першого повідомлення), відправка файлу користувачем, відправка форми контактних даних в чаті, оцінка якості діалогу з менеджером. Тоді необхідно змінити скрипт – додати конструкцію if для порівняння потрібної події з event.type.Готовий код скрипта для тега в GTM для вибіркових подій:
123456789101112131415161718192021222324252627282930313233<script type="text/javascript">window.addEventListener('onBitrixLiveChat', function(event){var widget = event.detail.widget;widget.subscribe({type: BX.LiveChatWidget.SubscriptionType.every,callback: function(event) {if (typeof(dataLayer) == 'undefined'){dataLayer = [];}if (event.type == (BX.LiveChatWidget.SubscriptionType.sessionStart || BX.LiveChatWidget.SubscriptionType.userForm || BX.LiveChatWidget.SubscriptionType.userFile || BX.LiveChatWidget.SubscriptionType.userVote)) {dataLayer.push({'event' : 'bx24chatonline', 'eventCategory':'bx24chat','eventAction': event.type});}}});});</script&>
Його слід розмістити так само, як і скрипт на кроці 1.1.
- Обробка всіх подій чату. Цей варіант скрипта для відстеження абсолютно всіх взаємодій з онлайн-чатом. Зробіть в GTM тег типу «Призначений для користувача GTM» з назвою, наприклад, «Скрипт для подій онлайн-чату Bitrix24», і вставте наступний JavaScript -код:
- Змінні категорії та дії події.
Після налаштування тега скрипта переходьте до створення змінних для передачі категорії і дії з DataLayer в тег автоподії.- Змінна eventCategory. Необхідно створити змінну типу «Мінливий рівень даних» і вказати ім’я змінної рівня даних eventCategory з скрипта.
- Змінна eventCategory. Так само слід створити і зберегти ще одну змінну dataLayer з ім’ям eventAction.
- Змінна eventCategory. Необхідно створити змінну типу «Мінливий рівень даних» і вказати ім’я змінної рівня даних eventCategory з скрипта.
- Тег для передачі подій чату Bitrix24 в Google Analytics. Тег для передачі подій чату Bitrix24 в Google Analytics. Зробивши змінні рівня даних, переходите до налаштування автоподії онлайн-чату в GTM. Подію можна вважати автоматичниою через змінних в якості параметрів налаштувань тега.Тип тега – «Google Аналітика – Universal Analytics», типу відстеження – подія.
Параметри відстеження подій: категорія – змінна {{ eventCategory }}, дія – змінна {{ eventCategory }}, ярлик – змінна {{ Page URL}}.
Параметр «Не взаємодія» рекомендуємо встановити зі значенням True, щоб ці події не вплинули на показник відмов сторінок.
В «Налаштуваннях Google Analytics » вказуйте актуальну для вашого контейнера GTM змінну з ідентифікатором аналітики.
- Тригер для відправки події У якості тригера слід створити для користувача подія рівня даних bx24chatonline, яке зазначено як значення параметра ‘event’ в скрипті (крок 1).
Налаштування цілей в Google Analytics
Після внесення всіх налаштувань обов’язково перевіряйте коректність спрацьовування подій в режимі попереднього перегляду Google Tag Manager. Якщо все вірно і події з’являються в аналітиці в режимі реального часу, можна публікувати всі зміни в контейнері GTM і перейти до установки відповідних цілей в Google Analytics.
Для створення необхідно вибрати тип цілі «подія», задати назву, наприклад, «Чат Бітрікс24 – розпочато діалог». Як категорії вказати bx24chat (категорія буде однаковою для всіх цілей), а в якості дії – назва взаємодії з чатом з таблиці на кроці 1.1, наприклад, sessionStart.
За аналогією налаштовуються і інші цілі для онлайн-чату, відмінності тільки в назві дії події.
Тепер ви зможете відслідковувати в аналітиці мету за зверненнями користувачів в чат Бітрікс24.
Висновки:
У статті я поділилася мануалом по налаштуванню подій безкоштовного онлайн-чату Бітрікс24. Тепер будь-який фахівець може самостійно налаштувати відстеження в Google Analytics звернень користувачів через віджет чату.
- Основа коректної роботи відстеження – впровадження скрипта обробки подій через GTM.
- Перший варіант скрипта (крок 1.1) відстежує абсолютно всі види звернень. Корисний для розуміння взаємодії користувача з чатом.
- Другий варіант (крок 1.2) – для вибіркових подій, коли важливо відстежувати кількість звернень і не відправляти в Google Analytics зайву інформацію.