Створюємо цифрові рішення, які працюють на бізнес
Сайт може отримувати трафік і заявки, але бізнес не завжди бачить, які сторінки, кнопки та рекламні кампанії дали результат. Часто на сайті встановлено лише базовий лічильник: він рахує перегляди, але не пояснює, скільки людей надіслали форму, натиснули номер телефону, почали оформлення замовлення або завершили покупку.
Google Tag Manager, або GTM, допомагає централізовано керувати аналітичними та рекламними тегами. Через один контейнер команда може підключати Google Analytics 4, Google Ads, пікселі, події та інші інтеграції, тестувати їх у Preview і публікувати версії з історією змін. Але GTM не замінює аналітику й не робить вимірювання автоматично: спочатку потрібен план подій і коректна технічна реалізація.
Якщо аналітична система ще не створена, почніть з окремої інструкції як налаштувати Google Analytics 4, а потім використовуйте цей гайд для керування тегами й передавання подій.
GTM — це система керування тегами. Вона завантажує на сайт контейнер, усередині якого зберігаються правила запуску інших тегів. Основні складові:
| Елемент | Що робить | Приклад |
|---|---|---|
| Контейнер | об’єднує налаштування конкретного сайту | GTM-XXXXXXX |
| Тег | передає дані в сервіс або запускає код | Google tag, GA4 Event, Google Ads Conversion |
| Тригер | визначає, коли спрацьовує тег | перегляд сторінки, клік, custom event |
| Змінна | підставляє динамічне значення | URL, текст кнопки, сума покупки |
| dataLayer | структуровано передає дані зі сайту в GTM | purchase, value, items |
| Workspace | робоча область із неопублікованими змінами | нове налаштування форми |
| Version | зафіксований стан контейнера | реліз аналітики 1.2 |
GTM зменшує кількість ручних правок коду для типових інтеграцій, але не скасовує участі розробника. Стабільне відстеження авторизації, AJAX-форм, кошика, варіацій товару або оплати часто потребує подій із самого застосунку через dataLayer.
Ці продукти виконують різні ролі:
GTM керує тегами та умовами їх запуску;
GA4 збирає, обробляє й показує аналітичні дані;
Google Ads використовує конверсії для звітів, аудиторій та оптимізації реклами;
сайт або dataLayer повідомляє, що саме зробив користувач і з якими параметрами.
Проста аналогія: сайт створює сигнал, GTM маршрутизує його, GA4 аналізує, а Google Ads використовує для оцінки та оптимізації кампаній. Помилка на будь-якому етапі викривляє результат.
Перед створенням контейнера зберіть:
доступ до домену, CMS або коду сайту;
доступ до Google Analytics і Google Ads;
список доменів та піддоменів;
перелік форм, номерів телефону, месенджерів і CTA;
сценарій покупки або бронювання;
список конверсій і допоміжних подій;
правила cookie та згоду користувача;
відповідальних за GTM, сайт і рекламу;
тестові заявки й замовлення, які можна безпечно провести.
Окремо складіть measurement plan — таблицю того, що бізнес хоче вимірювати.
| Бізнес-ціль | Подія | Параметри | Конверсія | Перевірка |
|---|---|---|---|---|
| Заявка | generate_lead |
form_name, page_location |
так | успішне надсилання |
| Дзвінок | click_phone |
link_url, page_location |
залежить | клік по tel: |
| Початок покупки | begin_checkout |
value, currency, items |
ні | відкриття checkout |
| Покупка | purchase |
transaction_id, value, currency, items |
так | підтверджене замовлення |
| Перегляд кейсу | view_case |
case_name |
ні | відкриття сторінки кейсу |
Не позначайте конверсією кожен клік. Основна конверсія має відображати цінну бізнес-дію, інакше рекламні алгоритми оптимізуватимуться під легкі, але слабкі сигнали.
Відкрийте tagmanager.google.com і увійдіть у корпоративний Google-акаунт.
Створіть акаунт GTM для компанії.
Вкажіть країну та назву організації.
Створіть контейнер для сайту й виберіть тип Web.
Використайте зрозумілу назву, наприклад основний домен.
Додайте робочі корпоративні акаунти з мінімально необхідними правами.
Google рекомендує створювати один вебконтейнер для одного сайту або вебзастосунку, а не окремий контейнер для кожної сторінки. Якщо бізнес має незалежні сайти з різними командами та логікою, їм можуть знадобитися окремі контейнери.
Не реєструйте критичну аналітику лише на особисту пошту підрядника. Власник бізнесу повинен мати адміністративний доступ і розуміти, хто може публікувати зміни.
Після створення GTM показує два фрагменти коду:
JavaScript-фрагмент потрібно вставити якомога вище в <head>;
блок <noscript> — одразу після відкривального <body>.
Код має бути присутній на всіх сторінках, де потрібне вимірювання. Не змінюйте ідентифікатор контейнера й не копіюйте кілька однакових контейнерів без необхідності.
Найбезпечніші варіанти:
інтеграція в тему або дочірню тему;
перевірений плагін із правильними позиціями head/body;
централізований модуль у власній темі;
серверне або платформне підключення, якщо воно вже передбачене архітектурою.
Після оновлення теми код не повинен зникнути. Не вставляйте одночасно GA4 через тему, плагін, Elementor і GTM: дубльований Google tag створює повторні перегляди та події.
Для повної ecommerce-аналітики недостатньо встановити контейнер. Потрібно передавати товар, список, купон, валюту, ціну, кількість і transaction_id на відповідних етапах. Готовий плагін може прискорити запуск, але його dataLayer потрібно перевірити на вашій темі, checkout і способах оплати.
Розробник додає обидва фрагменти GTM у глобальний шаблон і реалізує стабільні dataLayer.push() у моменти, коли застосунок точно знає про успішну дію. Для SPA потрібно окремо контролювати віртуальні перегляди та зміну маршруту.
Відкрийте контейнер і натисніть Preview. Tag Assistant підключиться до сайту й покаже, чи завантажився контейнер, які події відбулися, які теги спрацювали та які не спрацювали.
Перевірте:
контейнер визначається на всіх основних шаблонах;
немає другого контейнера з тим самим або чужим ID;
Google tag спрацьовує один раз на перегляд;
consent state відповідає вибору cookie;
тест не блокується кешем, CSP або розширенням браузера;
події з’являються у правильній послідовності;
DebugView GA4 отримує тестові події.
Preview — це не формальність. За офіційною документацією, режим дає змогу протестувати чернетку контейнера до публікації та побачити порядок спрацювання тегів.
У контейнері створіть Google tag із Measurement ID формату G-XXXXXXXXXX. Для базового налаштування тригером зазвичай є All Pages. Після цього:
увімкніть Preview;
відкрийте кілька сторінок;
перевірте запуск Google tag у Tag Assistant;
перевірте Realtime або DebugView у GA4;
переконайтеся, що старий код GA4 не дублює вимірювання;
створіть версію й лише потім опублікуйте контейнер.
Measurement ID — це не ID контейнера GTM. GTM-... ідентифікує контейнер, а G-... — потік даних GA4.
успішне надсилання кожної форми;
клік по телефону, email і месенджеру;
відкриття квізу або калькулятора;
завершення ключового кроку квізу;
завантаження прайсу чи презентації;
бронювання консультації;
взаємодія з кейсом;
перехід до сторінки подяки.
view_item_list;
select_item;
view_item;
add_to_cart;
remove_from_cart;
view_cart;
begin_checkout;
add_shipping_info;
add_payment_info;
purchase;
refund за наявності інтеграції.
Використовуйте рекомендовані GA4-назви та параметри там, де вони відповідають дії. Це допомагає стандартним звітам і зменшує хаос у назвах.
внутрішній пошук;
підписка;
завантаження файлу;
перегляд відео;
перехід до автора або тематичної сторінки;
глибина скролу лише як допоміжний сигнал;
вихідний клік до важливого партнера.
Найпоширеніша помилка — вважати клік по кнопці «Надіслати» успішною формою. Користувач може не заповнити обов’язкове поле, отримати помилку або натиснути кнопку кілька разів. Надійна подія повинна запускатися після підтвердженої відповіді сервера або появи унікального стану успіху.
Для AJAX-форми найкращий варіант — щоб код форми після успішного надсилання виконав:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'generate_lead',
form_name: 'project_request'
});
У GTM створюють Custom Event Trigger з назвою generate_lead, змінну Data Layer Variable для form_name і GA4 Event tag. Не передавайте у параметрах email, телефон, ім’я чи текст повідомлення: персональні дані не повинні потрапляти в аналітичні системи.
Для телефонів використовуйте посилання tel:, для пошти — mailto:. У GTM можна створити тригер Just Links з умовою:
Click URL starts with tel:;
Click URL starts with mailto:.
Події можна назвати click_phone і click_email, передаючи link_url та page_location. Але клік по номеру не доводить, що дзвінок відбувся. Для точного обліку дзвінків потрібен колтрекінг або інтеграція телефонії.
dataLayer — глобальний масив JavaScript, через який сайт передає в GTM структуровані події й параметри. Замість пошуку значення в тексті сторінки GTM отримує готові дані з бізнес-логіки.
Приклад покупки:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'purchase',
ecommerce: {
transaction_id: 'ORDER-1048',
value: 2490,
currency: 'UAH',
items: [
{
item_id: 'SKU-15',
item_name: 'Product name',
price: 2490,
quantity: 1
}
]
}
});
Подія purchase має передаватися після підтвердження замовлення, а transaction_id — бути унікальним. Інакше перезавантаження сторінки подяки може створити дублікати доходу.
Google рекомендує не перезаписувати window.dataLayer після завантаження GTM. Ініціалізуйте його через window.dataLayer = window.dataLayer || [], далі використовуйте push() і дотримуйтеся однакового регістру назв.
Для однієї події логіка виглядає так:
сайт відправляє dataLayer.push();
GTM бачить ключ event;
Custom Event Trigger реагує на точну назву;
Data Layer Variables читають параметри;
GA4 Event tag передає назву та параметри;
GA4 обробляє подію;
потрібна подія позначається як key event;
за потреби конверсія імпортується або передається в Google Ads.
Називайте елементи системно, наприклад:
GA4 - Event - Generate Lead;
Trigger - CE - generate_lead;
DLV - form_name;
Google Ads - Conversion - Purchase.
Зрозумілі назви спрощують аудит, передачу проєкту та пошук помилки через кілька місяців.
У Google Ads створіть дію-конверсію, отримайте Conversion ID і Conversion Label, а в GTM використайте відповідний шаблон Google Ads Conversion Tracking. Для покупки передавайте динамічну вартість, валюту й унікальний ідентифікатор транзакції, якщо конфігурація це підтримує.
Також перевірте Conversion Linker і згоду користувача. Не створюйте паралельно кілька однакових конверсій без чіткої причини: імпорт з GA4 і окремий Ads tag можуть подвоїти звітність, якщо обидві дії позначені основними.
Для бізнесу важливо не лише встановити тег, а правильно пов’язати його з кампаніями, посадковими сторінками й цінністю заявки. Це входить у професійне налаштування Google Ads.
UTM-мітки описують джерело переходу, а GTM керує тегами й подіями після відкриття сайту. Це різні рівні аналітики, які працюють разом. Посилання для реклами, email, партнерів і QR-кодів можна підготувати через UTM-генератор BB STUDIO.
Використовуйте єдині правила регістру та назв. facebook, Facebook і fb можуть потрапити в різні рядки звіту. Не додавайте UTM до внутрішніх посилань сайту: вони можуть перезаписати джерело сесії.
GTM не є банером згоди. Банер або CMP отримує вибір користувача, а Consent Mode передає стан згоди тегам. Налаштування повинно відбутися до запуску тегів, які залежать від consent.
Практичний процес:
визначити категорії cookie й правову підставу;
показати зрозумілий вибір;
установити default consent state до тегів;
оновити стан після вибору;
прив’язати теги до відповідних consent types;
протестувати прийняття, відмову та зміну вибору;
оновити політику cookie й конфіденційності.
GTM не звільняє бізнес від дотримання законодавства. Конкретні юридичні вимоги залежать від ринку, типу даних і рекламних технологій.
Для кожної події пройдіть позитивний і негативний сценарій.
натисніть потрібний елемент або виконайте дію;
переконайтеся, що в Preview з’явилася правильна подія;
перевірте параметри й значення;
переконайтеся, що потрібний тег спрацював один раз;
перевірте DebugView, Realtime або тестову конверсію;
перевірте мобільну й десктопну версію.
клікніть схожий, але інший елемент;
спробуйте невалідну форму;
перезавантажте сторінку подяки;
поверніться назад у checkout;
відмовтеся від аналітичних cookie;
перевірте, що тег не спрацьовує там, де не повинен.
Після тесту натисніть Submit, створіть версію з назвою й описом змін, перегляньте Activity History та опублікуйте. Версія дає можливість зрозуміти, що саме змінилося, і швидше відкотити проблемну конфігурацію.
Сам контейнер не робить усі теги безпечними або швидкими. Якщо через нього завантажити багато рекламних пікселів, чатів і Custom HTML, сайт отримає додаткові мережеві запити та JavaScript-навантаження.
Рекомендації:
видаліть невикористані теги й змінні;
обмежуйте тригери потрібними сторінками;
не дублюйте ті самі системи різними способами;
використовуйте нативні шаблони замість випадкового Custom HTML;
перевіряйте вплив сторонніх тегів;
запускайте некритичні інтеграції після consent або взаємодії;
регулярно проводьте аудит контейнера.
Якщо після додавання тегів сайт став повільнішим або з’явилися помилки, може знадобитися технічна підтримка сайту.
Для нового проєкту measurement plan, dataLayer і consent краще закласти до верстки checkout, форм та особистого кабінету. Це дешевше, ніж після запуску прив’язувати події до нестабільних CSS-класів. Під час розробки сайту аналітика повинна бути частиною приймального чекліста.
На готовому сайті почніть з аудиту: які коди вже встановлені, хто має доступ, чи дублюються перегляди, як працюють форми й оплата, які події реально використовуються у звітах. Не переносьте все в GTM без інвентаризації.
Подія сама по собі нічого не покращує. Після накопичення даних порівнюйте:
сторінки входу та заявки;
джерела трафіку та якість лідів;
початок форми й успішне надсилання;
перегляд товару, кошик, checkout і покупку;
мобільні та десктопні сценарії;
нових і повторних відвідувачів;
регіони, кампанії та посадкові сторінки.
Якщо відвідування є, а подій мало, скористайтеся матеріалом чому сайт має трафік, але не приносить заявок. Для пошуку проблем у навігації, формах і сценаріях корисний окремий UX-аудит сайту.
Контейнер встановлений не на всіх сторінках.
GA4 підключений одночасно через тему, плагін і GTM.
Клік кнопки помилково вважається успішною заявкою.
Тригери залежать від CSS-класу, який змінюється після редизайну.
Події мають хаотичні назви й дублікати.
У GA4 передаються персональні дані.
purchase спрацьовує повторно після оновлення сторінки.
Теги публікують без Preview і негативних тестів.
Consent Mode не відповідає вибору користувача.
У контейнері немає версій, описів і відповідальних.
Рекламні конверсії рахуються двічі.
Дані збираються, але команда не використовує їх у рішеннях.
створено корпоративний акаунт і вебконтейнер;
власник бізнесу має адміністративний доступ;
обидва фрагменти GTM встановлені правильно;
старі коди проінвентаризовані;
Google tag не дублюється;
measurement plan погоджено;
форми передають успіх, а не клік;
ecommerce-події містять потрібні параметри;
transaction_id унікальний;
UTM-іменування стандартизовано;
consent перевірено для прийняття й відмови;
Preview та DebugView пройдені;
події перевірені на мобільному й десктопі;
створено названу версію контейнера;
після публікації проведено контрольний тест;
визначено відповідального за подальші зміни.
Google Tag Manager дає контроль над тегами, але якість аналітики визначає не кількість налаштувань, а логіка вимірювання. Почніть з бізнес-цілей, створіть план подій, установіть контейнер без дублів, передавайте критичні дії через dataLayer, тестуйте позитивні й негативні сценарії, а потім використовуйте дані для покращення реклами та сайту.
BB STUDIO може перевірити наявні теги, спроєктувати measurement plan, налаштувати GA4, Google Ads, ecommerce-події та контроль якості. Щоб отримати план для свого проєкту, зв’яжіться з BB STUDIO. Для органічного залучення аудиторії налаштування аналітики варто поєднати з SEO-просуванням сайту.
Давайте разом створимо щось дивовижне