Повний гайд з data layer у Google Tag Manager

Автор:

Uliana Lesiv

Опубліковано 4 листоп. 2026 р. коментарів

відстеження на сайті. А data layer – одна з функцій, яка допомагає вивести відстеження на новий рівень.

Data layer GTM – це об'єкт JavaScript, який збирає відомості про взаємодії користувачів на вашому сайті. За його допомогою ви можете збирати практично будь-які дані – починаючи з переглядів товарів і закінчуючи операційною системою користувача. Використання data layer у GTM дає змогу налаштовувати більш цільові теги та тригери відстеження, забезпечуючи глибше розуміння поведінки користувачів і створюючи міцну основу для надійного аналізу клієнтських даних.

Тому ми створили вичерпний гайд з data layer, що охоплює багато аспектів його впровадження та використання в Google Tag Manager. Ми пояснимо, що таке data layer, варіанти його використання, як впровадити data layer на сайті, як створити data layer у Tag Manager, як протестувати налаштування та які поширені помилки виникають під час налаштування.

Почнімо!

Збір потрібних даних – це лише половина справи

Доповніть ваш GTM data layer серверним відстеженням на Stape, щоб підвищити надійність доставки подій.

Надсилати події на сервері

Що таке data layer у Tag Manager?

Data layer GTM – це об'єкт JavaScript, який використовується для передачі даних тегам. Він дає змогу передавати події або змінні та налаштовувати тригери на основі значень певних змінних. Data layer використовується як у Google Tag Manager, так і в gtag.js.

Data layer слугує посередником між вашим сайтом і Google Tag Manager, функціонуючи як центр для зберігання структурованих даних вашого контейнера.

Варіанти використання data layer

Вам потрібно створити data layer, якщо ви хочете:

Налаштувати надійне відстеження. Без data layer ви отримуєте дані безпосередньо з HTML DOM (стандарт, що використовується для додавання, отримання, зміни або видалення HTML-елементів на вашому сайті), а потім надсилаєте дані безпосередньо до контейнера GTM. Проблема в тому, що HTML DOM може змінюватися, що призводить до зупинки спрацьовування тегів і збору даних.

З data layer ви не зіткнетеся з такою проблемою, оскільки контейнер GTM отримує дані з data layer сторінки, який набагато стабільніший за HTML DOM. Запис даних припиняється лише в тому разі, якщо хтось порушить data layer сторінки.

Збагачувати дані тегів за певних умов. Припустімо, ви хочете надсилати дані про значення події покупки лише в тому разі, якщо користувач заплатив більше ніж $50. Замість того щоб шукати розрізнені змінні, деталі транзакції, категорії сторінок та інші сигнали на вашій сторінці, використання data layer, заповненого відповідними змінними та їхніми значеннями (у нашому випадку, значення покупки > $50), допомагає гарантувати, що необхідні дані легко доступні щоразу, коли це потрібно вашим тегам.

Як працює data layer?

Ви можете вказати, які саме дані хочете зберігати в цьому шарі. Існує два методи створення data layer і заповнення його необхідними параметрами для відстеження, які ми розглянемо у наступному розділі.

GTM зчитує та бере необхідні значення з data layer і надсилає їх до інструментів аналітики, таких як Google Analytics, Google Ads, Facebook Pixel тощо.

Синтаксис і приклади data layer

У Google Tag Manager dataLayer – це масив, що позначається символами "[]", і він містить об'єкт, представлений символами "{}", як показано у скрипті нижче:

dataLayer = [{}];

Елементи всередині data layer називаються змінними та форматуються як пари 'ключ' : 'значення' (укладені у "{}").

GTM використовує змінну data layer під назвою "event", яка також використовується обробниками подій JavaScript для запуску тегів, коли користувач взаємодіє з елементами на сайті. Отже, згідно з прикладом нижче, 'event' – це 'ключ', а 'register' – 'значення'.

dataLayer = [{'event' : 'register' }];

Для змінних синтаксис такий самий, як і для подій. У прикладі нижче ми беремо потрібну для відстеження країну – 'country' ('variable_name') є 'ключем', а 'united states' – 'значенням' ('variable_value').

dataLayer = [{'country' : 'united states' }];

Ініціалізація dataLayer

Існує два методи впровадження data layer: декларація і push data layer. Ми опишемо, як використовувати обидва методи, але ви можете одразу перейти до того, який підходить вам найбільше.

Коротко кажучи, ми рекомендуємо використовувати dataLayer.push, оскільки він популярніший і покриває більшість потреб. Крім того, цей метод безпечніший у використанні, адже він не порушує події в Google Tag Manager, тоді як неправильне налаштування декларацій data layer може легко спричинити проблеми.

	Декларація Data Layer	dataLayer.push
Найкраще підходить для	Значень, необхідних до завантаження сторінки	Надсилання інформації до dataLayer для подій, відмінних від події завантаження сторінки
Час надсилання змінної data layer	До виконання	Під час виконання
Розташування в коді	Над кодом контейнера Google Tag Manager	Будь-де в коді
	Перейти до декларації Data Layer	Перейти до dataLayer.push

Метод 1: Декларація data layer

Щоб використовувати цей метод, фрагмент коду data layer слід розмістити над фрагментом коду контейнера Google Tag Manager. У цьому разі data layer ініціалізується до ініціалізації Tag Manager.

Загалом це не найпопулярніший або рекомендований спосіб створення data layer, але він спрацює, якщо ви хочете створити точки даних до завантаження контейнера GTM і використовувати ці точки даних для управління тегами.

Змініть 'variable_name': 'variable_value' на потрібні параметри та вставте код на сторінці сайту перед фрагментом коду GTM.

dataLayer = [{

'variable_name': 'variable_value' 

}];



...

Примітка: використовуйте оператор "=" для присвоєння значень об'єкта масиву dataLayer.

Метод 2: dataLayer.push

Метод push динамічно додає елементи об'єкта до data layer. На відміну від методу декларації data layer, за допомогою push-даних ви можете розмістити фрагмент коду data layer будь-де в коді.

Це може трохи заплутувати, але 'dataLayer' також є змінною JavaScript, доступною будь-якій функції, що взаємодіє з об'єктом window. Тому, щоб уникнути конфліктів із будь-яким іншим локальним масивом JavaScript з ім'ям 'dataLayer', найкраще використовувати префікс 'window.dataLayer'.

Отже, вам знадобиться використати наведений нижче код для методу dataLayer.push. Замість 'variable_name' : 'variable_value' додайте необхідні параметри.

window.datalayer = window.dataLayer || [];

window.dataLayer.push({ 

'variable_name' : 'variable_value'

});

У наведеному вище блоці коду dataLayer встановлюється рівним наявному dataLayer, якщо він вже існує; інакше створюється новий dataLayer як порожній масив. Оператор || (АБО) гарантує, що присвоєння відбувається за виконання будь-якої з цих умов.

Таким чином, ви уникнете створення кількох декларацій, які можуть перезаписати dataLayer.

Приклад і документація щодо data layer для eCommerce

Для багатьох CMS електронної комерції існують плагіни (зокрема плагіни від Stape), які можуть створити для вас data layer для стандартних подій eCommerce. У деяких випадках цього може бути недостатньо. Наприклад, якщо вам потрібні додаткові події або додаткові дані в подіях data layer. Або якщо ви використовуєте повністю кастомізовану платформу.

У цьому разі вам потрібно звернутися до ваших розробників, щоб вони створили події data layer з потрібним вам payload. Зазвичай це доволі проста задача для розробників, яка не забирає багато часу, хоча це залежить від архітектури вашого сайту чи платформи.

Ось приклад такої документації для розробників, яку ви можете скопіювати, відредагувати під свої потреби та передати своїм розробникам.

Кілька корисних рекомендацій:

Зробіть копію документа, видаліть непотрібні вам події та/або додайте потрібні події та приклад payload.
Використовуйте однаковий формат даних у всіх подіях. Найкраще дотримуватися формату GA4.
Якщо подія неочевидна (наприклад, перегляд товару чи додавання до кошика), детально опишіть, коли вона має спрацьовувати. Це дасть змогу уникнути зайвого листування між вами та розробниками.
Користувацькі дані можна використовувати практично на всіх маркетингових платформах; важливо, щоб вони були доступні в data layer – їх використання значно покращить результати вашого відстеження.
Намагайтеся уникати подій data layer, які надсилаються до того, як користувача перенаправляють на іншу сторінку. Це може призвести до втрати цих даних, оскільки події можуть фактично не встигнути надіслатися до перенаправлення. Наприклад, якщо ви хочете надіслати подію Lead після того, як користувач надішле форму, а потім користувача буде перенаправлено на сторінку подяки, найкраща практика – надсилати цю подію в data layer на сторінці подяки, а не в момент фактичного надсилання форми користувачем.
Якщо на вашому сайті вже є якісь події data layer, краще використовувати користувацькі назви для нових подій data layer і не змінювати старі події, щоб не вплинути на наявне відстеження в процесі. Тобто, якщо у вас уже є, наприклад, add_to_cart у data layer, краще створити нову подію add_to_cart_v2, замість того щоб змінювати стару, а потім переналаштовувати теги на нові події.
Обов'язково перевірте data layer після того, як розробники реалізують це. Іноді навіть невеликі помилки в payload можуть спричинити проблеми з відстеженням.

Ключові компоненти data layer для eCommerce-аналітики та відстеження

1. Дані про товар

item_id – унікальний ідентифікатор товару (SKU або ID у базі даних)
item_name – назва товару
item_category – категорія товару (може бути вкладеною: item_category2, item_category3)
item_brand – назва бренду
price – ціна за одиницю
quantity – кількість одиниць

2. Дані про транзакцію

transaction_id – унікальний ID замовлення (критично важливий для дедуплікації)
value – загальна вартість транзакції
currency – код валюти ISO 4217 (наприклад, USD, EUR)
tax – сума податку
shipping – вартість доставки
coupon – застосований промокод

3. Дані про користувача

user_id – внутрішній ідентифікатор користувача
email – хешований email користувача (для enhanced conversions)

4. Параметри, специфічні для події

Подія	Коли спрацьовує
view_item_list	Сторінка списку товарів або категорії
view_item	Сторінка детальної інформації про товар
add_to_cart	Товар додано до кошика
begin_checkout	Розпочато оформлення замовлення
add_payment_info	Обрано спосіб оплати
purchase	Замовлення підтверджено

Як створити data layer у Tag Manager?

Ви можете по-різному звертатися до елементів вашого масиву data layer у Google Tag Manager. Щоб використовувати дані всередині Google Tag Manager, присвойте їх змінній або використовуйте як тригер події. Потім ці змінні або події можна включити у ваші теги, тригери чи інші змінні.

Нижче ми наводимо три варіанти використання data layer і їхнє налаштування в GTM:

Варіант використання 1: змінні data layer як точки даних

Приклад коду

Як приклад ми беремо значення покупки помаранчевих футболок.

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

‘product_name’ : ‘orange t-shirt’,

'purchase_value' : '5',

‘purchase_currency’ : ‘EUR’

});

Налаштування в GTM

1. Для налаштування змінної в контейнері GTM перейдіть у Variables → натисніть "New" у розділі User-Defined Variables.

2. Виберіть "Data Layer Variable" як тип змінної.

3. Додайте ім'я змінної data layer і натисніть "Save".

Зверніть увагу: поле чутливе до регістру, тож переконайтеся, що ім'я збігається з ім'ям значення в коді, який ви додали на сторінку. У нашому випадку це "purchase_value".

Варіант використання 2: data layer для запуску подій

Приклад коду

Як приклад коду ми беремо змінну dataLayer, яка запускає подію «register», коли користувач заповнює дані, необхідні для реєстрації, і натискає «Register».

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

'event' : 'register'

});

Налаштування в GTM

1. Перейдіть у Google Tag Manager Triggers → натисніть "New."

2. Виберіть тип тригера "Custom Event".

3. У полі "Event name" додайте ім'я так само, як ім'я значення в коді, оскільки це поле чутливе до регістру. Натисніть "Save".

Варіант використання 3: змінна data layer як змінні й тригери подій

Приклад коду

Наведений нижче приклад змінної data layer запускає події покупки та створює інформацію про покупку.

dataLayer = [{
'event': 'purchase',
'purchase_info': {
'purchase_amount': 5,
'purchase_curency': 'EUR'
}
}];

Налаштування в GTM

Ви можете використовувати змінні з коду як у якості змінних, так і у якості тригерів подій у Google Tag Manager. Ознайомтеся з процесом налаштування з попередніх кроків для змінних і подій.

Як надіслати параметри data layer з клієнтського в серверний GTM?

Data layer не існує в серверному Google Tag Manager так само, як у клієнтському GTM.

Проте sGTM має об'єкт під назвою Client, який перевіряє HTTP-запити від веб-GTM. Якщо запит містить певні дані, Client перетворює дані запиту на дані події. Теги також використовуються для надсилання даних із веб-контейнера GTM на сервер GTM.

Щоб заповнити точки даних у серверному контейнері GTM, вам потрібно обрати метод, який ви використовуватимете для надсилання даних із веб у серверний GTM; серед популярних:

Використання Google Analytics 4

Цей метод особливо ефективний, якщо ви налаштовуєте серверне відстеження для Google Ads або Floodlight, оскільки обидва покладаються виключно на теги GA4.

1. У веб-GTM створіть тег із конфігурацією "Google Analytics: GA4 Event".

2. Ви знайдете попередньо визначені поля для цих даних і зможете призначати змінні data layer кожному параметру окремо.

GA4 setup to send data from the web to the server GTM

Використання Data Tag/Data Client

Ключова перевага використання Data Tag/Data Client полягає в тому, що він автоматично надсилає data layer та інші загальні дані з веб у сервер GTM.

1. Створіть новий тег у веб-контейнері GTM і виберіть "Data Tag" як конфігурацію тегу.

Зверніть увагу: вам потрібно додати Data Client до галереї GTM.

2. У конфігурації тегу увімкніть два прапорці "Send common data" та "Send all from DataLayer."

Система автоматично розбере дані у веб-GTM і переправить усю доступну інформацію до серверного GTM.

Ознайомтеся з нашою статтею в блозі про створення data layer для серверного Google Tag Manager, щоб дізнатися більше про процес налаштування.

Надсилання змінної data layer до Google Analytics 4

Примітка: нижче ми описуємо, як налаштувати Google Tag для надсилання даних; якщо у вас уже налаштовано Google Tag, немає потреби створювати новий тег. Просто пропустіть наведені нижче кроки та переходьте одразу до розділу про створення користувацького вимірювання.

У цьому разі вам потрібно лише додати параметри, як у коді для data layer, у розділі "Shared event settings."

Налаштування Google Tag у GTM

1. У розділі "Tags" GTM натисніть "New" і виберіть "Google Tag" як тип тегу.

2. Додайте ваш GA4 Measurement ID, і в розділі "Shared event settings" перелічіть параметри, які ви додали до свого коду.

3. Як тригер виберіть "Page View – All Pages".

Створення користувацького вимірювання в GA4

Існує список стандартних параметрів. Якщо дані, які ви хочете відстежувати за допомогою data layer, відсутні у списку рекомендованих подій Google Analytics, вам потрібно додати їх вручну у вашому акаунті GA4 як користувацькі вимірювання. Після додавання вони з'являться у звітах GA4.

1. В акаунті Google Analytics натисніть "Admin" → "Custom definitions."

2. Натисніть "Create custom dimension" і заповніть необхідний параметр:

Dimension name – ім'я, яке ви хочете бачити у звітах.
Scope – виберіть область дії: подія, користувач або товар.
Event parameter – додайте ім'я змінної або події, як зазначено у фрагменті коду data layer (зверніть увагу, що дані в цьому полі чутливі до регістру).

Натисніть "Save".

Тестування налаштування data layer

Отримайте покращений попередній перегляд GTM і відформатовані серверні запити для простішої перевірки – для ваших клієнтів або для вашого власного великого контейнера GTM – завдяки Stape GTM Helper.

Режим налагодження GTM

Щоб перевірити, чи вловлює Google Tag Manager змінну, вам потрібно виконати кілька простих кроків, подібних до звичайного налагодження в GTM.

1. Натисніть "Preview" і додайте URL сайту, який ви налагоджуєте.

2. Перейдіть на вкладку розділу "Variable", і якщо все працює, ви побачите потрібні дані на цій вкладці.

Якщо у вас виникли проблеми з режимом налагодження в GTM, ознайомтеся з нашими гайдами:

Google Analytics 4

Щоб перевірити, чи фіксує Google Analytics дані, перейдіть у "Admin" → DebugView.

Усунення несправностей data layer

Проблема 1: push data layer не працює

Якщо ви бачите, що змінні або події не надсилаються, найімовірніше, ви використовуєте неправильний регістр для імен об'єктів або пропустили лапки.

Рішення: правильний регістр для імен об'єктів і лапки

Перевірте, чи написано "dataLayer" у camelCase.

Хороший приклад:

dataLayer.push({'variable_name': 'variable_value'});

Поганий приклад:

datalayer.push({'variable_name': 'variable_value'});

Переконайтеся, що всі імена змінних укладені в лапки.

Хороший приклад:

dataLayer.push({'variable_name': 'variable_value'});

Поганий приклад:

dataLayer.push({variable_name': 'variable_value'});

Проблема 2: теги не спрацьовують

Якщо ви не можете запустити теги в усіх потрібних місцях на сайті, перевірте імена змінних на різних сторінках.

Рішення: узгоджені імена змінних

Найпоширеніша помилка – неузгоджений регістр в іменах змінних на різних сторінках, тож вам потрібно переглянути назви.

Хороший приклад:

// Homepage:

dataLayer.push({'variable_name': 'variable_value'});

// Product page:

dataLayer.push({'variable_name': 'variable_value'});

Поганий приклад:

// Homepage:

dataLayer.push({'variable_name': 'variable_value'});

// Product page:

dataLayer.push({'variable Name': 'variable_value'});

Підсумок

GTM datalayer – важливий компонент GTM. Він дає змогу нам фіксувати взаємодії користувачів із вашим сайтом, а також надає додаткові дані про взаємодію чи її контекст. Використання data layer є необхідним, якщо ви хочете створити якіснішу структуру даних.

Концепцію data layer доволі складно реалізувати, і для побудови складної інфраструктури відстеження, найімовірніше, знадобляться розробники.

Ось короткий підсумок:

Ми рекомендуємо використовувати метод dataLayer.push для впровадження data layer.
Після впровадження data layer ви можете використовувати його як точки даних, тригери подій або як обидва варіанти.
Якщо ви використовуєте серверне відстеження, надсилайте параметри data layer з клієнтського в серверний контейнер GTM.
Завжди перевіряйте налаштування в режимі налагодження GTM.
Додайте користувацькі вимірювання в GA4 (якщо ви використовуєте цей інструмент), щоб бачити дані у звітах GA4.
Уникайте поширених помилок, які спричиняють збої в роботі data layer.

Бажаєте розпочати роботу на стороні сервера?

Спробувати безкоштовно

Автор:

Uliana Lesiv

Content writer

Уляна — Content Manager в Stape, спеціалізується на аналітиці та налаштуванні інтеграцій. Вона розкладає складні концепції відстеження на зрозумілі ідеї, допомагаючи бізнесу оптимізувати збір даних.

Ця стаття була корисною?

Коментарі

Схожі пости

Блог

Як створити data layer для server-side Google Tag Manager

16 квіт. 2025 р.

Перетворіть якісніше відстеження на кращі маркетингові результати

Спробувати безкоштовно