Тригер скролінгу в Google Tag Manager

Глибина скролінгу і час, проведений користувачем на сторінці, часто застосовуються при аналізі контентних ресурсів і дозволяють сформувати висновки про те, чи подобаються відвідувачам сайту ваші статті, чи читають їх користувачі, просто переглядають по діагоналі або відразу йдуть на інші сторінки сайту.

Крім блогів і порталів новин метрика скролінгу також є важливим елементом аналізу ефективності сайту-односторінника.

Три роки тому я вже писала статтю на тему відстеження скролінгу в Google Analytics. Тоді я створювала власний скрипт для Google Tag Manager, який надсилав дані про максимальну глибину прокручування сторінки, а також точний час перебування на поточній сторінці перед її закриттям, оновленням або переходом на іншу сторінку. З того часу у функціоналі диспетчера тегів відбулися великі зміни, додалося більше вбудованих тригерів та змінних. Тому тепер налаштувати відстеження скролінгу в GTM можна без використання сторонніх скриптів. Сьогодні ми розберемося, як це зробити.

Scroll-змінні

Насамперед в інтерфейсі Google Tag Manager нам необхідно активувати змінні з блоку “Прокручування”:

  • Scroll Depth Threshold – це число, яке показує глибину прокручування. При виборі відсотків може набувати значення від 0 до 100%. При виборі пікселів ця кількість пікселів, встановлена ​​як порогова величина.
  • Scroll Depth Units – одиниці виміру глибини скролінгу (відсотки або пікселі).
  • Scroll Direction – напрямок прокручування (може бути вертикальна або горизонтальна).
Scroll-переменные в Google Tag Manager для отслеживания прокрутки - OdesSeo

Далі ми створюємо новий тригер типу “Глибина прокручування”:

Создание триггера глубины прокрутки в Google Tag Manager для отслеживания скролла - OdesSeo

У налаштуваннях тригера ми вибираємо напрямок прокручування (вертикальна або горизонтальна). В тому самому тригері можна задавати умову і для вертикального, і для горизонтального скролінгу.

Настройка триггера на вертикальную и горизонтальную прокрутку в GTM для отслеживания скроллинга - OdesSeo

Далі вказуємо глибину скролінгу (у пікселях або у відсотках), при досягненні якої має відправлятися подія. Потрібно вказати одне чи кілька чисел, розділивши їх комами. Якщо вказана глибина скролінгу входить у область перегляду під час завантаження сторінки, тригер спрацює без скрола. Також важливо враховувати, що тригер спрацьовує один раз для кожного порогового значення на сторінці. Тобто, якщо в текстовому полі для вказівки глибини скролінгу ви написали значення 70% і 90%, то тригер у цьому випадку активує тег два рази – при скролінгу сторінки до позначки 70% і досягнувши позначки 90%. Якщо після цього користувач прокрутить сторінку знизу нагору, тригер вдруге не активується.

Настройка глубины скроллинга в пикселях и процентах в GTM для отслеживания - OdesSeo

Далі потрібно створити тег надсилання даних у Google Analytics. Додаємо новий тег типу “Universal Analytics”, вибираємо тип відстеження “Подія”. В атрибутах події (категорія, дія, ярлик) ми можемо вказати змінні прокручування, які ми активували на початку.

Создание тега отправки данных в Google Analytics для отслеживания скроллинга - OdesSeo

Звертаю увагу на опцію “Не взаємодія”. Якщо вам потрібно, щоб надсилання івента впливало на показник відмов, то встановіть “false”. В іншому випадку – “true”.

Вибираємо тригер, створений раніше, як умову активації.

Выбор триггера, который создали раньше, в качестве условия активации для отслеживания скроллинга - OdesSeo

Далі включаємо відладчик GTM, переходимо на сайт і перевіряємо правильність роботи тега:

Проверка правильности работы отслеживания скроллинга через отладчик GTM - OdesSeo

Таблиця регулярних виразів

Трапляються випадки, коли потрібно реалізувати відстеження скролінгу на сайті, який має різні типи сторінок. Наприклад, на сайті є сторінки послуг, для яких ми хочемо відправляти подію прокручування при досягненні, наприклад, позначки 50% і є сторінки статей, для яких ми вважаємо оптимальним фіксувати подію скролінгу лише за значення 90%. Залежно від структури сайту, таких варіантів передачі може бути багато. Щоб не створювати під кожну групу сторінок окремий тег/тригер, ми можемо скористатися таблицею регулярних виразів. Якщо раптом ви ще не знаєте, що таке регулярні вирази і яку користь вони несуть для аналітика, рекомендую прочитати цю статтю.

Таблиця регулярних виразів приймає на вхід змінну і зіставляє її значення з шаблонами в таблиці як слідування шаблонів. Якщо знайдено відповідність, то як результат повертається значення з поля “Результат” відповідного рядка. Для скролінгу як вхідна змінна можна вказати Page URL, в текстових полях шаблонів вводимо регулярні вирази для потрібних сторінок. А в результуючих текстових полях – значення скролінгу, які мають передаватися для кожного типу сторінок. Наприклад, для сторінок блогу (за умови, що всі вони містять слово “blog” в URL), граничне значення прокручування, при якому відправиться подія, буде 90%. Для сторінок послуг, контактних даних та портфоліо (сторінки, що містять “service”, “kontakty”, “portfolio” в URL) – 40%, 60%, 80%, 100%. Для сторінок, які не відповідають жодному з шаблонів – 70% та 90%.

Таблица регулярных выражений в GTM - OdesSeo

Тепер, щоб використовувати цю змінну в тригері скролінгу, нам потрібно в його налаштуваннях замість статичних чисел вказати щойно створену змінну:

Настройка использования переменной в триггере скроллинга - указываем созданную переменную - OdesSeo

Ключова відмінність нового тригера в диспетчері тегів від рішення, яке я описувала в минулій статті, в тому, що в новому тригері відправка події відбувається в міру прокручування, тобто подія фіксується щоразу при досягненні певного значення, а не надсилання максимального значення. Скрипт з цієї статті дозволяє фіксувати максимальне значення глибини прокручування сторінки перед її закриттям, оновленням або переходом на іншу сторінку. Вибирайте те, що точніше відповідає вашим цілям. Від себе додам, що простіше, звичайно, користуватися вбудованою можливістю GTM. У такому разі немає необхідності вникати в код скрипта, і налаштування займає лише кілька кроків. Приємно бачити, що функціонал Google Tag Manager постійно розширюється і дозволяє робити круті та корисні для аналітики штуки у кілька кліків.

Вдалих налаштувань! Якщо у вас є питання за статтею, з нетерпінням чекаю їх у коментарях!