Google Tag Manager (GTM): что это, как установить с нуля и настроить теги, триггеры и переменные

Два тёмных flat-окна редактора кода с цветными тегами и скобками

Google Tag Manager (GTM) — бесплатная система управления тегами от Google, которая позволяет добавлять, редактировать и удалять трекинг-коды на сайте без правок в исходном коде. Вместо десятка <script>-вставок для GA4, Meta Pixel, LinkedIn Insight и Hotjar — один контейнер GTM, который вы наполняете через веб-интерфейс tagmanager.google.com. Маркетолог добавляет тег для новой рекламной кампании за 5 минут — без очереди к разработчикам и без релиза.

Эта статья — полное руководство по GTM для начинающих: от установки контейнера до server-side трекинга и Consent Mode v2. Если вы ещё вставляете все <script> напрямую в шаблон сайта — мигрируйте на GTM сегодня: экономия десятков часов разработки и полный контроль над аналитикой без участия программистов.

Что такое Google Tag Manager и зачем он нужен

До появления GTM (2012 год) каждый трекинг-код устанавливали отдельно: разработчик добавлял GA-скрипт в <head>, потом Meta Pixel в footer, потом Yandex Metrica где-то посередине, потом ещё 5 рекламных пикселей — и так в 50 шаблонов CMS. Каждая правка требовала релиза: маркетолог хочет считать клики на новую CTA-кнопку → задача для разработчика → код-ревью → деплой → проверка. Неделя работы за 10 минут в голове маркетолога.

GTM решает эту проблему архитектурно: на сайте устанавливается один контейнер (два фрагмента кода в <head> и <body>), а дальше любые теги добавляются через веб-интерфейс. Маркетолог сам добавляет Meta Pixel за 2 минуты. Аналитик меняет структуру GA4-событий без участия разработчика. A/B-тест запускается без правки шаблонов.

Сценарии, где GTM критически нужен:

Запуск рекламных кампаний с пикселями (Google Ads, Meta, TikTok, LinkedIn, X) — добавлять/удалять быстро без релизов.
Настройка GA4 с кастомными событиями и Enhanced Ecommerce — прокидывать dataLayer push’и через GTM Triggers.
A/B-тестирование через VWO, Optimizely, Convert — интеграция через GTM Tag Templates.
Heatmap-сервисы (Hotjar, Microsoft Clarity, Smartlook) — добавлять/удалять за минуту.
Формы обратной связи с валидацией и отправкой в CRM.
Чат-боты (Tidio, Crisp, Intercom) — централизованная вставка скриптов.
Структурированные данные schema.org для богатых сниппетов — через Custom HTML Tag.

Архитектура GTM: контейнер, теги, триггеры, переменные

GTM работает на четырёх ключевых сущностях:

Google Tag Manager Account
└── Container (1 сайт или приложение)
    ├── Tags (что отправить)
    ├── Triggers (когда отправить)
    └── Variables (с какими данными)

Account — уровень организации. Обычно 1 аккаунт = 1 компания. Один аккаунт может содержать много контейнеров (по контейнеру на каждый сайт или проект).
Container — основная единица GTM. Один контейнер соответствует одному сайту или приложению. Контейнер имеет уникальный ID формата GTM-XXXXXXX и два фрагмента кода для установки.
Tag — фрагмент кода или конфигурации, который выполняет действие: отправляет событие в GA4, активирует пиксель, запускает JS-функцию. Каждый тег привязан минимум к одному триггеру.
Trigger — набор условий, при которых тег срабатывает: просмотр страницы, клик на кнопку, отправка формы, прокрутка, кастомное событие в dataLayer.
Variable — динамическое значение: URL текущей страницы, текст клика, значение из dataLayer, IP пользователя (через server-side).

Как установить GTM на сайт: пошаговая инструкция

Шаг 1: Создать аккаунт и контейнер

Зайдите на tagmanager.google.com под Google-аккаунтом.
Если аккаунта нет — Create Account → введите название компании, страну.
В блоке Container Setup введите название контейнера (обычно домен — example.com), выберите Target Platform — Web.
Нажмите Create, примите Terms of Service.

Шаг 2: Скопировать и установить код контейнера

GTM покажет два фрагмента кода:

Первый — в <head> (как можно выше, желательно перед другими скриптами):

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

Второй — сразу после <body> (для noscript fallback):

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Замените GTM-XXXXXXX на ваш реальный ID контейнера.

Шаг 3: Проверить установку

Очистите кеш сайта, откройте в новом окне.
Установите Google Tag Assistant (Chrome extension) — статус контейнера должен быть «Loaded».
В GTM нажмите Preview (правый верхний угол) → введите URL сайта → откроется debug-панель внизу. Если панель не появляется — контейнер установлен неправильно.

Шаг 4: Опубликовать пустой контейнер

Нажмите Submit → введите название версии (например, «Initial setup») → Publish. Только после Publish контейнер начинает работать на сайте — Preview Mode сам по себе ничего не публикует.

Теги: типы и настройка

GTM поддерживает сотни типов тегов через Tag Templates. Самые популярные:

Google Analytics: GA4 Configuration

Базовый тег для GA4 — устанавливает gtag.js на всех страницах:

New Tag → Configuration → Google Analytics: GA4 Configuration.
Measurement ID — G-XXXXXXXXXX (из GA4 Data Stream).
Trigger — All Pages.
Save → Submit → Publish.

Все автоматические события GA4 (page_view, scroll, click) теперь пишутся. Подробнее о GA4 — в нашем руководстве по настройке GA4.

Google Analytics: GA4 Event

Кастомные события (например, add_to_cart, form_submit):

New Tag → Google Analytics: GA4 Event.
Configuration Tag — ссылка на ваш GA4 Configuration Tag.
Event Name — add_to_cart.
Event Parameters — добавьте value, currency, items.
Trigger — Custom Event на add_to_cart с dataLayer.

Meta Pixel (Facebook)

Через Custom HTML Tag (готовый шаблон есть в Community Template Gallery):

New Tag → Discover more tag types → Facebook Pixel.
Pixel ID — из Facebook Events Manager.
Event — PageView, Purchase, Lead и т.д.
Trigger — All Pages для PageView, Custom Event для конверсий.

Google Ads Conversion Tracking

Для трекинга конверсий в Google Ads (нужен для Smart Bidding):

New Tag → Google Ads Conversion Tracking.
Conversion ID + Conversion Label — из Google Ads → Tools → Conversions.
Conversion Value — {{DLV - ecommerce.value}} через dataLayer.
Trigger — Custom Event на purchase или generate_lead.

Custom HTML

Для любого внешнего скрипта без готового шаблона:

New Tag → Custom HTML.
Вставьте <script>...</script> с вендорского SDK.
Trigger — All Pages или кастомный.

Custom HTML — самый гибкий и самый опасный тип: произвольный JS выполняется на вашем сайте. Перед публикацией Custom HTML тегов обязательно код-ревью.

Триггеры: 10 основных типов

Триггеры определяют, когда тег срабатывает. Самые полезные типы:

Тип триггера	Когда срабатывает	Типичное применение
Page View	Загрузка страницы	GA4 Configuration, Meta Pixel PageView
DOM Ready	DOM полностью построен	Скрипты, читающие DOM
Window Loaded	Всё (включая картинки) загружено	Heavy-скрипты, heatmaps
Click — All Elements	Клик на любой элемент	Трекинг кликов на CTA-кнопки
Click — Just Links	Клик на `<a>` тег	Outbound links, mailto, tel
Form Submission	Отправка формы	Lead-формы, контактные формы
Element Visibility	Элемент появился во viewport	Трекинг прочтения контента
Scroll Depth	Прокрутка на N% страницы	Engagement-метрики
YouTube Video	start/progress/complete	Трекинг embedded видео
Custom Event	Кастомное событие в dataLayer	Всё, что прокидывает разработчик через `dataLayer.push`

Каждый триггер имеет условия (Fire on Some) — например, «Click Just Links срабатывает только если {{Click URL}} начинается с https:// и не содержит вашего домена» — это идеальный рецепт для трекинга outbound-кликов.

Переменные: built-in и user-defined

Переменные — динамические значения, которые подставляются в теги и триггеры.

Built-in Variables

GTM имеет 30+ встроенных переменных. Самые полезные:

{{Page URL}}, {{Page Path}}, {{Page Hostname}} — текущая URL.
{{Click URL}}, {{Click Text}}, {{Click Element}} — информация о нажатом элементе.
{{Form ID}}, {{Form URL}} — об отправленной форме.
{{Scroll Depth Threshold}} — % прокрутки.
{{Video Title}}, {{Video Current Time}} — для YouTube.
{{Container ID}}, {{Container Version}} — для self-debug.

Для активации: Variables → Configure → отметьте нужные чек-боксами.

User-Defined Variables

Кастомные переменные. Самые важные типы:

Constant — статическое значение:

{{GA4 Measurement ID}} = G-XXXXXXXXXX

Data Layer Variable (DLV) — читает из dataLayer:

{{DLV - ecommerce.value}} → читает dataLayer.ecommerce.value
{{DLV - user.id}} → читает dataLayer.user.id

Custom JavaScript — функция, возвращающая значение:

function() {
  return document.title.toLowerCase();
}

Lookup Table — мапинг ключ→значение (например, ID страны → название).

Cookie — читает cookie по названию (например, _ga для client_id GA4).

DataLayer: сердце правильного трекинга

DataLayer — глобальный JavaScript-массив window.dataLayer, в который сайт пушит структурированные события. GTM ловит эти push’и через Custom Event Trigger и достаёт параметры через Data Layer Variables.

Базовый пример push’а add_to_cart для Enhanced Ecommerce GA4:

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({ ecommerce: null });  // очистка предыдущего состояния
window.dataLayer.push({
  event: 'add_to_cart',
  ecommerce: {
    currency: 'UAH',
    value: 1490,
    items: [{
      item_id: 'SKU-12345',
      item_name: 'Кожаный рюкзак',
      item_category: 'Аксессуары',
      price: 1490,
      quantity: 1
    }]
  }
});

В GTM далее:

Создайте Custom Event Trigger с Event Name = add_to_cart.
Создайте Data Layer Variable {{DLV - ecommerce.value}} (path = ecommerce.value).
Создайте GA4 Event Tag с Event Name = add_to_cart, Parameter value = {{DLV - ecommerce.value}}, Parameter currency = {{DLV - ecommerce.currency}}, Parameter items = {{DLV - ecommerce.items}}.

Готовый конструктор dataLayer push’ей — наш GA4 Event Builder.

Почему dataLayer критичен: альтернатива — скрапинг DOM (читать класс кнопки, текст элемента). Это ломается при любом редизайне. DataLayer — контракт между бэкендом и трекингом, переживающий изменения вёрстки.

Preview Mode: тестирование перед публикацией

Preview Mode — обязательный этап перед каждой публикацией. Без проверки в Preview можно задеплоить сломанный контейнер, который будет считать конверсии неправильно неделю — и обнаружить только через дисбаланс в отчётах.

Как пользоваться:

В GTM нажмите Preview (правый верхний угол).
Введите URL сайта → Connect.
Откроются два окна: ваш сайт с debug-баннером внизу + Tag Assistant в новой вкладке.
В Tag Assistant слева — хронология событий (Page View, Click, Custom Events).
Выбрав событие, справа видите: какие теги сработали (Tags Fired), какие нет (Tags Not Fired) и почему, значения всех переменных, полный state dataLayer на момент события.
Перейдите по сайту по сценарию (нажмите кнопку, отправьте форму) — новые события появятся в Tag Assistant.
Проверьте во вкладке DataLayer, что ваши push’и проходят; в Variables — что значения корректны.
Если всё ок — закройте Preview, нажмите Submit → введите название версии и описание → Publish.

Версии GTM сохраняются — в случае ошибки можно Rollback на предыдущую за один клик.

Server-side GTM: когда и зачем

Тёмный футуристичный 3D-кластер серверов с cyan и orange неоновыми соединениями

Server-side GTM (sGTM) — контейнер GTM, запускающийся на вашем сервере (обычно Google Cloud Run или self-hosted), а не в браузере пользователя. Архитектура:

Браузер → ваш sGTM endpoint (gtm.example.com)
              ↓
              ├── GA4
              ├── Meta Pixel (Conversions API)
              ├── TikTok Events API
              └── ваш CRM

Вместо того чтобы браузер отправлял 10 запросов напрямую к Google/Meta/TikTok (легко блокируется ad-blockers и Safari ITP), он шлёт один запрос на ваш gtm.example.com, а сервер уже forward’ит данные вендорам.

Преимущества sGTM:

Обход браузерных блокировок. Ваш домен — не в фильтрах ad-blockers.
First-party cookies. Безграничный retention (vs 7 дней в Safari ITP для third-party).
Очистка PII. Удалить email/phone из GA4 события перед отправкой.
Обогащение данных. Подтянуть LTV из CRM, добавить customer segment с бэкенда.
Server-side conversion APIs. Meta CAPI, TikTok Events API, LinkedIn CAPI — точнее атрибуция.
Одна нагрузка на клиентский браузер вместо 10 пикселей.

Минусы:

Хостинг $50-300/мес в Google Cloud Run (зависит от трафика).
Нужен DevOps для setup + мониторинг.
Сложнее дебаг — Preview Mode работает, но корректно интерпретировать server-side вызовы сложнее.

Когда нужен: трафик >100k/мес, высокие требования к точности атрибуции, желание уменьшить потери от Safari ITP, потребность в Conversions API от Meta/TikTok.

С марта 2024 года Google сделал Consent Mode v2 обязательным для работы Google Ads с аудиториями ЕС/ЕЭЗ/UK. Без него: ремаркетинг-аудитории пустые, Smart Bidding получает меньше сигналов, modeled conversions не работают.

Реализация в GTM:

Cookie banner (Cookiebot, OneTrust, Iubenda или кастомный) возвращает consent state пользователя.
В GTM Tag Templates → найдите Consent Mode template (или установите из Community Template Gallery, например «Consent Mode (Google tags) v2» от Simo Ahava).
Создайте Consent Initialization Tag с триггером Consent Initialization — All Pages. Установите Default Consent State (denied для ЕС, granted для других стран) для 4 типов:
- ad_storage — реклама.
- analytics_storage — аналитика.
- ad_user_data — передача данных в Google Ads.
- ad_personalization — персонализация рекламы.
Создайте Update Consent Tag, который триггерится событием cookie_consent_update с вашего banner’а — обновляет состояние после выбора пользователя.
Проверьте в Preview Mode — во вкладке Consent виден текущий статус.

Принцип работы Consent Mode v2: когда пользователь не дал согласия на cookies, GA4 не останавливает трекинг полностью — он собирает анонимные cookieless pings (без personal identifiers) и использует машинное обучение для построения modeled conversions. В отчётах вы видите комбинацию реальных и modeled данных, что уменьшает потери от высоких rejection rates в ЕС.

Версии, рабочие пространства, права доступа

GTM имеет полноценную систему контроля версий:

Workspace — параллельное пространство для работы. Команда может иметь 50 рабочих пространств, каждое со своим набором правок (например, аналитик работает в Workspace «GA4 events», маркетолог — в Workspace «Meta Pixel»). Изменения не конфликтуют до момента merge.
Version — снапшот контейнера. Создаётся при каждом Submit. Все версии сохраняются — Rollback на предыдущую за один клик.
Environment — отдельные контейнеры для Production/Staging/Dev. Можно публиковать в Staging без влияния на Production.

Роли пользователей:

Read — смотреть контейнер.
Edit — редактировать рабочее пространство (без публикации).
Approve — утверждать изменения.
Publish — публиковать в Production.

Для команд из >3 человек рекомендуется разделение Edit / Publish — чтобы один человек не задеплоил сломанные теги без ревью.

Миграция с Universal Analytics на GA4 через GTM

Universal Analytics окончательно отключён 1 июля 2024 — старые UA-теги в GTM нужно удалить или переписать. Пошагово:

Аудит UA-тегов. В GTM Tags → поиск типа ‘Universal Analytics’ → списком все legacy-теги. Сделайте скрин для архива.
Удалить или Pause UA Pageview Tag. Вместо него создайте GA4 Configuration Tag с вашим Measurement ID G-XXXXXXXXXX и триггером All Pages.
Переписать UA Event Tags. Каждый UA Event Tag (Category/Action/Label/Value) → новый GA4 Event Tag с Event Name (snake_case: purchase, add_to_cart, form_submit) и параметрами. Старые Category/Action/Label не передаются — в GA4 другая модель.
Перестроить dataLayer для Enhanced Ecommerce. UA использовал products[], GA4 — items[] с обязательными currency и value. Разработчик должен переписать push’и на checkout, product view, purchase страницах.
Настроить Key Events в GA4 интерфейсе (раньше «Conversions») — отметьте важные события переключателем «Mark as Key Event».
Подключить Google Ads к GA4 для импорта Key Events как Conversions — для Smart Bidding.
Проверить в Preview Mode + GA4 DebugView — каждое событие должно появляться в DebugView в режиме реального времени.
Удалить noscript UA-теги и fallback gtag.js, что дублируются с GTM — иначе события считаются дважды.

Подробно про GA4 архитектуру и настройку — в нашем руководстве по GA4 и GA4 Setup Checklist.

Типичные ошибки при настройке GTM

Не публиковать после Submit. Preview Mode не публикует контейнер — нажали Submit, но забыли Publish → ничего не работает на live-сайте.
Дублирование GA4 + UA + gtag.js. Если установлены и GTM, и прямой gtag.js в <head>, события считаются дважды. Выберите один способ (рекомендовано — только через GTM).
Триггер All Pages для тяжёлых скриптов. Heatmap-сервисы (Hotjar) не нужно загружать на checkout — они замедляют conversion-страницы. Исключите через триггер с условием.
Не использовать Custom Event Triggers. Если весь трекинг строится на DOM-селекторах (Click — All Elements с условием на класс) — любой редизайн ломает аналитику. Используйте dataLayer push’и.
Custom HTML без проверки. Custom HTML Tag выполняет произвольный JS на вашем сайте — без код-ревью можно занести уязвимость или сломать вёрстку.
Не исключать internal traffic. Команда заходит на сайт ежедневно → шум в отчётах. Исключите через GA4 → Data Streams → Configure tag settings → Define internal traffic.
Не настроен Consent Mode v2 для ЕС. Ремаркетинг не обновляется, Smart Bidding страдает, modeled conversions не работают.
Отсутствие версионирования и описания. Без описаний в Version Notes невозможно понять, что изменилось. Всегда пишите «Добавил GA4 purchase event с parameter value» вместо «update».

Сколько стоит GTM

Стандартный Google Tag Manager — полностью бесплатный. Без ограничений на количество контейнеров, тегов, триггеров, пользователей.

Лимиты стандартной версии:

500 тегов на контейнер.
30 версий истории (более старые сливаются).
50 рабочих пространств (workspaces).
10 контейнеров на аккаунт (можно запросить увеличение).

Платная версия Google Tag Manager 360 — часть Google Marketing Platform, от $150 000/год вместе с GA360. Нужна только крупному enterprise с:

50+ маркетологами, что параллельно правят контейнер.
Потребностью в Zone-функционале (скрыть теги от субподрядчиков).
SLA от Google.

99% бизнесов стандартной версии GTM более чем достаточно.

Server-side GTM — софт бесплатный, платите только за хостинг. Google Cloud Run цена:

Малый сайт (<50k посетителей/мес) — $50-100/мес.
Средний (50-500k) — $100-300/мес.
Большой (>1M) — $300-1000/мес.

Связанные ресурсы на сайте

Глоссарий:

Инструменты:

Чек-листы:

Руководства:

Google Analytics 4 — полное руководство

Часто задаваемые вопросы (FAQ)

Что такое Google Tag Manager простыми словами?

Бесплатный инструмент Google для добавления трекинг-кодов (GA4, Meta Pixel, Google Ads) на сайт без правок в исходном коде. Работает на трёх сущностях: теги (что), триггеры (когда), переменные (с какими данными).

Как установить GTM на сайт за 10 минут?

10 шагов: создать аккаунт на tagmanager.google.com → создать Web-контейнер → скопировать два фрагмента кода в <head> и <body> → проверить через Tag Assistant → запустить Preview → опубликовать пустой контейнер. Дальше добавляются теги.

В чём разница между тегом, триггером и переменной?

Тег — что сделать (отправить событие в GA4). Триггер — когда сделать (при клике на кнопку). Переменная — с какими данными (URL страницы, текст клика, значение из dataLayer). Каждый тег имеет минимум один триггер.

Что такое dataLayer?

Глобальный JavaScript-массив window.dataLayer, в который сайт пушит структурированные события (add_to_cart, purchase, form_submit) с параметрами. GTM ловит push’и через Custom Event Trigger. Альтернатива — хрупкий скрапинг DOM.

Какие бывают типы триггеров?

Page View, Click (All Elements / Just Links), Form Submission, Element Visibility, Scroll Depth, YouTube Video, Timer, History Change (для SPA), JavaScript Error, Custom Event (самый гибкий, через dataLayer).

Что такое Preview Mode?

Встроенный debug-режим. Нажав Preview, видите хронологию событий, какие теги сработали, значения переменных, state dataLayer. Обязательный этап перед Publish — без него можно задеплоить сломанный контейнер.

Что такое server-side GTM?

Контейнер GTM, запускающийся на вашем сервере (Google Cloud Run, $50-300/мес). Сайт отправляет события на ваш sGTM endpoint, а сервер forward’ит в GA4/Meta/TikTok. Обходит ad-blockers, даёт first-party cookies, позволяет очищать PII и обогащать данные с CRM.

(1) Подключить cookie banner; (2) Создать Consent Initialization Tag с триггером Consent Initialization — All Pages; (3) Default Consent State = denied для ЕС; (4) Update Consent Tag на события с banner’а; (5) Проверить в Preview → Consent. Обязательно для Google Ads в ЕС с марта 2024.

Как перенести Universal Analytics теги в GA4 через GTM?

Удалить все UA Pageview и Event Tags → создать GA4 Configuration Tag с Measurement ID G-XXXXXXXXXX → переписать каждый UA Event Tag в GA4 Event Tag с snake_case event name → перестроить dataLayer для Enhanced Ecommerce GA4 (items[] вместо products[]) → отметить Key Events.

Бесплатный ли Google Tag Manager?

Да, полностью бесплатный. Лимиты: 500 тегов/контейнер, 30 версий, 50 workspaces. GTM 360 — от $150 000/год вместе с GA360, нужен только для крупного enterprise. Server-side GTM тоже бесплатный как софт, платите только за хостинг.