Настройка отслеживания просмотров элементов на сайте с помощью gtm

Как отследить просмотр определенного элемента на сайте? Доступность элемента в gtm.

Иногда нам нужно отслеживать увидел ли пользователь в своем браузере определенный элемент на сайте. Это может быть что угодно, отзывы, специальное предложения, форма захвата… Эти данные мы с большой вероятностью сможем легко отследить с помощью встроенного триггера в google tag manager – доступность элементов. После настройки тега в gtm, когда пользователь видит в окне браузера нужный нам элемент на странице будет срабатывать тег и передавать данные в google analytics.

На примере будем отслеживать пользователей, которые увидели форму подписки на сайте. Для этого нам нужно создать триггер с типом доступность элементов и тег, который будет передавать данные в google analytics, когда пользователь увидит форму подписки.

1.Активируем встроенные переменные

В разделе переменные /// настроить /// активируем переменные видимости

Percent Visible – проценты видимости выбранного элемента

On-Screen Duraction – продолжительность видимости выбранного элемента (миллисекунды)

2.Настраиваем триггер

Переходим в раздел триггеры /// создать /// тип триггера доступность элементов

Выбираем метод выбора: по идентификатору или через селектор элементов

Идентификатор – триггер будет срабатывать при просмотре первого атрибута id, который мы задали.

В большинстве случаев название атрибута id на странице уникальное. Вы можете использовать консоль браузера, что бы узнать атрибут id которое вам нужно для отслеживания.

Пропишем id в триггере:

Селектор элементов – триггер будет срабатывать, при просмотре определенного CSS селектора. Этот метод триггера, часто применяется, если у отслеживаемого элемента (в примере формы подписки) нет атрибута id а также если нам нужно отследить несколько элементов.

Если было бы нужно отследить форму подписки на одной странице, метод выбора по идентификатору нам подошел. Но в данном примере id формы подписки для каждой страницы будет разным, поэтому нам метод выбора по идентификатору не подходит.

Метод выбора мы запишем через селектор элементов используя class form_trena

Вы должны выбрать свой селектор исходя из структуры сайта и целей отслеживания.

Стоит отметить, что данный class единственный на странице, и атрибут class записывается в gtm через точку.

Правило запуска этого триггера: один раз на страницу

При перезагрузке страницы триггер сработает повторно, если блок формы подписки станет видимым.

В дополнительных функциях можно указать:

Выбираем минимальный процент видимости: 100% — в примере, нужно отслеживать форму, когда пользователь увидит ее полностью.

Минимальное время длительности: 2000 –в примере мы задали, что форма подписки должна отображаться в браузере не меньше двух секунд. Максимальное время длительности задается в миллисекундах.

Регистрация изменений DOM– в нашем примере не выбирается. Если мы поставим галочку, то мы сможем работать с элементами, которые подгружены динамически и могут не входить в DOM (Объектная модель документа – содержит все элементы html страницы)

Данный триггер будет срабатывать при посещении пользователя на страницы блога:

Page Path — содержит blog