Магия google tag manager на примере реальных кейсов
TRANSCRIPT
МАГИЯ GOOGLE TAG MANAGER
НА ПРИМЕРЕ РЕАЛЬНЫХ КЕЙСОВ
Дмитрий Сульман
Пару слов о GTM
Код контейнера, ставится один раз на все страницы сайта
Для передачи данных внутрь GTM используется специальный JS-объект dataLayer
Установка на сайт
• Теги – фрагменты кода, которые внедряются на сайт • Шаблонные (например, для GA)• Custom HTML
• Триггеры – условия активации тегов• Загрузка страницы с заданным URL• Клики по элементу/ссылке с заданным id/class/href/…• Submit формы с заданным id/class/action/...• Другие системные события: timer, historyChange, pageError• События dataLayer
• Переменные – пары «ключ-значение», могут использоваться в триггерах, в тегах, в других переменных• Встроенные: Page URL, Page Host, Referrer, …• Встроенные событийные: Click ID, Click URL, Click Classes, Form
URL, ...• Пользовательские: dataLayer, DOM element, custom JS, …
Структура контейнера
Контур.ЖурналКЕЙС №1
• Аудитория: малый/средний бизнес
• Ежемесячно публикуется до 30 статей
• Всего опубликовано более 800 статей
• В месяц ~ 200 000 просмотров страниц Журнала
• Более 50 авторов в штате и на аутсорсе
Контур.Журнал
• Какие авторы наиболее читаемые?
• Как читатели взаимодействует со статьями разных авторов?
• Какие авторы лучше вовлекают читателей в серфинг по сайту?
• Какие авторы лучше генерируют заявки на продукты?
Эффективность авторов?
Позволяет объединять отдельные страницы в группы:• По признаку в URL
• По признаку в Title
• Через код отслеживания
Решение: Content Grouping
Позволяет объединять отдельные страницы в группы:• По признаку в URL
• По признаку в Title
• Через код отслеживания
Решение: Content Grouping
Ищем HTML-код элемента
Настраиваем переменную и тег
Результат
Рисунок
Отказ – сеанс с одним взаимодействием
Показатель отказов =
Показатель отказов
Что является «отказом» для статьи журнала?
Мы решили, что НЕ «отказ» – это одновременное выполнение 2-х условий:1. Просмотр страницы статьи не менее 30 секунд2. Совершение скроллинга
Правильный показатель отказов
1. HTML-тег. Активируем только на страницах статей. Тег содержит JS-функцию, которая при выполнении указанных 2-х условий активирует dataLayer-триггер:
2. Тег события GA. Активируем при наступлении dataLayer события ‘GAEvent’. Категорию и действие события берем из переменных dataLayer.
www.simoahava.com/analytics/track-adjusted-bounce-rate-universal-analytics/
Настраиваем теги
Настраиваем теги
Результат
Воронка заявкиКЕЙС №2
Форма заявки на продукт
Воронка заявки
Проблема: визуализацию воронки можно настроить только для целей типа «Просмотр страницы».
А что, если цель – это событие отправки заявки через AJAX?
Решение: вместе с событием генерируем виртуальный просмотр страницы и настраиваем цель на него.
Нужно придумать виртуальный URL вида www.site.ru/feedback/complete
Визуализация воронки
Настраиваем тег
Результат
Enhanced EcommerceКЕЙС №3
Поведение покупателей
Списки товаров
Список товаров – любой блок с ссылками на продукты (страница «Все продукты», промоблок на главной и т.д.)Страница товара – страница с описанием продуктаДобавление товара в корзину – переход к форме заявки на продуктПереход к оформлению заказа – старт ввода данных в форму заявкиОтправка заказа – отправка формы заявки
Цену передавать необязательно!
А если сайт не Ecommerce?
Варианты внедрения
Немного JS-кода