Переменная – это объект, которому дано имя и который может принимать различные значения (вида пара “ключ-значение”). Переменные используются для хранения данных, а также если приходится несколько раз использовать одно и тоже значение в различных процессах.
В Google Tag Manager используются переменные двух типов: встроенные и пользовательские. Подробнее о переменных будет разобрано дальше. А пока разберем создание пользовательской переменной. Для этого переходим в «Переменные – Создать».
Рис. 85. Создание пользовательской переменной
Выбираем тип переменной – «Настройки Google Analytics». Эта переменная позволяет задавать настройки Google Analytics для использования с разными тегами.
Рис. 86. Тип переменной – Настройки Google Analytics
Вводим название переменной, идентификатор отслеживания (код Google Analytics) и нажимаем «Сохранить».
Рис. 87. Идентификатор отслеживания и Название переменной
Теперь нет необходимости постоянно копировать полный код Analytics. С этого момента у нас есть пользовательская переменная, которую можно использовать при внедрении тега Google Analytics.
Рис. 88. Пользовательская переменная GA ID
Переходим в меню «Теги», создаем новый тег.
Рис. 89. Создание нового тега Google Analytics
Конфигурация тега – Universal Analytics, поскольку библиотека классического Google Analytics (ga.js) сильно устарела и больше не развивается. Однако есть достаточное количество сайтов, на которых по-прежнему установлен старый код. На смену ему уже пришли analytics.js и gtag.js.
Рис. 90. Рекомендуемый тип тега – Universal Analytics
Настройки:
● Тип отслеживания – Просмотр страницы;
● Настройки Google Analytics – Выбираем нашу переменную GA ID (автоматически заключается в двойные фигурные скобки, как шаблон);
Рис. 91. Конфигурация тега
● Триггер / Условие активации тега – All Pages (на всех страницах).
Рис. 92. Триггер активации – All Pages (на всех страницах сайта)
Вводим название тега и сохраняем его. На этом настройка кода отслеживания Google Analytics через Google Tag Manager на сайт завершена.
Проверим корректность настройки кода отслеживания GA традиционным способом через сам Google Analytics без использования предварительного просмотра в отладчике. Для этого в правом верхнем углу нажимаем «Отправить» – «Опубликовать» и «Далее». Новая версия контейнера опубликована!
Теперь просто перейдем в интерфейс Google Analytics и в отчетах «В режиме реального времени» увидим наш заход. Для наглядности пометим свой переход с помощью utm-меток. Можно перейти на различные разделы и посмотреть, фиксируются ли переходы по всем страницам сайта или нет.
Рис. 93. Проверка установки кода Google Analytics в режиме реального времени
Данные передаются, тег настроен корректно. Проверить фиксацию данных также можно с помощью встроенного в GTM инструмента, который называется «Предварительный просмотр» (или режим отладки). Ему будет посвящена отдельная статья в этом руководстве, а пока установим код счетчика Яндекс.Метрика.
Установка кода Яндекс.Метрика через GTMПеред установкой кода ЯМ необходимо создать счетчик в аккаунте Яндекса и получить код отслеживания. Аналогично Google Analytics создаем новый тег. Только вместо рекомендуемого типа тега выбираем специальный – «Пользовательский HTML».
Рис. 94. Тип тега – Пользовательский HTML
Копируем код отслеживания из интерфейса Яндекс.Метрика и вставляем его в поле HTML. Не забываем про триггер – условие активации тега – All Pages (на всех страницах). Нажимаем «Сохранить».
Рис. 95. Копирование кода из Я.Метрика в Пользовательский HTML GTM
В результате мы с вами получили два тега и два кода счетчика веб-аналитики.
Рис. 96. Теги двух кодов счетчиков аналитики
Чтобы данные передавались в Яндекс.Метрика, осталось только опубликовать новую версию контейнера на сайт. Действия прежние: в правом верхнем углу нажимаем «Отправить» – «Опубликовать» и «Далее». Новая версия контейнера опубликована!
Самый простой способ проверить корректность настройки счетчика ЯМ – это обновить статус самого счетчика в списке всех счетчиков учетной записи.
Рис. 97. Счетчик Яндекс.Метрика корректно установлен
Если вместо желтого или красного значка появился зеленый, значит он корректно установлен.
Есть еще один способ проверки установки кода счетчика – это добавление к адресу страницы параметра _ym_debug со значением 1. В моем случае это https://watersports.ru/?_ym_debug=1
Далее необходимо вызвать консоль разработчика (в браузере Google Chrome кнопка «F12») и перейти на вкладку Console. Если код установлен правильно, в консоли вы увидите номер вашего счетчика и данные, которые отправляет код.
Рис. 98. Данные о просмотре страниц передаются
Плагины и расширения для браузеров
Для упрощения работы с Google Tag Manager, Google Analytics и улучшения производительности интернет-маркетолог/веб-аналитик в своей практике может использовать дополнительные инструменты – плагины и различные расширения для браузеров. Давайте разберем несколько самых популярных помощников.
Google Analytics Debugger
Расширение для браузера. Является надстройкой для консоли разработчика, в которую Debugger отправляет без изменения кода отслеживания информацию о том, что передается в Google Analytics, а также данные обо всех ошибках и сбоях. С помощью расширения можно не только проверить собственные страницы, но и узнать, как Analytics работает на других сайтах.
Рис. 99. Google Analytics Debugger
GA Debugger часто используют при решении различного рода задач. Например, при настройке целей и электронной торговли, когда необходимо фиксировать передаваемые данные.
Скачать расширение для браузера Google Chrome можно по ссылке.
Google Tag Assistant
Универсальный помощник. Расширение для браузера Google Chrome, которое позволяет записывать последовательность действий, выполняемых пользователями, поддерживает анализ тегов во многих продуктах Google – AdWords, DoubleClick, Tag Manager. Он также помогает отслеживать правильность установки кода, находить и исправлять проблемы, которые могут привести к искажению данных в ресурсах и представлениях Google Analytics.
Обладает функцией записи (Google Tag Assistant Recordings, GTAR), которая может регистрировать теги, события и взаимодействия для любой последовательности посещенных страниц или сайтов, и тех страниц, которые открывал пользователь, даже если часть из них находится за пределами основного домена.
Рис. 100. Google Tag Assistant
В моей книге «Google Analytics для googлят» и блоге osipenkov.ru есть целая статья на эту тему. Скачать расширение для браузера Google Chrome можно по ссылке.
Web Analytics Solution Profiler (WASP)
Еще одно расширение для браузера, которое позволяет обнаружить теги любого типа, их взаимосвязь между собой и визуализировать полученные данные.
WASP запоминает состояние dataLayer после того, как вы покинули страницу и перешли на следующую. Этот функционал является большим плюсом, поскольку в режиме отладки GTM не позволяет видеть, что произошло на предыдущей странице.
Другие особенности:
● обнаружение всех типов тегов, включая те, которые отправляются через POST;
● SEO информация о странице (URL, title, description, keywords, cookie и др.);
● возможность скрытия и блокировки тега;
● декодирование информации для Google Analytics и других сервисов;
● удобная визуализация, которая показывает отношения между всеми тегами с помощью связей в виде «стрелочек».
Рис. 101. WASP.inspector
Расширение предназначено для «продвинутых» пользователей. Скачать расширение для браузера Google Chrome можно по ссылке.
