Как отслеживать онлайн-чат SiteHeart в Google Analytics
Один из видов взаимодействия пользователем с сайтом, может служить онлайн-чат. Но большинство систем, реализующих такой функционал не дает возможности передавать в Google Analytics данные о взаимодействии с чатом.
На примере SiteHeart разберем, как можно настроить отслеживание событий связанных с использованием чата.
На примере SiteHeart разберем, как можно настроить отслеживание событий связанных с использованием чата.
Всю настройку будем проводить через Google Tag Manager, что значительно упростит процесс. Базовую настройку GTM опустим, сейчас в сети множество статей по этому поводу, и разобраться не сложно, начинаем с места, что у нас настроен Google Analytics. Для начала необходимо включить теги автоматических событий:
1. Прослушивание отправки формы
(в разделе Блок прослушивания событий)
(в разделе Блок прослушивания событий)
Настройка тега автоматического прослушивания форм в GTM
2. Прослушивание кликов (в разделе Блок прослушивания событий)
Настройка тега автоматического прослушивания кликов в GTM
3. И по аналогии, можно включить прослушивание кликов по ссылке, всё равно пригодится.
При настройки этих тегов, обязательно устанавливаем правила активации тегов — «Все страницы».
Настраиваем отслеживание взаимодействие с SiteHeart
У нас будет три события:
- нажатие на кнопку чата;
- отправка сообщения офлайн;
- отправка сообщения онлайн.
1
Нажатие на кнопку чата
Для отслеживания этого события, создаем новый тег:
Отслеживание окна чата Siteheart
Тут всё стандартно, новое событие в Google Analytics, с категорией SH Window Open, на которое, в дальнейшем можно настроить цель в GA.
Активация правила (тег активируется если пользователь нажал на окно — событие gtm.click, при чем класс элемента — shc sh_btn_char):
Активация правила (тег активируется если пользователь нажал на окно — событие gtm.click, при чем класс элемента — shc sh_btn_char):
правило для тега отслеживания открытия окна SiteHeart
После чего, сохраняем это правило.
2
Отправка сообщения офлайн
Если оператора нет на месте, вместо окна онлайн-чата появляется форма обратной связи, в которую пользователь может добавить свое сообщение и отправить.
Siteheart отправка сообщения офлайн
Т.е. нам нужно отследить успешное выполнение формы, после нажатия кнопки «отправить». Для этого делаем новый тег:
тег GTM отслеживания отправки сообщения siteheart офлайн
Где активация правил будет (так как это форма, мы используем событие — gtm.formSubmit и id элемента, а не класс как в прошлый раз — sh_form_shi_1):
активация правил тега GTM отслеживания отправки сообщения siteheart офлайн
После чего сохраняем и этот тег.
3
Отправка сообщения онлайн
Если же операторы онлайн, что скорей всего, могут быть настройки, что окно чата открывается автоматически, или же факт открытия открытия вообщем не значит, что человек начал взаимодействовать с чатом в дальнейшем. Поэтому необходимо отследить и факт отправки сообщения. Есть две возможности отправить сообщение, это нажать на кнопку «Enter» или же на иконку отправки сообщения:
онлайн-чат Siteheart
Для этого необходимо создать новый тег (тип тега — Пользовательский HTML):
тег для отслеживания чата siteheart
В котором будет размещаться этот код:
<script type="text/javascript">
document.getElementsByClassName('shc')[0].onkeydown = function(e){
var e=window.event || e;
if (e.keyCode == 13) { dataLayer.push({event:'shChat'}); }
}
document.getElementsByClassName('shc sh_enter_ico')[0].onclick=function() { dataLayer.push({ event:'shChat' });}
</script>И правило активации будет:
правило активации тега отслеживания чата siteheart
Этим тегом мы генерируем внутреннее (внутри gtm) событие, говорящее нам, что было взаимодействие с полем отправки сообщения, или нажата кнопка Enter или картинка с знаком отправить сообщение.
И на последок, делаем еще один тег, который передает в GA событие о факте взаимодействия с полем чата:
И на последок, делаем еще один тег, который передает в GA событие о факте взаимодействия с полем чата:
тег отправляющий событие в GA о взаимодействии с чатом
Где правило активации будет:
правило активации для тега события GA
Сохраняем, создаем версию, публикуем и наслаждаемся новыми событиями в Google Analytics.
PS: В примере, для простоты понимания, я показал разбивку на несколько тегов, хотя в реальности всё эти события можно формировать в рамках одного тега, просто подставляя макрос в поле «Категория событий».
