Создание цели на кнопку или форму в Яндекс Метрике и Google Analytics

Привет! Не так давно встала необходимость отслеживания цели в Метрике и Google (Universal) Analytics одновременно, а поскольку Гугл недавно в очередной раз изменил код своих счетчиков, пришлось повозиться и пошерстить Интернет в поисках решения. Обозначенная ниже инструкция подойдет, если у вас установлен новый счетчик аналитики, в котором присутствуют функции gtag вместо старых ga. На данный момент он выглядит так:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXX');
</script>

Итак, чтобы настроить отслеживание конверсии при клике на кнопку, пишем такой код:

<button ... onclick="gtag('event', 'event_name', { 'event_category': 'main', 'event_action': 'button' }); yaCounterXXXXXXXX.reachGoal('button_click');">...</button>

Создание цели Событие в Google Analytics
Создание цели Событие JavaScript в Яндекс Метрика

В данном случае, 'event_name' — произвольное название цели, 'main', 'button' указываются в Google Analytics (тип цели: событие), а 'button_click' — в Yandex Metrika, вы меняете на те, которые укажете в своих счетчиках в соответствующих полях. XXXXXXXX здесь — код счетчика вашей Яндекс Метрики и Google Analytics соответственно.

Чтобы проверить работу целей, в Google Analytics смотрите отчет «В режиме реального времени» — «Конверсии». Когда открыли его, кликаете на кнопку и видите, что цель засчитывается. Учет цели в реальном отчете появится где-то через сутки. В Яндекс Метрике для отслеживания выполнения цели нет никаких специальных инструментов, но данные туда поступают намного быстрее — в среднем, через 5-10 минут, поэтому просто чуть позже проверьте отчет по конверсиям.

Если по каким-то причинам у вас по-прежнему не учитываются конверсии в GA, вы можете сделать отслеживание цели через вызов виртуальной страницы. Тогда в Аналитикс нужно будет установить «Тип цели: переход», и на третьем шаге в поле «Переход» -> «Равно» указать произвольный URL вашей виртуальной страницы, который в дальнейшем добавите в код кнопки. После этого код вашей кнопки должен выглядеть так:

<button ... onclick="gtag('config', 'UA-XXXXXXXX', {'page_path': '/pageview'}); yaCounterXXXXXXX.reachGoal('button_click');">...</button>

Создание цели Переход в Google Analytics

Здесь, соответственно, вместо '/pageview' напишите то, что указывали ранее при создании цели. В Метрике вся настройка остается прежней.

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

<form ... onsubmit="gtag('event', 'event_name', { 'event_category': 'main', 'event_action': 'button'}); yaCounterXXXXXXXX.reachGoal('button_click'); return true;">...</form>

Или

<form ... onsubmit="gtag('config', 'UA-XXXXXXXX', {'page_path': '/pageview'}); yaCounterXXXXXXX.reachGoal('button_click'); return true;">...</form>

В зависимости от того, работает ли конверсия от действия «Событие» или нет. Как видите, здесь добавляется строчка return true;. Вот и все, успехов!

Создание цели на кнопку или форму в Яндекс Метрике и Google Analytics: 2 комментария

  1. Спасибо! По новой гугл аналитики с gtag практически не найти ничего в рунете. Только у вас откопал нужный код для кнопки заказа.

    1. Пожалуйста, Михаил! Я стараюсь выкладывать только то, что самому не удалось найти в Интернете, или нашел с трудом и по кусочкам 🙂

Добавить комментарий

Ваш e-mail не будет опубликован.