Google Tag Manager, он же гугл тег менеджер, — прослойка между сайтом и всем, что на него навешивают: счётчиками, пикселями, обработчиками событий. Разбираю установку, связку тегов с триггерами, работу с dataLayer через генератор кода и то, о чём в руководствах молчат: как GTM влияет на скорость и почему доступ к нему равен доступу к коду сайта.
- GTM меняет счётчики и события без правки кода сайта и без ожидания релиза.
- Через него ставят не только сервисы Google: Яндекс.Метрика заводится типом «Пользовательский HTML».
- Три сущности: тег — что сделать, триггер — когда, переменная — с какими данными.
- Свои события передаются через dataLayer.push и становятся триггерами в интерфейсе.
- Доступ к GTM равен доступу к фронтенду: через «Пользовательский HTML» выполняется произвольный код.
| Сущность | Что делает | Пример | Когда трогать |
|---|---|---|---|
| Тег | Код, который отправляет данные в сервис | счётчик Метрики, событие в GA4, пиксель VK | при подключении нового сервиса |
| Триггер | Условие, при котором тег срабатывает | клик по кнопке «Отправить», просмотр страницы /thanks/ | когда меняется логика отслеживания |
| Переменная | Значение, которое подставляется в тег | URL страницы, текст кнопки, сумма заказа | когда в событие нужны детали |
| dataLayer | Очередь данных от сайта к контейнеру | push с суммой заказа после оплаты | когда данные знает только бэкенд |
Что такое Google Tag Manager и кому он нужен
Google Tag Manager — прослойка между сайтом и всем, что на него навешивают: счётчиками, пикселями, обработчиками событий. Вместо того чтобы каждый раз просить разработчика вставить очередной фрагмент кода, ты один раз ставишь контейнер GTM, а дальше добавляешь и меняешь теги в его интерфейсе.
По-русски название пишут и «гугл тег менеджер», и «джи ти эм» — это одно и то же, сокращённо GTM.
Практический смысл для того, кто занимается сайтом: скорость правок. Поставить счётчик, добавить цель, повесить событие на кнопку — минуты вместо недели ожидания релиза. Для агентства или подрядчика это ещё и доступ: клиент даёт права в GTM, не пуская чужого человека в код сайта.
Частое заблуждение: GTM считают инструментом «для Google Analytics». Через него ставят что угодно, включая Google Analytics и Яндекс.Метрику — она в списке поддерживаемых тегов не значится, но заводится через тип «Пользовательский HTML» за пару минут. В российских проектах это самый частый сценарий использования GTM.
Установка контейнера и три сущности внутри
Установка занимает один раз и состоит из трёх шагов.
- Создай аккаунт и контейнер. Контейнер привязывается к одному сайту, идентификатор выглядит как
GTM-XXXXXXX. На аккаунт можно завести сколько угодно контейнеров. - Вставь два фрагмента. Первый — как можно выше внутри
<head>, второй — сразу после открывающего<body>. Второй нужен для браузеров с отключённым JavaScript и без него часть данных теряется. - Проверь предпросмотром. Кнопка «Предварительный просмотр» открывает сайт в режиме отладки и показывает, какие теги сработали. Пока в отладчике пусто, публиковать нечего.
| Площадка | Куда вставлять | Нюанс |
|---|---|---|
| WordPress | в header.php темы или через плагин вставки скриптов | при обновлении темы правка в файле теряется — надёжнее плагин |
| Тильда | «Настройки сайта → Ещё → HTML-код для вставки внутрь head» | второй фрагмент кладут в блок с HTML в самом верху страницы |
| Битрикс | шаблон сайта: header.php компонента | у многих шаблонов есть готовое поле для счётчиков |
| Самописный сайт | прямо в шаблон страницы | проверь, что контейнер попадает на все страницы, включая страницу спасибо |
googletagmanager.com/gtm.js — если она есть, контейнер загружается. Второй способ надёжнее: включить режим предпросмотра, он сразу скажет, видит ли он контейнер на сайте.Дальше вся работа идёт тремя сущностями, и понимание связи между ними экономит часы:
Формула простая: тег отвечает на вопрос «что сделать», триггер — «когда», переменная — «с какими данными».
Первый тег: счётчик Метрики за пять минут
Самый частый сценарий в российских проектах. Готового шаблона для Метрики в галерее GTM нет, поэтому счётчик заводится типом «Пользовательский HTML».
- Теги → Создать, тип «Пользовательский HTML», внутрь — код счётчика из Метрики целиком, вместе с тегами
<script>. - Триггер — встроенный «All Pages»: счётчик должен срабатывать на каждой странице.
- Название по правилу «сервис — что делает — где»: через полгода в контейнере будет два десятка тегов, и «тег 3 копия» найти уже не выйдет.
- Предпросмотр, и только после него публикация.
mc.yandex.ru/metrika, а после публикации сверь цифры за день с прошлой неделей. Про сами цели — в разборе целей в Яндекс.Метрике.googletagmanager.com. Для критичной аналитики надёжнее держать счётчик прямо в шаблоне, а GTM использовать для событий, целей и рекламных пикселей.События на клик без программиста
Вторая по частоте задача: отследить клик по кнопке, звонку или ссылке в мессенджер. Встроенные триггеры закрывают её без единой строки кода на сайте.
| За что цепляться | Как выглядит условие | Насколько живучее |
|---|---|---|
| Текст кнопки | Click Text содержит «Отправить заявку» | ломается при первой же правке текста |
| Класс элемента | Click Classes содержит btn-order | переживает смену текста, ломается при редизайне |
| Идентификатор | Click ID равен order-submit | самое надёжное из доступного без разработчика |
| Событие из dataLayer | Custom Event равно form_sent | живёт, пока сайт сам сообщает об успехе |
dataLayer: как передать в GTM своё событие
Встроенные триггеры GTM закрывают простые случаи: клик по ссылке, отправка формы, прокрутка. Как только нужно передать что-то своё — сумму заказа, название тарифа, факт успешной оплаты, — в дело идёт dataLayer.
Это массив, в который сайт складывает сообщения для GTM. Одна строка dataLayer.push в коде — и в интерфейсе появляется событие, на которое можно повесить любой тег.
Порядок здесь важнее синтаксиса: сначала событие должно появиться в отладчике, потом создаётся триггер, и только потом тег. Если делать наоборот, придётся отлаживать три сущности сразу и гадать, какая из них молчит.
Через этот же механизм в GTM удобно заводить цели аналитики: событие из dataLayer становится триггером, а тегом выступает вызов счётчика. Как устроены сами цели и какие бывают типы — в разборе про цели в Яндекс.Метрике.
Предпросмотр: как понять, что всё работает
Режим предварительного просмотра открывает сайт в отладке и показывает, какие теги сработали, какие условия выполнились и что лежит в dataLayer. Публиковать контейнер до этой проверки смысла нет.
| Что видно в отладчике | Что это значит | Что делать |
|---|---|---|
| Тег в списке несработавших | условие триггера не выполнилось | проверить условие и включить нужные встроенные переменные |
| Событие не появляется в dataLayer | сайт его не отправляет | проверить, вызывается ли dataLayer.push в нужный момент |
| Тег сработал дважды | два триггера или дубль тега | убрать лишний триггер, проверить прямую вставку в коде |
| Отладчик не подключается | контейнер не установлен или закрыт | проверить код на странице и блокировщики в браузере |
Версии и откат: страховка от чужих правок
Каждая публикация создаёт версию контейнера с автором и комментарием. Это одновременно история изменений и кнопка «вернуть как было».
Чего в руководствах не пишут
У GTM есть цена, о которой в руководствах обычно молчат.
Отдельно про порядок в контейнере. Через полгода работы там накапливается два десятка тегов с именами вроде «тег 3 копия». Заведи правило именования сразу: тип, площадка, действие. И раз в квартал открывай контейнер, чтобы выключить то, что уже не нужно, — это самый дешёвый способ ускорить сайт.
Шесть ошибок в контейнере
Список собран по чужим контейнерам, которые доводилось разбирать. Половина проблем с аналитикой начинается здесь.
Частые вопросы
Что такое Google Tag Manager простыми словами?
Чем GTM отличается от Google Analytics?
Можно ли поставить Яндекс.Метрику через Google Tag Manager?
Что такое dataLayer и зачем он нужен?
Замедляет ли GTM сайт?
Насколько безопасно давать доступ к GTM подрядчику?
Как проверить, что тег в GTM работает?
Как проверить, установлен ли Google Tag Manager на сайте?
Что такое googletagmanager.com в коде сайта?
Можно ли ставить счётчик и в код сайта, и в GTM одновременно?
Главное
GTM решает одну задачу: меняет аналитику и события на сайте без правки кода. Логика держится на трёх сущностях — тег, триггер, переменная, — а всё нестандартное передаётся через dataLayer. Помни про обратную сторону: контейнер тянет за собой все теги внутри, поэтому раз в квартал его надо чистить, а доступ к нему выдавать так же осторожно, как доступ к админке.
Собери код события генератором выше и проверь его предпросмотром до публикации контейнера. Нужна аналитика, по которой видно деньги, — разберём на консультации.