Руководство по режиму отладки google tag manager

Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5 (6 оценок, среднее: 5,00 из 5)
Загрузка...

Почему мой тег не срабатывает? Какие данные можно отправлять в Google Analytics? Почему этот триггер не сработал?

Когда дело доходит до Диспетчера тегов Google, мы иногда сталкиваемся с проблемами, которые требуют дальнейшего изучения того, что происходит. Одним из наиболее важных, но часто игнорируемых шагов в процессе GTM является отладка. Это позволяет нам гарантировать, что все возможные сценарии пользовательского тестирования будут проверены, а согласованность данных будет проверена. В этом руководстве я покажу вам, как использовать режим отладки Диспетчера тегов Google и поделюсь некоторыми передовыми методами.

ЧТО ТАКОЕ РЕЖИМ ОТЛАДКИ ДИСПЕТЧЕРА ТЕГОВ GOOGLE?

Режим просмотра и отладки Диспетчера тегов Google позволяет вам просматривать сайт, на котором реализован код контейнера GTM. Сайты с включенным режимом просмотра отобразят панель отладчика (или консоль) внизу экрана вашего браузера, чтобы вы могли проверить, какие теги запущены и в каком порядке.

Режим отладки в GTM - pm-ka.com

ВКЛЮЧИТЬ РЕЖИМ ПРЕДВАРИТЕЛЬНОГО ПРОСМОТРА И ОТЛАДКИ

Чтобы включить режим отладки Диспетчера тегов Google, нажмите кнопку «Предварительный просмотр» в правом верхнем углу вашего интерфейса GTM (рядом с кнопкой «Отправить»).

Панель управления Gtm - шапка GTM

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

Режим предварительного просмотра в GTM

Теперь перейдите на сайт, где установлен код контейнера Диспетчера тегов Google, обновите страницу, окно консоли отладки появится внизу окна браузера, в котором будет представлена ​​подробная информация о ваших тегах, включая их статус активации, данные которые обрабатываютсяю.

Это окно консоли появится только у вас на вашем компьютере при предварительном просмотре сайта и не будет отображаться другим посетителям вашего сайта.

Важно: если у вас возникли трудности с режимом предварительного просмотра и отладки, прочитайте руководство по его устранению.

кОНСОЛь ПРЕДВАРИТЕЛЬНОГО ПРОСМОТРА И ОТЛАДКИ

Режим отладки от Google Tag Manager состоит из четырех основных частей:

Режим отладки в GTM - pm-ks.com

  1. Временная шкала событий. Отображает все события, происходящие в слое данных (например, просмотры страниц, представления форм, клики и т.д.). Не допускайте ошибки в событиях Google Analytics. Это полностью две разные концепции, о которых я говорил в этой статье.
  2. Теги. Показывает, какие теги срабатывают по выбранному событию, а какие – нет.
  3. Переменные. Отображает подробную информацию о переменных в выбранном событии, включая тип переменной, тип возвращаемых данных и разрешенное значение.
  4. Уровень данных . Отображает точный объект сообщения, когда он был перенесен на уровень данных для выбранного события и как выглядит слой данных после завершения транзакции сообщения. Все доступные здесь данные могут быть превращены в переменные (которые затем появятся на вкладке Variables).

ВРЕМЕННАЯ ШКАЛА СОБЫТИЙ

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

Если вы видите больше событий (например,  Message), это нормально. Но важно, чтобы все три вышеупомянутых события отображались в списке.

ПОЧЕМУ ВСЕГДА ТРИ СОБЫТИЯ?

Что они имеют в виду?

Событие просмотра страницы  (aka gtm.js) – это самый ранний момент всего процесса загрузки страницы, когда можно запустить наши скрипты отслеживания. Именно тогда вам следует запустить сценарий отслеживания просмотра страницы Google Analytics или теги ремаркетинга AdWords. Даже если страница не закончила загрузку, ваш скрипт отслеживания будет запущен.

Событие DOM Ready (aka gtm.dom) появляется, когда HTML – код сайта отображается, и посетитель начинает видеть элементы вашего сайта.

Событие Window Loaded (aka gtm.load) срабатывает только тогда, когда все остальное (включая Javascript) заканчивает загрузку.

Если у вас есть теги, которые не так важны, но все же должны срабатывать на каждой странице, я рекомендую связать их с событиями/триггерами DOM Ready или Window Loaded. Браузеры ограничивают количество HTTP-запросов, которые могут произойти за раз. Устранение всех тегов с видом страницы может вызвать некоторые проблемы.

Эта ситуация также может быть решена путем внедрения приоритетов тегов или последовательности меток.

КАКОВЫ ДРУГИЕ ВОЗМОЖНЫЕ СОБЫТИЯ TAG MANAGER В GOOGLE?

На самом деле список событий бесконечен. Позволь мне объяснить.

Диспетчер тегов Google предлагает список встроенных триггеров, таких как просмотр страницы (включая ранее описанный просмотр страницы, готовность к DOM и загруженное окно), щелчок (щелчок по клику и  щелчку любого элемента), оформление формы , таймеризменение историиОшибка Javascript.

После включения триггера он начинает искать конкретные взаимодействия на вашем сайте.

Когда возникает желаемое взаимодействие, это событие появляется на временной шкале событий GTM.

Итак, почему я сказал, что список событий GTM бесконечен? Это из-за последнего типа триггера, называемого  Custom.

Создание триггеров в GTM

Пользовательское событие – это событие, определенное вами, вашим разработчиком или сторонним решением, которое реализовано на вашем сайте.

Режим отладки с событием социальных кликов

Когда вы нажимаете какое-либо событие на временной шкале, вы можете видеть, какие теги срабатывают, а какие – нет. Здесь  вкладка «Теги» становится очень важной.

ТЕГИ

На этой вкладке отображаются все доступные теги, разделенные между теми, которые были запущены на выбранном событии, и те, которые этого не сделали. То, что делает этот раздел действительно потрясающим, – это возможность узнать точную причину, по которой какой-либо конкретный тэг делал или не срабатывал.

Выберите любое событие на временной шкале событий (1), а затем щелкните тег, который вас интересует (2).

Активация триггеров в режиме отладки

То, что вы увидите, – это гораздо более подробное представление о том, что происходит с этим тегом:

  • Свойства тега.
  • Триггеры тега.
  • Триггеры блокировки.

Активированный триггер в GTM в режиме отладки

Если вы используете более сложные триггеры с несколькими условиями, вы можете увидеть состояние каждого условия (см.скриншот ниже). Зеленый флажок указывает, что условие выполнено, в противном случае появляется красный X.

Неактивный триггер режиме просмотра GTM

ПЕРЕМЕННЫЕ

Итак, перейдем к  вкладке «Переменные». Он отображает подробную информацию о переменных в выбранном событии, включая тип переменной, тип возвращаемых данных и разрешенное значение.

Переменные в режиме отладки Gtm

Эти переменные к вашим услугам. Вы можете включить их в любой тег, который вы хотите, будь то тег события Google Analytics, тег события Mixpanel или что-то еще. Переменные можно включить, окружив их фигурными скобками {{}}. Взгляните на приведенный ниже пример.

Использование переменной в GTM

Переключитесь между событиями GTM (в временной шкале событий), и вы увидите, как изменяются значения переменных в зависимости от контекста.

ПОДЕЛИТЬСЯ ИЛИ ВЫЙТИ

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

Однако вы можете поделиться своим предварительным просмотром с другими, используя функцию предварительного просмотра . Нажмите «Предварительный  просмотр» в баннере уведомлений предварительного просмотра.

Передача режима отладки другому сотруднику

Появится диалоговое окно, в котором вы можете скопировать URL-адрес для отправки другому пользователю. Введите домен сайта (в настоящее время вы работаете) и скопируйте созданный URL предварительного просмотра в поле ниже.

Предоставление просмотра в GTM

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

Убедитесь, что человек также включил сторонние файлы cookie в своем браузере. Если панель предварительного просмотра и отладки не отображается, прочитайте эту запись в блоге.

После того, как вы закончили отладку своей реализации Диспетчера тегов Google, нажмите «Оставить режим просмотра» в оранжевой панели уведомлений.

НЕСКОЛЬКО СОВЕТОВ

Вот несколько более быстрых советов, которые не соответствовали предыдущей главе этого сообщения в блоге:

  • Если консоль отладки Диспетчера тегов Google занимает слишком много места на экране, вы можете легко изменить ее размер, перетащив верхнюю границу вверх или вниз, или просто просто скройте всю панель, щелкнув значок стрелки вниз, расположенный в нижнем правом углу.
  • Если вы видите событие «Сообщение» перед событием просмотра страницы в временной шкале событий «Просмотр» и «Отладка», не беспокойтесь. Это означает, что ваш разработчик, плагин или конкретное стороннее решение переместили некоторые данные в слой данных до того, как фрагмент контейнера Tag Manager был загружен. Используйте режим отладки GTM, чтобы узнать, какие точные данные были нажаты в этот момент, может быть, вы найдете что-то полезное!
  • Хотя режим отладки Диспетчера тегов Google является очень важной частью развертывания тегов, это не единственный инструмент, который вы должны использовать.
  • Если вы отлаживаете события Google Analytics, ВСЕГДА проверяйте их в отчетах GA в режиме реального времени. Это лучший способ проверить и отреагировать на ошибки без каких-либо задержек.

 

ВЫВОД

Режим отладки Диспетчера тегов Google является неотъемлемой частью развертывания тегов, что позволяет нам гарантировать, что все возможные сценарии пользовательского опыта проверены и согласованность данных проверена.

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

Его довольно просто использовать даже для не-разработчиков, что делает его еще более привлекательным для обычных маркетологов.

Если у вас есть какие-либо вопросы по этим проблемам, пожалуйста, напишите комментарий ниже или отправьте мне электронное письмолибо оставляйте комментарий ниже.

 

comments powered by HyperComments

Об авторе

Антон Курусь

Создатель этого блога. Люблю узнавать новое и развиваться в интересующих меня областях.
Хочешь сбежать от повседневности — не останавливайся в развитии.

Просмотреть все сообщения