Настройка и использование Google Tag Manager

Использование Google Tag Manager (GTM) в бою. 2 способа добавит Google Tag Manager в движок Dokuwiki

Подключение и базовая настройка GTM

Код для вставки Google Tag Manager на ваш сайт находится: заходим в Ваш аккаунт GTM→ Администрирование (вкладка "КОНТЕЙНЕР") → "Установить Google Менеджер тегов". Для добавления кода в Wordpress, я обычно использую плагин Clearfy Pro, как вариант существует плагин Google Tag Manager for Wordpress с поддержкой Contact Form 7, WooCommerce, Google Optimize, Accelerated Mobile Pages (AMP страниц.)

На мой взгляд самая корректная установка кода GTM или на прямую через редактирование темы Wordpress или через плагин Clearfy Pro. В плагине Clearfy перейдите на страницу "Код", найдите раздел "Код в <head>" включите его и вставьте первый блок кода GTM. Ниже найдите раздел "Код перед </body>", включите его и вставьте второй блок кода GTM. Нажмите кнопку внизу "Сохранить изменения".

Проверить подключение кода GTM рекомендую при помощи официального расширения Tag Assistant (by Google) для браузера Chrome.

  1. Установка Universal Analytics в Google Tag Manager: 1) создание переменной (тип Константа) для хранения ID Google Analytics.
  2. Добавить переменные для отслеживание кликов и форм, переходим в раздел GTM "Рабочая область" → "Переменные" → Кнопка "Настроить". Ставим галочки напротив всех событий в разделах "Страницы", "Клики", "Формы".

GTM: Как отслеживать переходы по внешним ссылкам с сайта Wordpress WooCommerce

Задача: Сайт на Wordpress WooCommerce с партнерскими ссылками. Нужно создать конверсии (цели) для анализа переходов по партнерским ссылками.

Решение этой задачи достаточно не тривиально, потому что кнопка "В корзину" на странице рубрик товаров WooCommerce и кнопка "В корзину" на странице карточки товаров сверстаны по разному. В первом случае это обычная ссылка, во втором случае кнопка (тег button) обернута в тег формы (тег form). Поэтому в предлагаемом решении я сделаю 2 триггера для этих случаев, но Категорию (AffLinkClick) цели задам одну и на выходе получу одну микроконверсию в Google Аналитика для обоих вариантов.

Первый триггер - это универсальный триггер по отслеживанию переходов по внешним ссылкам, он подходит для вариантов партнерских ссылок на любом сайте Wordpress.

Этапы настройки первого триггера для ссылок:

  1. Предварительно установлена Google Аналитика и Яндекс.Метрика
  2. Добавить переменные событий в разделах "Страницы", "Клики", "Формы".
  3. Добавляем триггер: Только ссылки. Ставим галочки "Ждать теги" (чтобы не срабатывал впустую), "Проверка ошибок". Включить триггер при выполнении всех этих условий: Page URL содержит "впишите домен вашего сайта".Условия активации триггера: Click URL содержит "впишите часть партнерской ссылки - общей для всех партнерских URL". Жмем "Сохранить". Эти действия привели к отслеживанию события gtm.linkClick, уже на этом этапе, конечно после публикации изменений, вы можете его увидеть в GTM дебаггере.
  4. Создать тег события. Создаем новый тег на основе Universal Analytics: Тип отслеживания= Событие (Читать подробно о событиях в GA). Параметры отслеживания событий: вписываем свои значения в параметры Категория = AffLinkClick, Действия выбираем переменную Click URL, Ярлык выбираем переменную Page Path. Добавляем ID GA. Включаем на срабатывание нашего триггера. Сохраняем.
  5. Проверяем данные о событие в Google Аналитика, для этого переходим Google Аналитика → "Отчет в реальном времени" → "События". Вы должны увидеть ваше событие, если его нет, возможно вы не опубликовали контейнер GTM.
  6. Создать цель на событие в Google Analitycs: Установка цели выбираем "Собственная". Описание цели выбираем "Событие". Условия события: задаем только категорию, вписываем то же самое что и в GTM категории: все остальные поля Действие, Ярлык, Ценность оставляем пустыми.

Всё! Можете перейти в отчет GA→"Источники трафика"→"Источник/канал" и посмотреть статистику по вашей цели. Не забудьте выбрать сегодняшнюю дату в GA LOL.

Частично настройку можно посмотреть в этом видео:

Этапы настройки второго триггера для кнопки в товарной карточки WooCommerce:

  1. Добавляем триггер: Клик - все элементы. Включить триггер при выполнении всех этих условий: Page URL содержит "впишите домен вашего сайта", Form Classes содержит имя класса cart (имя класса вы можете посмотреть в дебаггере вашего браузера). Сохраняем.
  2. Создать тег события. Создаем новый тег на основе Universal Analytics: Тип отслеживания= Событие (Читать подробно о событиях в GA). Параметры отслеживания событий: вписываем свои значения в параметры Категория = AffLinkClick, Действия выбираем переменную Page Path (так как в Form URL WooCommerce не передает значение, к сожалению), Ярлык выбираем переменную Page Path. Добавляем ID GA. Включаем на срабатывание нашего триггера. Сохраняем.
  3. Создавать новую цель на событие в Google Analitycs НЕ нужно, будет отрабатывать созданная ранее.

Настройка электронной торговли (e-commerce) Google Analytics в Google Tag Manager

Для настройки модуля электронной торговли (e-commerce) Google Analytics в Google Tag Manager в первую очередь включаем в модуль в Google Analytics.

Существует два основных способа реализации отслеживания электронной торговли.

Отчеты о стандартной электронной торговле в Google Analytics содержат данные по покупкам, совершенным на вашем сайте или в приложении, в частности информацию о товарах, транзакциях, средней стоимости заказов, коэффициенте транзакций, времени до покупки и т. д.

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

Отслеживаем отправку форм в Google Tag Manager (2020)

Рассмотрим как отслеживать отправку форм <form> в Google Analytics и Яндекс Метрику с помощью Диспетчера тегов.

Этапы настройки тега отслеживания отправки формы:

  1. В GTM есть готовый шаблон триггера, который так и называется "Отправка формы". Выбираем его. Настройки оставляем по умолчанию (Условия активации триггера: Все формы). Сохранили.
  2. Перешли в режим "Предварительный просмотр" и убедились, что НЕ правильно заполненная форма не создает событие gtm.fromSubmit. Событие должно появляться только при отсылке правильно заполненной формы.
  3. Создаем новый тег на основе Universal Analytics: Тип отслеживания= Событие. Параметры отслеживания событий: Категория = form, Действие = submit. Добавляем ID GA. Включаем на срабатывание нашего триггера. Сохраняем.
  4. Все!

Устранение ошибок в Google Tag Manager

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

Facebook Pixel invalid email address was specified for 'em'

Facebook Pixel добавлен на сайт при помощи Google Tag Manager.

В консоли браузера наблюдаю ошибку: An invalid email address was specified for 'em'. This data will not be sent with any events for this Pixel.

  • Решение 1: для решения этой проблемы вам нужно отключить "Использовать расширенное совпадение" в настройках пикселя и вставить новый код в Google Tag Manager.
  • Решение 2: ваш программист должен настроить переменную em: 'insert_email_variable' для передачи дополнительных сведениях о ваших посетителях сайта, подробнее Advanced Matching with the Pixel
PQ VPS сервера в 28+ странах.