Настройка отслеживания событий на сайте с помощью триггера Пользовательское событие в GTM

Клик по ссылке, нажатие на кнопку, отправки обычных форм можно отслеживать с помощью встроенных триггеров GTM, используя при этом классы, идентификаторы и прочие элементы. Но eсть ещё один хороший способ – через триггер Пользовательское событие (англ. Custom Event).

На этом сайте уже был опубликован пример отправки формы с использованием триггера Пользовательское событие. Посмотреть его можно здесь.

В данном примере будем отслеживать клик перехода на страницу с версией для печати поста на движке WordPress.

Перед выполнением всех действий проверьте, установлен ли у вас ГТМ и всё остальное. Если нет, то вам сначала сюда.

Для этого к тегу ссылки <a> добавим событие:

onclick="dataLayer.push({'event': 'print_post'});"

как на скриншоте:

Это позволит отправить команду в dataLayer пользовательское событие print_post. Это и есть необходимое и достаточное условие для отслеживания.

Сделать это можно в файле шаблона single.php или в подключённых к нему частях, которые находятся в других файлах (будет что-то вроде template-parts/content-single.php).

Консоль администратора – Внешний вид – Редактор тем – Отдельная запись single.php

Переходим в ГТМ в Триггеры, создаём триггер Print Post – Click типа Пользовательское событие из раздела Другое.

Имя события – print_post

В условиях активации указываем Некоторые специальные события

Активировать триггер после выполнения условий

Click URLсодержитprint
Click Targetравно_blank

Сохраним

Можно оставить условия активации Все специальные события, если в уточнениях нет необходимости.

Настройка цели в Яндекс Метрике

В ГТМ переходим в Теги и создадим тег для Яндекс.Метрики и назовём его Print Post – YM

Тип тега: Пользовательский HTML

Код

<script>
  yaCounterXXXXXXXX.reachGoal('print-post');
</script>

и привяжем к нему Триггер активации Print Post – Click

Сохраним

XXXXXXXX – это id счётчика Метрики

print-post – идентификатор цели

Теперь переходим в Яндекс Метрику – Настройки – Цели

Добавим цель типа JavaScript-событие с идентификатором print-post

Настройка передачи события в Google Аналитику

В ГТМ создадим тег для Google Аналитики и назовём его Print Post – GA

  • Тип тега: Google Аналитика – Universal Analytics
  • Тип отслеживания: Событие
  • Категория: Print Post
  • Действие: Print
  • Ярлык: {{Page URL}}
  • Настройки Google Analytics: {{Google Analytics}}

и привяжем к нему Триггер активации Print Post – Click

Ярлык {{Page URL}} мы указываем для того, чтобы видеть, урлы каких постов пользователь хочет напечатать.

Сохраняем

Настройка передачи события в Рейтинг Mail.ru

В ГТМ переходим в Теги и создадим тег для Рейтинга Mail.ru и назовём его Print Post – Mail.ru Event

Тип тега: Пользовательский HTML

Код

<script>
	var _tmr = window._tmr || (window._tmr = []);
	_tmr.push({ id: "XXXXXXX", type: "sendEvent", category: "Print Post", action: "Print", label: "{{Page URL}}" });
</script>

и привяжем к нему Триггер активации Print Post – Click

  • label {{Page URL}} мы указываем для того, чтобы видеть, урлы каких постов пользователь хочет напечатать
  • XXXXXXX – id счётчика Рейтинга Mail.ru

Сохраняем и опубликовываем

Настройка завершена.

Проверка

Переходим на любой пост и кликаем на ссылку Версия для печати. Готово. Проверяем результаты

в событиях Google Analytics

в целях Яндекс Метрики

в событиях Рейтинга Mail.ru

Можно также создать цель в Google Аналитике:

Для того, чтобы создать цель в Рейтинге Mail.ru, в интерфейсе необходимо создать цель на основе события print-post и получить код цели.

После этого необходимо вернуться в Google Tag Manager и создать там тег Пользовательский HTML с названием, например, Print Post – Mail.ru Target

И в HTML-код вставляем полученный код цели. Также выставляем приоритет активации тегов – 1 и привязываем триггер активации Print Post – Click

Проверяем как работает цель

Готово, всё работает.

Поделиться ссылкой: