Глеб Боярский - Цифровой сад

Тег менеджер или борьба с разработчиком

время чтения ~7 мин.

Какую таблетку ты выберешь? Синюю или красную?

Х/Ф “Матрица”

Помните этот диалог из фильма? Если грубо, одна таблетка предлагала остаться на месте, вторая “меняться и менять мир на свое усмотрение”. Так вот GTM или YTM это про свободу и ответственность за свои действия в матрице веб-аналитики. Ранее любому специалисту аналитику требовалось просить разработчика внедрять коды в свой сайт, настраивать JS-события, терпеть капризы и ждать, ждать, ждать…

После появления в 2012 году GTM никто сразу не бросился работать с этим могучим инструментом, я про него услышал в 2018 году, а первый раз открыл в 2019 утонув в масштабе. Преимущества огромные, для меня это самостоятельное внедрения кода без разработчика. Да простят меня ответственные и исполнительные, я в своей жизни не работал с нормальными программистами, мне наверное не везло, но настраивать отслеживание события на клик по кнопке по 2 недели было регулярной историей.

Несмотря на то, что есть Тег Менеджеры и зависимость от программиста существенно снижается, отказаться полностью от их помощи не удастся. Есть ряд задач, которые по-прежнему будет необходимо решать вместе. Например:

  • отслеживание электронной коммерции;
  • внедрение сквозной аналитики;
  • контентная аналитика;
  • настройка идентификатора пользователя (User ID);
  • добавление пользовательских параметров и показателей;
  • внедрение уровня данных (dataLayer);
  • прочие задачи.

А еще наши “враги” разработчики любят что-то менять в коде сайта, добавлять новые кнопки и менять местами, а от этого слетают все цели, и аналитики вынуждены менять все в настройках отслеживания, тут даже Тег Менеджер не спасает, так как он работает с моделью DOM сайта, исходного кода и верстки страниц.

Любая цель и передача данных в аналитику ⬇️

Узнав, у тег менеджеров под капотом есть бесконечное количество аналитических настроек я включился в изучение инструкций и статей в интернете. Тогда не было нейросетей, и информацию по крупицам собирали в иностранных книгах, переводили, искали статьи. До сих пор отличные материалы на сайте Я. Осипенкова, он делает огромную работу 🫡 служит веб-аналитикам проводником в мире тег менеджеров и счетчиков.

Экономия времени, отслеживание любых событий, контроль версий, а/б тестирования, выход из под гнета разработчиков — это малая часть преимуществ из-за который стоит сесть за изучение данного инструмента. GTM самый мощный, он существует с 2012 года, ЯТМ существует меньше года, и в основном он будет копировать все что есть в Google, это уже заметно по структуре внутри. Я буду описывать для читателей то, что есть у тег-менеджеров подразумевая продукт Google, но все это успешно экстраполирует на продукты других компаний, в первую очередь Яндекса так как все мы с ним связаны тесно находясь в РФ.

Из чего же состоит любой тег менеджер, главные фишки

  • Переменные
    • Отвечают на вопрос: что отслеживаем и извлекаем при событии. Какое правило передаём для триггеров?
    • Переменные бывают пользовательские и встроенные
    • Для переменных существуют готовые шаблоны
    • Через переменные и DataLayer можно передавать любые данные в систему аналитики. Например: Хотим считать клики, и передать ТЕКСТ кнопки в систему аналитики
    • В режиме отладки через Tag Assistant можно посмотреть активированные переменные в разделе Variables
      • Из переменных можно забирать значения, которые передаются в контейнер, чтобы использовать их в дополнительных условиях, (например при клике на кнопку срабатывает передача информации об этом действии: текст на кнопке, css-селектор и т.д.)
      • Можно извлекать данные из URL, Cookie, время события и заголовки страниц, а так же использовать JS скрипты.
    • В переменные входит DataLayer (слой данных)
      • Это более объемная переменная через которую можно передать множество значений, например данные по электронной коммерции
        • Выглядит как кусок кода, с параметрами, похоже на запрос к API на получение метрик из аналитической системы
        • Посмотреть что есть в DataLayer можно с помощью расширения в браузере DatalayerCheker
      • С помощью техзадания программисту формируется список параметров для сбора данных. Например в интернет магазине это цена товара, название карточки, и все это фиксируется при открытии страницы и передается в систему аналитики. Так можно отследить разные свойства, например: с какой ценой чаще всего смотрят товары?
  • Триггеры
    • Это “полицейские” событий, они нажимают спусковой крючок и запускают процесс отслеживания в нужный момент. Вопросы на которые отвечают триггеры: Когда? Где?
    • Триггеры это и есть события, то что является самым важным в работе веб-аналитика, они либо запускают тег, либо блокируют его в зависимости от условия.
  • Теги
    • Данная сущность последняя в цепочке, отвечает на вопрос: Куда передавать данные?
    • Теги это транспорт, который доставляет условия из переменных и триггеров в нужную систему аналитики или рекламную платформу (VK, Google Ads и другие)
  • Режим отладки (Предварительный просмотр)
    • Важнейший раздел в тег менеджерах, который позволяет предварительно оценить работу всех тегов, триггеров и переменных. Без него оперативно вносить правки невозможно.
    • Данный режим можно передать в доступ через кнопку Share в меню, если вам нужно поделиться с другим специалистом в работе (без передачи прав на сам контейнер). 🛢️

Честно мне повезло. Я в университете прошел школу жизни в HTML, собирал сайты и правил таблицу стилей CSS, я базово понял как устроен этот мир сайтов. До программирования я не дошел, и в принципе не жалею. Но тройка HTML, CSS, JS является обязательным элементом работы с любыми менеджерами тегов.

Сегодня благодаря чат ботам нейронок можно снять страх перед этой великолепной тройкой и просто верно ставить задачу на написание скрипта или блока HTML, очень помогают базовые знания. Если же их нет, и про CSS селекторы и работу с консолью в браузере вы не слышали ничего, придется повозиться и первичные знания получить и с ними уже обратиться в Gemini — эта нейросеть идеально подходит так как она находится внутри эко системы Google, что гарантирует точные ответы по GTM. Для ЯТМ это Yandex GTP.

Еще одним плюсом работы с контейнерами является наличие готовых сетапов. За годы практики веб-аналитики со всего мира накопили множество решений по настройке тегов, и их можно легко использовать скачав в разделе шаблоны нужный файл. Я сам такое не использую, не пригодилось.

Немного технички

Для установки контейнера на свой сайт можно использовать разные способы, как вставку в собственный код если у вас позволяет это делать движок, либо через интеграцию внутри CMS платформ. Например в Тильде все делается простым копированием номера тега в разделе Аналитика и интеграцией через почту.

Еще я рекомендую с GTM работать только в браузере Google Chrome и добавить в браузер себе расширение TAG Assistant для отладки — это будет проще чем постоянно использовать предварительный просмотр в самом контейнере, а еще с помощью этого расширения можно проводить разведку по контейнерам на других сайтах, что они используют в тегах, отслеживают и передают себе в системы аналитики.

Инъекции и пользовательский HTML

Как вы понимаете, теги основанные на своих скриптах можно так же легко внедрять на сайт. Именно поэтому существует политика конфиденциальности внутри GTM и YTM, но защитить себя полностью от пауков ❌ невозможно. Нужно понимать с кем вы работаете, брать доступы к контейнеру и проверять что там настраивал специалист. Случаев воровства данных и передачи их в даркнет тысячи, можно легко собирать данные с заполненных полей в формах (а это не только пароли, и почты!) и потом собранные базы продавать как делает большинство мошенников. Об этом нужно знать ☝️, и стараться не попадаться на мутные предложения от сторонних аналитиков особенно без истории, кейсов или как минимум личного блога в соцсетях.

Рекомендую изучать тег менеджеры, использовать их для отслеживания и настроек сложных событий, за этим будущее трафика. Только создавая многоуровневые цепочки событий, отслеживая электронную коммерцию и передавая данные в счетчики можно настраивать грамотную рекламу, работать точечно по ЦА и адресно транслировать Ретаргетинг.

Вид графа

Обратные ссылки