Изменить стиль страницы

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

Google Tag Manager для googлят. Руководство по управлению тегами _205.png

Рис. 205. Переменные в триггерах

Например, запускать триггер «Просмотр страницы» только тогда, когда переменная «Page URL» равна значению osipenkov.ru/google-tag-manager. Или выбрав тип триггера «Клик – Все элементы», вы можете с помощью условий (переменная + фильтр + значение) активировать триггер по нажатию на определенные элементы, и т.д.

Переменные в тегах используются для получения динамических значений. Например, в Google Analytics о сумме транзакции, ID заказа, идентификаторе продукта и т.д.

Google Tag Manager для googлят. Руководство по управлению тегами _206.png

Рис. 206. Поле шаблона «Переменная»

В примере выше с помощью иконки (поле шаблона) «Переменная» для типа тега «Отслеживание конверсий AdWords» задаются значения для различных полей – идентификатор отслеживания, ярлык конверсии, ценность конверсии и т.д.

Также с переменными можно работать и в пользовательских HTML-тегах. Для этого нам необходимо использовать специальную конструкцию, заключенную в теги <script></script>. Тег <script> предназначен для описания скриптов и является контейнером для сценария, выполняющегося на стороне клиента, то есть в браузере пользователя. Как правило, тегом <script> подключают JavaScript.

Google Tag Manager для googлят. Руководство по управлению тегами _207.png

Рис. 207. Пользовательский HTML с переменной

Данный код работать не будет, поскольку он является лишь демонстрацией того, как в пользовательских HTML-тегах можно обращаться к переменным.

В GTM вызов функции переменной выполняется с помощью специального синтаксиса:

{{имя переменной}}

Переменные шаблона в Google Tag Manager, как и выражения, заключаются в двойные фигурные скобки {{ }} с обеих сторон. Данные в шаблон передаются в виде обычного объекта, переменным шаблона соответствуют свойства этого объекта.

С такой конструкцией мы с вами знакомились несколько ранее, когда устанавливали счетчики Google Analytics и Яндекс.Метрика через GTM. Там в качестве переменной выступал идентификатор отслеживания Google Analytics. Чтобы не вводить ID вручную при создании каждого тега, переменная для Universal Analytics создавалась как пользовательская. В дальнейшем, если идентификатор отслеживания GA изменится, достаточно в одном месте указать новый ID счетчика.

Google Tag Manager для googлят. Руководство по управлению тегами _208.png

Рис. 208. Пользовательская переменная с ID счетчиком Google Analytics

Примечание: как только вы начнете использовать шаблон переменной и напишите {{, Google Tag Manager предложит вам выбрать вариант из доступных переменных.

Google Tag Manager для googлят. Руководство по управлению тегами _209.png

Рис. 209. Подсказка при написании

Любопытный момент: при изменении имени переменной все ссылки на переменную автоматически обновляются. Даже те, которые вы ввели вручную в пользовательских HTML-тегах и пользовательских переменных JavaScript. Это сильно экономит время, поскольку не нужно проходить каждую ссылку и переписывать код в соответствии с новым именем переменной.

Источником информации могут быть:

● слои данных;

● переменные JavaScript;

● cookies сайта;

● Document Object Model.

В Google Tag Manager переменные делятся на две категории:

1. встроенные переменные – набор готовых, предустановленных в системе переменных;

2. пользовательские переменные – самостоятельное создание с использованием существующих типов переменных.

Встроенные переменные

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

Google Tag Manager для googлят. Руководство по управлению тегами _210.png

Рис. 210. Встроенные переменные GTM

Они включаются и отключаются путем простановки галочек (чекбоксов) напротив каждой из них.

Google Tag Manager для googлят. Руководство по управлению тегами _211.png

Рис. 211. Включение/Отключение встроенных переменных

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

В Google Tag Manager на данный момент существует 9 категорий встроенных переменных:

● Страницы

● Утилиты

● Ошибки

● Клики

● Формы

● История

● Видео

● Прокрутка

● Видимость

Страницы

Google Tag Manager для googлят. Руководство по управлению тегами _212.png

Рис. 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 это будет выглядеть так:

Google Tag Manager для googлят. Руководство по управлению тегами _213.png

Рис. 213. Пример встроенных переменных «Страницы»

Переменная Page Hostname вернула имя домена «graphanalytics.ru», Page Path содержит путь к странице в текущем URL, что соответствует «/» (главная директория), Page URL – полный URL текущей страницы «https://graphanalytics.ru/», а переход на сайт был выполнен из поиска Google, поэтому переменная Referrer вернула значение «https://www.google.ru/».