Источником информации могут быть:
● слои данных;
● переменные JavaScript;
● cookies сайта;
● Document Object Model.
В Google Tag Manager переменные делятся на две категории:
1. встроенные переменные – набор готовых, предустановленных в системе переменных;
2. пользовательские переменные – самостоятельное создание с использованием существующих типов переменных.
Встроенные переменныеВстроенные переменные создаются автоматически и их нельзя изменить. Часть из них в GTM не активна по умолчанию.
Рис. 210. Встроенные переменные GTM
Они включаются и отключаются путем простановки галочек (чекбоксов) напротив каждой из них.
Рис. 211. Включение/Отключение встроенных переменных
Использование встроенных переменных не требует глубоких знаний в программировании и иногда позволяет заменить большое количество строк кода всего парой кликов мыши.
В Google Tag Manager на данный момент существует 9 категорий встроенных переменных:
● Страницы
● Утилиты
● Ошибки
● Клики
● Формы
● История
● Видео
● Прокрутка
● Видимость
Страницы
Рис. 212. Встроенные переменные «Страницы»
Наиболее часто используемые переменные. Они позволяют определить где пользователь находится в данный момент относительно URL-структуры сайта. Страница может быть как текущая, на которой в данный момент находится посетитель сайта, так и та страница, с которой он перешел на текущую страницу (Referrer).
Page URL – переменная возвращает полный URL текущей страницы, но без хэша # (все, что после решетки). Например, если пользователь загрузил страницу https://osipenkov.ru/analytics?parameter=true#vars, то переменная вернет значение https://osipenkov.ru/analytics?parameter=true
Page Hostname – переменная возвращает имя хоста (доменное имя) в URL текущей страницы. Например, для страницы https://osipenkov.ru/analytics?parameter=true#vars данная переменная вернет значение osipenkov.ru.
Page Path – переменная возвращает путь к странице в текущем URL без учета GET-параметров, то есть всего того, что идет в URL после знака вопроса «?» и «&» между параметрами.
Например, на странице https://osipenkov.ru/analytics?parameter=true#vars в GTM данная переменная возвращает значение /analytics, а в Google Analytics Page Path вернет значение /analytics?parameter=true
Referrer – полный URL перехода к текущей странице, то есть путь (ссылка) откуда пришел пользователь на текущую страницу.
Например, если пользователь со страницы https://osipenkov.ru/google-analytics-book/перешел на страницу https://osipenkov.ru/google-tag-manager/, то значение данной переменной будет https://osipenkov.ru/google-analytics-book/
Первые три переменные предназначены для текущей страницы, а последняя Referrer необходима для работы с той URL-страницы, с которой пользователь перешел на наш сайт. По умолчанию в Google Tag Manager все 4 встроенные переменные из категории «Страницы» активированы.
В качестве примера разберем простой переход из поисковой системы Google на сайт graphanalytics.ru. В режиме отладки GTM это будет выглядеть так:
Рис. 213. Пример встроенных переменных «Страницы»
Переменная Page Hostname вернула имя домена «graphanalytics.ru», Page Path содержит путь к странице в текущем URL, что соответствует «/» (главная директория), Page URL – полный URL текущей страницы «https://graphanalytics.ru/», а переход на сайт был выполнен из поиска Google, поэтому переменная Referrer вернула значение «https://www.google.ru/».
Утилиты
Рис. 214. Встроенные переменные «Утилиты»
Набор из 6 встроенных переменных в GTM, которые в большей степени носят служебные функции.
Event – возвращает подстроку, которая содержит тип события, произошедшее на сайте. Например, при нажатии на любой элемент возвращает gtm.click, на ссылку – возвращает gtm.linkClick, при заполнении формы – gtm.formSubmit, при возникновении ошибки – gtm.pageError.
Environment Name – возвращает название текущей среды («Реальная», «Последняя» или «Редактирование»), если запрос контейнера выполнен из функции «Поделиться ссылкой для просмотра» или из фрагмента кода среды.
Container ID – возвращает номер контейнера GTM. Например, GTM-NC2LK3M.
Рис. 215. Container ID
Container Version – возвращает номер версии контейнера в виде строкового значения. Например, 5.
Рис. 216. Container Version
Random Number – возвращает случайное число от 0 до 2147483647. Например, 666.
HTML ID – возвращает идентификатор пользовательского HTML-тега. Используется с секвенированием (порядком активации) тегов.
Если мы с вами перейдем в отладчик GTM, то увидим такие значения переменных из категории «Утилиты»:
Рис. 217. Пример встроенных переменных «Утилиты»
В качестве события был выбран Page View (Просмотр страницы):
● Container ID – GTM-W9PC2C8 (идентификатор контейнера);
● Container Version – QUICK_PREVIEW (режим предварительного просмотра);
● Environment Name – Draft Environment 6 2018–04–30 09:47:15 (название среды);
● Event – gtm.js (событие просмотра страницы);
● HTML ID – значение не присвоено. Значение ID переменной HTML отображается только в том случае, если мы работаем с тегами типа пользовательский HTML;
● Random Number – 294510670 (генератор случайных чисел). При обновлении страницы и фиксации нового события данное число изменится.
Ошибки
Рис. 218. Встроенные переменные «Ошибки»
Переменные из этой категории позволяют разработчикам анализировать ошибки, происходящие на сайте (анализ страниц, типы устройств, версий браузеров, разрешений экранов и т.д.). Для использования этих переменных необходимо их активировать и создать хотя бы один триггер типа «Ошибка JavaScript».
Рис. 219. Тип триггера – Ошибка JavaScript
Error Message – возвращает строку, содержащую сообщение об ошибке, отправленное с помощью триггера «Ошибка JavaScript».
Error URL – возвращает строку, содержащую URL-адрес скрипта, в котором была обнаружена ошибка.
Error Line – строка файла, в которой произошла ошибка.
Debug Mode – возвращает значение «true», если активирован режим отладки в Google Tag Manager.
В качестве наглядного примера создадим вынужденную ошибку в коде JS. Но перед тем, как запускать отладчик Google Tag Manager, не забываем создать новый триггер «Ошибка JavaScript» и обновить режим предварительного просмотра. Только после этого изменения вступят в силу.
Рис. 220. Обновление режима предварительного просмотра
В отладчике GTM будет доступна следующая информация:
Рис. 221. Пример встроенных переменных «Ошибки»
● Debug Mode – true, так как у нас активирован режим отладки;
● Error Line – 801 строка;
● Error Message – сообщение об ошибке;
● Error URL – URL-адрес скрипта, в котором обнаружена ошибка.
В случае, если мы в JavaScript используем конструкцию "try..catch", то Google Tag Manager не зафиксирует ошибку. Конструкция выглядит следующим образом:
Рис. 222. Конструкция "try..catch"
Работает она так:
1. Выполняется код внутри блока try.
2. Если в нем ошибок нет, то блок catch(err) игнорируется, то есть выполнение доходит до конца try и потом прыгает через catch.
3. Если в нем возникнет ошибка, то выполнение try на ней прерывается, и управление прыгает в начало блока catch(err).
При этом переменная err (можно выбрать и другое название) будет содержать объект ошибки с подробной информацией о произошедшем. Таким образом, при ошибке в try скрипт не «падает», и мы получаем возможность обработать ошибку внутри catch.
Подробнее про try..catch читайте в справочниках по JavaScript или в этой статье.
Клики
Рис. 223. Встроенные переменные «Клики»
Переменные в этой категории используются для отслеживания кликов по элементам сайта. Разделить их можно на две составляющие:
● переменные, которые возвращают значения при клике по всем элементам (gtm.click);
● переменные, которые возвращают значения при клике только по ссылкам (gtm.linkClick).
Click Element – возвращает значение для того HTML-элемента, на который кликнул пользователь и
