Настройка JivoSite для Google Analytics 4

Два простых, но эффективных способа отслеживания событий онлайн-чата JivoSite в Google Analytics 4 с помощью Google Tag Manager, JivoSite API и функции сбора событий Universal Analytics.

Обновление: я выпустил электронное руководство по Google Analytics 4. Бесплатно скачать его можно в формате .PDF по ссылке.

Практически у каждого сервиса, который давно присутствует на рынке и имеет большую активную аудиторию, есть официальная документация. В ней подробно описываются принципы его работы, а также даются исчерпывающие рекомендации по настройкам и различным отслеживаниям. У некоторых платформ даже есть собственные API, благодаря которым разработчики могут очень гибко управлять интеграциями.

К таким сервисам можно отнести и JivoSite, у которого в базе знаний есть материал по настройке событий и конверсий Jivo в Universal Analytics (GA3) и Яндекс Метрике. Он автоматически отправляет события в ваши счетчики аналитики только на платной версии. Поэтому если не вы видите данных в Яндекс.Метрике и Universal Analytics, скорее всего, вы используете бесплатный тариф.

На момент написания этой статьи JivoSite еще не выпустил мануал по настройке их событий в Google Analytics 4. Но это вовсе не значит, что мы не можем настроить события онлайн-чата для нового счетчика Google Analytics.

JivoSite API

Напротив, мы как раз можем использовать Jivo API и фиксировать нужные нам команды с помощью кодов и Google Tag Manager, а затем отправлять эту информацию в Google Analytics 4.

Jivo вызывает различные функции на странице, чтобы сообщить о возникновении того или иного события. Вы можете объявить на странице любую из нижеперечисленных функций и выполнять в ней логику обработки возникшего события. Например, с помощью события jivo_onMessageSent вы можете передать в Google Analytics 4 факт отправки пользователем первого сообщения в чат.

Callback-функции JivoSite:

• jivo_onLoadCallback - событие вызывается при завершении инициализации виджета Jivo;
• jivo_onOpen - событие вызывается при открытии окна диалога Jivo;
• jivo_onMessageSent - событие вызывается когда посетитель отправил первое сообщение в чат;
• jivo_onAccept - событие срабатывает, когда оператор нажал кнопку Ответить в уведомлении о новом чате или принял диалог в интерфейсе сервиса;

• jivo_onClose - событие срабатывает, когда происходит сворачивание окна диалога Jivo (нажатие на крестик онлайн-чата);
• jivo_onIntroduction - событие активируется, когда посетитель ввел контактные данные;

• jivo_onResizeCallback - событие срабатывает при любом изменении размеров виджета, например, при его сворачивании или разворачивании, а также при перемещении окна онлайн-чата по странице;
• jivo_onCallStart - событие вызывается при начале звонка на клиентский номер, а также при показе виджета на странице;
• jivo_onCallEnd - событие вызывается при окончании звонка с результатом звонка;
• jivo_onChangeState - событие активируется при переключении виджета из одного состояния в другое, например, при сворачивании и разворачивании окна онлайн-чата.

Как видите, список отслеживаемых событий достаточно большой, но все равно есть различия с теми событиями, которые сейчас автоматически отправляются в Яндекс.Метрику и Universal Analytics. Для Google Analytics 4 я рекомендую отслеживать несколько из перечисленных выше:

• jivo_onOpen
• jivo_onMessageSent
• jivo_onAccept
• jivo_onIntroduction

Теперь перейдем в интерфейс диспетчера тегов Google и начнем настройку.

Создание тега

Перейдите в Google Tag Manager и в разделе Теги создайте тег типа Пользовательский HTML с таким кодом:

В Google Tag Manager:

В качестве триггера активации выберите All Pages (Все страницы). Задайте тегу название и сохраните его.

Скрипт работает следующим образом: для каждой callback-функции мы прописываем уровень данных (dataLayer) с соответствующим названием события в event. Оно может быть произвольным. Его в дальнейшем вы будете использовать при настройке триггера. Поскольку общего коллбэка, который бы отдавал все параметры, в JivoSite нет, потребуется прописать каждую функцию отдельно.

События будут фиксироваться в следующих случаях:

• когда открывается окно онлайн-чата;
• когда посетитель отправил первое сообщение в чат;
• когда оператор начинает диалог с пользователем;
• когда посетитель ввел контактные данные.

Создание триггера

Перейдите в раздел Триггеры и создайте триггер типа Специальное событие, используя регулярное выражение:

В Google Tag Manager это будет выглядеть так:

С помощью регулярного выражения через символ | перечисляются все события, которые вы будете отслеживать. Задайте название триггеру и сохраните его.

Создание тега события GA4

Создайте тег типа Google Аналитика: событие GA4 с такими настройками:

• Тег конфигурации - Google Analytics 4
• Название события - {{Event}}

В качестве триггера активации выберите триггер специального события, созданный на предыдущем шаге. Задайте тегу название и сохраните его.

Как только будет совершено событие(я), которое(ые) вы задали в триггере, активируется тег событий GA4, и он передаст информацию о совершенном событии с названием, которое автоматически будет подставлено из встроенной переменной Event в момент его срабатывания.

Режим отладки

Проверить передачу данных вы можете в Google Analytics 4 с помощью отчета В реальном времени или инструмента DebugView, а также через режим предварительного просмотра Google Tag Manager.

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

Поскольку в рамках этой статьи мы настроили четыре из них (jivo_onOpen, jivo_onMessageSent, jivo_onAccept и jivo_onIntroduction), по очереди нажмите на каждое на шкале по мере их срабатывания, а затем убедитесь, что тег события GA4 срабатывает как надо.

Например, для события jivo_onMessageSent триггер и тег срабатывают после того, как пользователь напишет первое сообщение в чат:

Триггер активирует тег, который затем передает эту информацию в Google Analytics 4. В DebugView вы можете наблюдать аналогичную картину с событиями на шкале:

От момента совершения события до момента, когда вы увидите данные в отчетах GA4, может пройти до 24 часов. Список зарегистрируемых событий по JivoSite в Google Analytics 4 будет отображаться в разделе Конфигурация - События или в стандартных отчетах Взаимодействие - События.

Сбор событий GA3 в GA4 (без GTM)

Поскольку JivoSite умеет автоматически отправлять в GA3 события о взаимодействии с онлайн-чатом, вы можете в GA4 использовать функцию сбора данных Universal Analytics, чтоб конвертировать события старого счетчика в новый, не используя при этом диспетчер тегов Google, а только Google Analytics, установленный напрямую в код сайта:

Настройка называется Сбор событий Universal Analytics. Она позволяет автоматически регистрировать в GA4 такие типы обращений из Universal Analytics, как: событие (event), пользовательское время (timing) и исключение (exception). Но для этого ее необходимо активировать.

Чтобы включить Сбор событий Universal Analytics в Google Analytics 4, перейдите на уровень ресурса в раздел Потоки данных и выберите свой Веб-поток:

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

В разделе Настройки событий включите переключатель Сбор событий Universal Analytics:

На этом настройка завершена. Теперь Google Analytics сам сделает преобразования конструкции событий Universal Analytics в Google Analytics 4 по следующей схеме:

• eventAction - название события;
• eventCategory - параметр события;
• eventLabel - параметр события;
• eventValue - параметр события.

Отличия заключаются и в том, как пишутся эти параметры событий в GA4:

• 'eventCategory' -> 'event_category'
• 'eventLabel' -> 'event_label'
• 'eventValue' -> 'value'

Таким образом, событие JivoSite, например, активного приглашения в диалог, которое передавалось в Universal Analytics как:

• Категория события - JivoSite
• Действие по событию - Proactive invitation accepted
• Ярлык события - Активное приглашение в диалог

В Google Analytics 4 оно преобразуется в:

• Название события - JivoSite
• event_action - Proactive invitation accepted
• event_category - JivoSite
• event_label - Активное приглашение в диалог

Аналогично и с другими событиями, которые регистрирует JivoSite. Вот так выглядит событие в DebugView, которое отправляется автоматически после активации функции Сбор событий Universal Analytics: