Рис. 343. Триггер «Глубина прокрутки»
● Глубина вертикальной прокрутки в процентах – 10, 25, 50, 75, 90 (пример);
● Глубина горизонтальной прокрутки в пикселях – 100 (пример);
● Условия активации триггера – Все страницы.
Как правило, данный триггер используется в связке со встроенными переменными из блока «Прокрутка»: Scroll Depth Threshold, Scroll Depth Units, Scroll Direction.
Рис. 344. Триггер «Доступность элемента»
Доступны следующие настройки:
Метод выбора:
● Идентификатор (id);
Рис. 345. Метод выбора – id
В большинстве случаев название атрибута id на странице уникальное.
● Селектор CSS
Рис. 346. Метод выбора – Селектор CSS
Применяется, если у отслеживаемого элемента нет атрибута id, а также если нам нужно отследить несколько элементов.
Например, у нас на сайте есть несколько форм отправки. У каждой из них есть свой уникальный id. Отслеживание всех форм через «Идентификатор» нам бы не подошло. А вот привязать метод выбора через «Селектор CSS» элементов вполне можно.
Совет: если не знаете, за что зацепиться, а нужно прослушивать конкретный элемент – цепляйтесь за его CSS-селектор. Получить его легко можно через консоль разработчика (в браузере Google Chrome вызывается через клавишу F12, см. скриншот выше).
Рис. 347. Правило запуска триггера
● Один раз на страницу – если несколько элементов на странице сопоставляются идентификатором или CSS-селектором, этот триггер запускается только один раз, когда первый из них отображается на этой странице.
При перезагрузке страницы триггер сработает повторно;
● Один раз на элемент – если несколько элементов на странице сопоставляются CSS-селектором, этот триггер будет запускаться когда каждый из них будет видимым на этой странице в первый раз. Если несколько элементов на странице имеют одинаковый идентификатор, только первый согласованный элемент будет запускать этот триггер;
Если на странице несколько форм, по которым по заполнения информации всплывает одно и то же сообщение, используйте эту настройку.
● При каждом появлении элемента на экране – в этом случае триггер срабатывает каждый раз, когда соответствующий элемент становится видимым.
Минимальный процент видимости – какой процент выбранного элемента должен быть виден на экране для срабатывания триггера. Можно использовать собственную переменные.
Рис. 348. Минимальный процент видимости
Укажите минимальное время видимости – как долго выбранный элемент должен быть виден на экране для срабатывания триггера. Время периодов видимости на одной странице суммируется. Например, если элемент был виден в течение 4000 мс (4 секунд), затем скрыт из видимости окна браузера и после этого снова виден в течение 2000 мс, то общее время видимости этого элемента составит 6 000 мс.
Рис. 349. Минимальное время видимости
Если галочку не ставить, то время видимости для срабатывания триггера не будет играть роли.
Регистрация изменений DOM – настройка отслеживает элементы, которых изначально нет на странице, которые подгружены динамически и могут не входить в DOM (Объектная Модель Документа). Например, всплывающие формы. Если у вас есть на сайте есть такой контент, поставьте галочку, и такие элементы будут регистрироваться.
Рис. 350. Регистрация изменений DOM
Рис. 351. Триггер «Отправка формы»
Триггер аналогичен настройкам другого триггера «Клик – Только ссылки». Можно использовать со специально встроенными переменными: Form Element, Form Classes, Form Target, Form URL, Form Text.
Рис. 352. Триггеры «Другое»
● Изменение в истории – срабатывает событие gtm.historyChange если изменился фрагмент URL (хэш, #). Как правило, используется на сайтах, контент которых подгружается динамически, без перезагрузки страниц;
В GTM можно использовать со встроенными переменными: New History Fragment, Old History Fragment, New History State, Old History State, History Source.
● Ошибка JavaScript – срабатывает событие gtm.pageError если происходит неперехваченное исключение JavaScript (window.onError);
В случае, если в JavaScript мы используем конструкцию «try..catch», то GTM не зафиксирует ошибку. Также триггер не будет сигнализировать об ошибках, которые произошли до загрузки кода Диспетчера тегов. Можно использовать со встроенными переменными Google Tag Manager: Error Message, Error URL, Error Line, Debug Mode.
● Пользовательское событие – срабатывает событие event, которое отправили с помощью конструкции dataLayer.push({'event': 'event_name'});
Пользовательские события позволяют отслеживать те взаимодействия, для которых не подходят стандартные методы. Например, отслеживание отправки формы с переопределением события submit.
Допустим мы хотим отправлять событие на уровень данных при нажатии кнопки «Отправить заявку». Для этого добавим код: dataLayer.push({'event': ‘button1-click’})
Рис. 353. dataLayer.push({'event': ‘button1-click’})
где button1-click – название пользовательского события;
Далее необходимо создать тег, а в настройках триггера «Пользовательское событие» задать название button1-click и условие активации – «Все специальные события». При необходимости можно использовать регулярные выражения.
Рис. 354. Пользовательское событие button1-click
Когда пользователь нажмет кнопку, на уровень данных будет отправлено пользовательское событие со значением button1-click. Затем GTM определит button1-click как значение пользовательского события и активирует тег.
Рис. 355. Событие button1-click
В dataLayer.push() можно добавить не только одну переменную вида «ключ=значение», но и целый массив. А чтобы посмотреть порядок в котором события передаются на уровень данных, откройте консоль JavaScript в веб-браузере и введите dataLayer: