Настройка JivoSite для Яндекс.Метрики

Знали ли вы, что можно обойти платные ограничения JivoSite и отправлять события в счетчик Яндекс.Метрики даже спустя окончание бесплатного периода и не используя корпоративный или профессиональный тарифы. И сделать это можно с помощью Google Tag Manager и JivoSite API.

Автоматические цели Jivo

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

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

• Автоцель Jivo: запуск чата клиентом (Jivo_Client_initiate_chat) - чат начат со стороны клиента. Возникает при отправке клиентом сообщения в форму чата при условии, что активное приглашение ранее не было показано;
• Автоцель Jivo: автоприглашение в чат (Jivo_Proactive_invitation_accepted) - клиент принял активное приглашение, написав сообщение в ответ. Также срабатывает при нажатии кнопки чата в мобильной версии, если до этого сработало активное приглашение;
• Автоцель Jivo: ручное приглашение в чат (Jivo_Client_answer_on_agent_request) - оператор вручную начал диалог с клиентом через функцию Посетители, а посетитель ответил, отправив сообщение в чат;
• Автоцель Jivo: офлайн-сообщение (Jivo_Offline_message_sent) - клиент отправил оффлайн-сообщение.

Чтобы автоматические цели регистрировались в вашем счетчике, вам необходимо проверить, чтобы в интерфейсе Метрики они были включены. Для этого перейдите в раздел Настройка и убедитесь, что напротив блока Автоматические цели стоит Вкл.:

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

А в разделе Цели вы увидите новые автоматические цели:

Вы можете управлять автоцелями Jivo так же, как другими автоматическими целями: редактировать и удалять. Если вам нужно отслеживать в Метрике другие события Jivo, их можно добавить вручную с помощью официального руководства.

Ограничения

• автоматические цели не учитываются в общем количестве целей счетчика;
• данный тип цели невозможно использовать в составной цели;
• сервис фиксирует достижение посетителем одной и той же цели на одном счетчике не чаще, чем раз в секунду.
• во время одного визита посетителя сервис может фиксировать до 400 достижений всех целей, созданных для счетчика.
• при редактировании счетчика или цели накопленная ранее информация не изменяется.
• если вы удалите цель, собранная по ней информация не будет доступна в отчетах.

Помимо этого, автоматические цели JivoSite будут регистрироваться в Яндекс.Метрике только на профессиональном и корпоративном тарифах.

JivoSite API

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

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

В Widget API доступны следующие Callback-функции:

• jivo_onLoadCallback - событие вызывается при завершении инициализации виджета Jivo;
• jivo_onOpen - событие вызывается при открытии окна диалога Jivo;
• jivo_onMessageSent - событие вызывается когда посетитель отправил первое сообщение в чат;
• jivo_onAccept - событие срабатывает, когда оператор нажал кнопку Ответить в уведомлении о новом чате или принял диалог в интерфейсе сервиса;
• jivo_onClose - событие срабатывает, когда происходит сворачивание окна диалога Jivo (нажатие на крестик онлайн-чата);
• jivo_onIntroduction - событие активируется, когда посетитель ввел контактные данные;
• jivo_onResizeCallback - событие срабатывает при любом изменении размеров виджета, например, при его сворачивании или разворачивании, а также при перемещении окна онлайн-чата по странице;
• jivo_onCallStart - событие вызывается при начале звонка на клиентский номер, а также при показе виджета на странице;
• jivo_onCallEnd - событие вызывается при окончании звонка с результатом звонка;
• jivo_onChangeState - событие активируется при переключении виджета из одного состояния в другое, например, при сворачивании и разворачивании окна онлайн-чата;
• jivo_onMessageReceived - событие регистрируется когда от оператора поступило новое сообщение в чат;
• jivo_onClientStartChat - событие сработает, когда пользователь инициирует диалог, отправив сообщение в чат. И только в том случае, если ранее в чате не появлялось активное приглашение от лица оператора;
• jivo_onWidgetDestroy - событие вызывается при полном удалении виджета со страницы. Срабатывает при вызове метода jivo_destroy().

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

• 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 это будет выглядеть так:

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

Создание тега Яндекс.Метрики

Создайте тег типа Пользовательский HTML со следующим кодом:

, где:

• XXXXXXXX - идентификатор счетчика Яндекс.Метрики (обязательно измените его на свой!);
• Event - встроенная переменная названия события.

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

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

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

Создание целей в интерфейсе Яндекс.Метрики

В Google Tag Manager для отслеживания всех событий JivoSite можно использовать один триггер и тег. А вот чтобы эта информация корректно фиксировалась в конверсиях Метрики, вам необходимо создать для каждого события свою собственную цель.

Для этого перейдите в раздел Цели и создайте поочередно столько целей с типом JavaScript-событие, сколько событий вы отслеживаете. В моем примере их четыре (jivo_onOpen, jivo_onMessageSent, jivo_onAccept, jivo_onIntroduction). Для каждого из них пропишите условие - Идентификатор цели совпадает и затем название callback-функции:

Примечание: задавать идентификаторы цели для каждого события нужно точно так же, как они прописаны у вас в триггере специального события в Google Tag Manager!

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

Проверить передачу данных вы можете с помощью специальных расширений Yandex Metrica Debugger и Яндекс.Метрика Инспектор для браузера Google Chrome, а также через режим предварительного просмотра GTM.

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

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

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

Посмотрев тег детальнее, вы увидите, как вместо переменной {{Event}}, которую мы задали в коде пользовательского HTML-тега, отображается значение конкретного события. В данном случае - jivo_onMessageSent:

К сожалению, оно может выглядеть не совсем привычным для вас, поскольку это HTML-код, и само название события при переносе в строке HTML разделилось на две строчки, между которыми появился знак плюса, апострофы (для отображения строки) и косые черты. Но это не должно вас смущать. Главное, чтобы данные о событиях  передались в ваш счетчик Яндекс.Метрики.

Конверсии в Яндекс.Метрике

После того, как вы проверите все события Jivo в режиме предварительного просмотра Google Tag Manager, вернитесь в интерфейс Яндекс.Метрики, откройте раздел Конверсии и убедитесь, что данные о совершенных событиях поступают в ваш счетчик.

Если это так, то вы все сделали правильно. В противном случае пройдитесь по всем шагам руководства и еще раз проверьте свои настройки.

О том, как настраивается JivoSite для Google Analytics 4 с помощью Google Tag Manager и JivoSite API, читайте в этом материале.