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

е. {‘k.e.y’: ‘value’}).

● Версия 2 – интерпретирует точки, как иерархию. Например, dataLayer.push({‘k.e.y’: ‘value’}) будет интерпретировано три уровня: {k: {e: {y: ‘value’}}}.

● Переменная JavaScript

Рис. 270. Пользовательская переменная JavaScript

Принимает значение переменной JavaScript, имя которой указано в поле «Имя глобальной переменной». Если такой переменной не существует, вернется значение undefined.

Например, у вас на сайте в коде страницы объявлена глобальная переменная:

var namePeremen = 5

Рис. 271. Переменная namePeremen объявлена в коде сайта

В этом случае переменная JavaScript вернет значение глобальной переменной, что объявлена на странице, то есть 5 (и тип «number», «string» и т.д.):

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

● Собственный код JavaScript

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

Значение этой переменной вычисляется в браузере с помощью заданной функции JavaScript. Функция вызывается при каждом использовании переменной, возвращая ее значение.

Пользовательская переменная JavaScript должна следовать нескольким правилам:

1. скрипт должен быть размещен в функциональном блоке function() { … })

2. функция должна иметь оператор return

3. функция должна возвращать только значение.

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

Рис. 273. Пример собственного кода JavaScript

В отладчике Google Tag Manager:

Рис. 274. Пример пользовательской переменной «Собственный код JavaScript»

Вы можете вернуть любую переменную или значение, даже другие функции, другие переменные GTM или ничего (return без возврата -> undefined, неопределенное значение).

Рис. 275. Пример без возврата (неопределенное значение), return

Элементы страницы

Рис. 276. Пользовательские переменные «Элементы страницы»

Следующая категория в Google Tag Manager состоит из 3 пользовательских переменных:

● Видимость элемента – позволяет вам определить какой конкретный элемент был виден в браузере пользователя. Используется с триггером «Доступность элемента».

Значение зависит от видимости указанного элемента DOM. В качестве примера зададим селектор элемента кнопки на сайте:

Рис. 277. Селектор элемента кнопки на сайте

Тип результата «истина/ложь» (true/false) и минимальный процент видимости:

Рис. 278. Настройки в переменной «Видимость элемента»

В отладчике Google Tag Manager будет доступен следующий результат:

Рис. 279. Пример пользовательской переменной «Видимость элемента»

В случае видимости элемента в браузере при минимальном проценте видимости – true, в случае если элемент не был в поле зрения пользователя и не удовлетворяет проценту видимости – false.

● Переменная автоматического события (Auto-Event Variable)

Переменная автоматического события используется для доступа к целевому элементу действия пользовательского события (клики, ошибки, отправки формы и т.д.). Когда вы создаете новую переменную Auto-Event, вам нужно указать только тот компонент целевого элемента, к которому вы хотите получить доступ.

Рис. 280. Переменная автоматического события

Часть типов переменной совпадает со встроенными переменными (см. выше):

● Элемент = Click Element и Form Element;

● Классы элемента = Click Class и Form Class;

● Идентификатор элемента = Click ID и Form ID;

● Цель элемента = Click Target и Form Target;

● Текст элемента = Click Text и Form Text;

● URL элемента = Click URL и Form URL;

● Новый фрагмент URL истории = New History Fragment;

● Старый фрагмент URL истории = Old History Fragment;

● Новый статус истории = New History State;

● Старый статус истории = Old History State;

● Источник изменения истории = History Source.

Переменная автоматического события возвращает значение, соответствующее типу выбранного элемента. Если соответствующее автоматическое событие не было зарегистрировано, переменная возвращает значение по умолчанию (если установлено) или undefined.

● Элемент DOM

Вы можете использовать переменную для получения текстового содержимого любого элемента DOM или для извлечения значения любого атрибута элемента DOM.

Например, мы хотим получить значение текстового содержимого элемента кнопки «Заказать рекламу».

Рис. 281. Пример извлечения текстового содержимого элемента кнопки

Полный CSS-селектор у кнопки через Copy selector в браузере – #home > div > div > div > div > div > a.button.hp-button-1.slide-button.w-button.scrollingto.blue

Рис. 282. Copy selector

Создадим пользовательскую переменную в Google Tag Manager:

Рис. 283. Пример пользовательской переменной «Элемент DOM»

Примечание: в данном примере CSS-селектор очень длинный и его можно сократить. Однако цель примера не в этом, так что оставим полный селектор, скопированный из консоли разработчика.

Если задано имя атрибута, переменной будет присвоено значение атрибута элемента DOM, в противном случае в качестве значения будет использоваться текст элемента DOM. В отладчике GTM:

Рис. 284. Отображение значения кнопки в переменной «Элемент DOM»

Если элемент DOM с указанным идентификатором или CSS-селектором не найден, переменная возвращает нулевое значение (null).

Утилиты

Рис. 285. Пользовательские переменные «Утилиты»

Константа. Постоянная переменная является наглядным примером того, как переменные могут быть использованы повторно. Константа будет постоянно принимать значение из поля «Значение»:

Рис. 286. Переменная «Константа»

Чаще всего этот тип переменной используется для указания идентификатора отслеживания Google Analytics. Сохранив константу UA один раз, вам не нужно создавать его (идентификатор) каждый раз, когда вы создаете новый тег GA.

Название среды. Аналог встроенной переменной Environment Name, которая возвращает название пользовательской среды.

Рис. 287. Переменная «Название среды»

Настройки Google Analytics. Переменная возвращает набор параметров тега Universal Analytics. Используется ТОЛЬКО в теге Universal Analytics и для одновременной настройки нескольких тегов, например, для объединения своих пользовательских параметров (custom dimension) и полей.

Рис. 288. cookieDomain “auto”

Домен cookie. По умолчанию стоит auto, также, как и при отслеживании в Google Analytics, для поля cookieDomain значение auto.

Рис. 289. Код из Google Analytics

При автоматической auto конфигурации домена cookieDomain библиотека analyltics.js самостоятельно подбирает домен для хранения файлов cookie.

Дополнительные настройки:

● Поля, которые необходимо задать – доступен раскрывающийся список с доступными полями;

Рис. 290. Поля, которые необходимо задать

● Специальные параметры;

● Специальные показатели;

● Группы контента;

● Реклама – Включить функции для контекстно-медийной сети;

● Электронная торговля – Включить расширенные функции электронной торговли;

● Междоменное отслеживание;

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

Пользовательское событие

Рис. 291. Пользовательское событие

Принимает значение, равное текущему значению переменной _event. Аналог встроенной переменной Event (Утилиты).

Рис. 292. Пример пользовательского события gtm.click

Случайное число

Рис. 293. Переменная «Случайное число»

Переменная возвращает случайное число в диапазоне от 0 до 2147483647. Аналог встроенной переменной Random Number.

Таблица поиска. Тип переменной, который позволяет избежать конструкции if..else и switch-case.

Рис. 294. Таблица поиска

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

Как работает таблица поиска?

1. Задается входная переменная. Например, {{Click Element}};

2. Далее идет проверка по таблице поиска и входным данным;

3. Если переменная {{Click Element}} принимает одно из значений из таблицы, то входная переменная {{Click Element}} примет значение из поля «Результат»;

4. Если значение переменной {{Click Element}}