При использовании виджета чата Битрикс24 требуется отслеживать его использование в системе аналитики Яндекс.Метрика, что будет разобрано в инструкции ниже.
Подготовка счетчика Яндекс.Метрики для отслеживания чата Битрикс24
Пример установленного виджета онлайн-консультанта Битрикс24
Создание цели
В первую очередь потребуется перейти в интерфейсе системы аналитики Метрики во вкладке «Настройки»-«Цели» и кликнуть на кнопку «Добавить цель».
Теперь выбираем тип «JavaScript-событие» и вводим «Название» и «Идентификатор цели». Например:
- Название: Написали в чат Bitrix24
- Идентификатор цели: chatbitrix
Далее проверяем результат где можно будет увидеть ID конверсии (в примере это 104612323).
Включение электронной коммерции
Работать способ будет при включенном сборе данных через DataLayer, а сделать это можно в настройках счетчика, переключив тумблер у пункта «Электронная коммерция».
Теперь копируем код счетчика и меняем на сайте. Если это код счетчика был внедрен напрямую, то можно поменять нужный файл через ftp.
Когда использовался Google Tag Manager потребуется перейти в нужный тег.
Меняем код так, чтобы в нем была строка ecommerce:”dataLayer” и сохраняем тег.
Публикуем новую версию.
Доработка кода чата Bitrix24 для отслеживания в Yandex Metrika
Передавать конверсию можно при помощи дополнительного кода:
<script type=”text/javascript”>
window.addEventListener(‘onBitrixLiveChat’, function(event)
{
var widget = event.detail.widget;
// Обработка событий
widget.subscribe({
type: BX.LiveChatWidget.SubscriptionType.userMessage,
callback: function(data) {
// любая команда
if (typeof(dataLayer) == ‘undefined’)
{
dataLayer = [];
}
dataLayer.push({
“ecommerce”: {
“purchase”: {
“actionField”: {
“id” : “indentificator”,
“goal_id” : “IDceli”
},
“products”: [ {} ]
}
}
});
}
});
});
</script>
В этом случае:
- Indentificator — это идентификатор цели (в примере это chatbitrix);
- IDceli — это ID конверсии (из примера 104612323).
Далее необходимо добавить этот код под счетчиком метрики.
Для тех, кто установил Google Tag Manager потребуется создать новый тег.
Даем ему название и выбираем его конфигурацию.
В качестве типа выбираем «Пользовательский HTML».
После добавляем триггер.
Выбираем «All pages».
Сохраняем тег и публикуем новую версию.
Тестирование и проверка результата
После этого необходимо дождаться выполнения события, соответственно написания в чат.
Далее переходим в отчет конверсии.
Здесь можно будет увидеть все диалоги через виджет чата Битрикс24.
Дополнительно можно будет использовать эти данные при просмотре отчета по источникам трафика.
Или же создавать по нему сегмент.
Доработка кода
Данный код является переработкой уже имеющегося материала:
Где использовался каркас в виде:
<script type=”text/javascript”>
window.addEventListener(‘onBitrixLiveChat’, function(event)
{
var widget = event.detail.widget;
// 1. Установка внешней авторизации пользователя
…
// 2. Установка дополнительных данных
…
// 3. Обработка событий
…
});
</script>
Скачать код можно здесь:
А в виде методов при работе с виджетом:
| Метод | Описание |
| widget.open() | открытие |
| widget.close() | закрытие |
| widget.subscribe() | подписка на событие |
| widget.setUserRegisterData() | Авторизация |
| widget.setCustomData() | установка дополнительных данных |
При желании можно доработать код (или использовать уже готовые примеры, как например, для Google Analytics) для того, чтобы передавать и иные типы событий.
Подписывайтесь на наш канал в Яндекс.Дзен
Подписывайтесь на наш Telegram-канал
Подписывайтесь на наш Youtube-канал
Подписывайтесь на нашу группу ВКонтакте