Що таке Google Tag Manager: як налаштувати і навіщо потрібен вашому сайту
Коротко
- → GTM — безкоштовний «щиток» для скриптів на сайті: додаєте, вмикаєте і вимикаєте теги відстеження без зміни коду і без розробника
- → Три поняття: теги (що відстежувати — GA4, Ads, Pixel), тригери (коли — клік, завантаження, відправка форми), змінні (які дані передавати — URL, текст кнопки)
- → Обов'язкові теги для бізнес-сайту: GA4 конфігурація, Google Ads конверсії, Meta Pixel (якщо є реклама), події форм і телефонних кліків
- → Типові помилки: дублювання GA4 (і в GTM, і в коді), неправильні тригери (all pages замість конкретної сторінки), забутий preview-режим перед публікацією
Що таке Google Tag Manager
Google Tag Manager (GTM) — це безкоштовний інструмент від Google, який дозволяє додавати, редагувати і видаляти скрипти відстеження на сайті без зміни коду. Замість того щоб кожен раз просити розробника вставити новий скрипт — ви робите це самі через зручний інтерфейс.
Аналогія: уявіть електричний щиток у квартирі. Замість того щоб кожен раз викликати електрика для підключення нового приладу — ви самі вмикаєте і вимикаєте автомати. GTM — це такий щиток для скриптів на сайті.
В GTM ви працюєте з трьома поняттями: теги (що саме відстежувати — GA4, Google Ads, Meta Pixel), тригери (коли спрацьовувати — при завантаженні сторінки, кліку на кнопку, відправці форми) і змінні (додаткові дані — URL сторінки, текст кнопки, значення поля).
Навіщо GTM, якщо є Google Analytics
Google Analytics 4 і GTM — це різні інструменти, які доповнюють один одного. GA4 — це куди приходять дані (звіти, графіки, аналіз). GTM — це як дані туди потрапляють (механізм доставки).
Без GTM ви підключаєте GA4 напряму в код сайту. Це працює, але має обмеження, які я постійно бачу у клієнтів.
Кожна зміна — це зміна коду
Хочете додати відстеження кліку на кнопку «Замовити»? Без GTM — правити JavaScript, тестувати, деплоїти. Це мінімум кілька годин роботи розробника. З GTM — 5 хвилин у браузері, навіть без знання коду. Я налаштовую клієнтам по 3–5 нових подій за раз, і жодного разу не торкаюсь коду сайту.
Кілька систем відстеження в одному місці
GA4 + Google Ads + Meta Pixel + TikTok Pixel — без GTM це 4 окремих скрипти, розкидані по коду сайту. Додати новий — знову до розробника. З GTM — один контейнер, все всередині, все на одному екрані. Зручно і для маркетолога, і для мене як розробника.
Версіонування і відкат
GTM зберігає історію всіх змін. Зламали щось — відкотились до попередньої версії за 30 секунд. Без GTM зламаний скрипт аналітики може непомітно псувати дані тижнями, поки хтось не звернне увагу на дивні цифри.
Режим попереднього перегляду
Перед публікацією можна перевірити, чи правильно працюють теги, — без впливу на реальних відвідувачів. Це як staging-середовище, але для аналітики. Я завжди тестую теги в Preview Mode перед публікацією — і раджу це кожному.
Коротко: GA4 можна використовувати без GTM, але GTM робить роботу з аналітикою набагато зручнішою і гнучкішою. Якщо ви плануєте запускати рекламу в Google — GTM стане обов'язковим інструментом.
Хочете знати що гальмує ваш сайт?
SEO-аудит — знайду технічні проблеми і дам план виправлень
Як встановити GTM на сайт
1. Створіть акаунт GTM
Зайдіть на tagmanager.google.com і натисніть «Створити акаунт». Вкажіть назву компанії, країну (Україна), назву контейнера (зазвичай — домен сайту) і тип платформи — «Веб».
2. Отримайте код контейнера
Після створення GTM видасть два фрагменти коду. Перший — JavaScript, який потрібно вставити якомога вище в секцію <head>. Другий — <noscript> частина, яка вставляється одразу після відкриття <body>.
3. Встановіть код на сайт
Це єдиний раз, коли потрібно редагувати код сайту. Після встановлення контейнера — все інше робиться через інтерфейс GTM. Для WordPress можна використати плагін (наприклад, GTM4WP) або вставити код вручну в шаблон header.php.
4. Перевірте роботу
Натисніть «Попередній перегляд» у GTM. Відкриється ваш сайт з панеллю Tag Assistant внизу. Вона показує які теги спрацювали, які — ні, і чому. Якщо бачите повідомлення «Container Loaded» — GTM встановлено правильно.
Тригери і змінні: як це працює
Тригери
Тригер визначає коли тег спрацює. Найпростіший — завантаження сторінки: тег запускається при кожному відкритті будь-якої сторінки або конкретної URL. Саме його використовують для базового трекінгу GA4 і піксела.
Для відстеження дій користувача є тригери на клік (спрацьовує при натисканні на елемент — можна фільтрувати за класом, ID чи текстом кнопки), відправку форми (для відстеження заявок і реєстрацій) і прокрутку сторінки (спрацьовує коли відвідувач дійшов до 25%, 50%, 75% чи 100% сторінки).
Для складніших сценаріїв є тригер таймера (спрацьовує через певний час на сторінці — для відстеження залученості) і тригер спеціальної події, який запускається через JavaScript-код dataLayer.push(). Саме через dataLayer я підключаю кастомні події на сайтах клієнтів — наприклад, коли кошик оновлюється динамічно без перезавантаження сторінки.
Змінні
Змінні — це дані, які передаються разом з подією. GTM має вбудовані змінні (URL сторінки, заголовок, реферер, текст кліку) і дозволяє створювати власні.
Приклад: користувач натиснув кнопку «Замовити аудит». Тригер — клік. Змінні, які передаються в GA4: текст кнопки («Замовити аудит»), URL сторінки (звідки натиснули), CSS-клас кнопки (для ідентифікації). В GA4 це стає подією cta_click з параметрами — і ви бачите яка кнопка на якій сторінці приводить найбільше заявок.
Типові помилки при роботі з GTM
Я регулярно аудитую GTM-контейнери і бачу одні й ті самі проблеми. Ось найпоширеніші.
Подвійне відстеження
Встановили GA4 через GTM, але забули видалити старий код GA4 із сайту. Результат — кожна подія рахується двічі, показник відмов падає до нуля, дані повністю непридатні для аналізу. Це найчастіша помилка, і я бачу її приблизно у кожного третього клієнта, який «сам налаштував аналітику».
Публікація без тестування
Додали тег, натиснули «Опублікувати» без перевірки в режимі Preview. Тег або не спрацьовує взагалі, або спрацьовує на всіх сторінках замість однієї. Завжди перевіряйте через Tag Assistant перед публікацією — це займає 2 хвилини і рятує від годин пошуку проблеми.
Занадто багато тегів
GTM дає свободу, і люди починають додавати все підряд. Але кожен тег — це JavaScript, який виконується при кожному завантаженні сторінки. 20+ тегів помітно сповільнюють завантаження. Для малого бізнесу 5–10 тегів — максимум, який реально потрібен.
Хаос в іменуванні
Теги з назвами «Tag 1», «Copy of Tag 3», «test» — через місяць ніхто не розуміє, що робить який тег. Я використовую шаблон: «GA4 — подія — cta_click», «Ads — конверсія — form_submit». Так навіть через рік видно, що це за тег, без відкривання кожного окремо.
Ігнорування Consent Mode
GTM налаштований, теги працюють, але без cookie-згоди — для відвідувачів з ЄС це порушення GDPR і ризик штрафу. З 2024 року Google вимагає Consent Mode v2 для всіх сайтів, які використовують GA4 і Google Ads з європейським трафіком.
Коли GTM не потрібен
GTM — потужний інструмент, але не кожному сайту він потрібен. Є ситуації, де він додає зайву складність без реальної користі.
Тільки GA4, без реклами
Якщо вам потрібен лише базовий трекінг GA4 і ви не плануєте запускати рекламу — простіше вставити код GA4 напряму. Один скрипт, без додаткового шару. На своїх невеликих проєктах я іноді так і роблю — коли знаю, що реклами не буде.
Сайт на конструкторі
Tilda, Wix, Squarespace мають вбудовані поля для GA4 і піксела. GTM там додає непотрібну складність, а іноді навіть конфліктує з внутрішніми скриптами конструктора. Якщо у вас сайт на конструкторі — використовуйте його вбудовані інструменти.
Немає людини для підтримки
GTM без розуміння — це теги, які ніхто не оновлює, не перевіряє і не розуміє. Краще простий, але робочий трекінг, ніж складний, але покинутий. Я бачив контейнери з 30+ тегами, з яких половина давно не працювала, а решта дублювала одне одного.
GTM стає обов'язковим, коли у вас 2+ системи відстеження, ви запускаєте рекламні кампанії, потрібні кастомні події (кліки на конкретні кнопки, перегляд певних секцій), або маркетолог хоче керувати трекінгом без залучення розробника.
Часті запитання
Сам контейнер GTM додає мінімальне навантаження — близько 30-80 КБ. Але кожен тег всередині — це додатковий JavaScript. Якщо у контейнері 5 тегів — вплив мінімальний. Якщо 30 — сайт помітно сповільниться. Тримайте тільки потрібні теги і регулярно видаляйте зайві.
Встановити контейнер на сайт — потрібен розробник (одноразово). Після цього додавати теги GA4, Google Ads, Meta Pixel — може маркетолог без знання коду. Для складних кастомних тегів і тригерів (dataLayer, регулярні вирази) — знадобиться технічний спеціаліст.
Ні. GA4 — це система аналітики, яка збирає і показує дані про відвідувачів. GTM — це система управління тегами, яка допомагає встановити GA4 та інші скрипти на сайт. GTM — транспорт, GA4 — пункт призначення. Можна використовувати GA4 без GTM, але не навпаки.
Технічного ліміту немає, але практичний — є. Рекомендація: до 15-20 тегів для малого і середнього бізнесу. Якщо тегів більше — перевірте чи всі дійсно використовуються. Непотрібні теги — це зайве навантаження на сайт і ускладнення контейнера.
Три кроки: 1) Створіть тег GA4 Configuration в GTM з вашим Measurement ID. 2) Опублікуйте контейнер GTM. 3) Видаліть старий код GA4 з сайту. Важливо: не видаляйте старий код до публікації GTM-контейнера — щоб не було періоду без відстеження. І перевірте в режимі попереднього перегляду що тег спрацьовує.
Встановлення контейнера + базові теги (GA4, Google Ads, Meta Pixel, Consent Mode) — від 2 000 до 5 000 грн одноразово. Складніше налаштування з кастомними подіями (dataLayer, Enhanced Ecommerce, CRM-інтеграція) — від 5 000 до 15 000 грн. Це інвестиція, яка окупається коректними даними для реклами. Порахуйте вартість у калькуляторі.
Так, і це один з найпростіших варіантів. Є офіційний плагін Site Kit від Google, який встановлює GTM-контейнер автоматично. Або можна вставити код вручну в header.php — це 2 хвилини. Для WooCommerce додатково знадобиться dataLayer для відстеження e-commerce подій (покупки, додавання в кошик). Без GTM це потребувало б правки десятків файлів теми.
Не знайшли відповідь?
Висновок
Google Tag Manager — це єдина точка управління всіма скриптами відстеження на сайті. Він не замінює GA4, а доповнює його: дає гнучкість, версіонування, режим тестування і незалежність від розробника для маркетингових завдань.
Для бізнесу з платною рекламою GTM — обов'язковий інструмент. Для простого сайту з одним GA4 — необов'язковий, але корисний для масштабування в майбутньому.
Потрібно налаштувати GTM, підключити GA4, Google Ads і конверсії? Замовте аудит — перевірю поточну аналітику і налаштую все правильно з першого разу.
