Технічне завдання на встановлення коду сервісу Google Tag Manager (GTM)

Q: Хто відповідає за встановлення GTM: розробник чи маркетолог?

Базовий код контейнера у і зазвичай встановлює розробник за технічним завданням. Самі теги, тригери та змінні всередині контейнера налаштовує маркетолог або веб-аналітик. Для складних подій (ecommerce, форми, dataLayer) потрібна спільна робота розробника й аналітика.

Автор Валерій Красько | 10 Бер 2025 Оновлено: 26 Лип 2026 | 9 хв читання 4 переглядів

Технічне завдання на встановлення коду сервісу Google Tag Manager (GTM)

Технічне завдання на встановлення коду Google Tag Manager (GTM) — це короткий документ для розробника з двома фрагментами коду й умовами їх розміщення: основний скрипт у тег <head> і резервний <noscript> одразу після <body>. Нижче — готовий приклад ТЗ, покрокова інструкція зі встановлення, перевірка коректності та шаблон у форматі docx, який можна завантажити й переробити під свій проєкт.

Написання технічного завдання — це навичка, яка є не у всіх спеціалістів. Тому ми ділимося в цій статті прикладом нашого технічного завдання на встановлення Google Tag Manager (GTM). Це ТЗ можна завантажити у форматі docx і переробити під свій проєкт. Якщо ви ще не знаєте, що таке диспетчер тегів і навіщо він потрібен — почніть із статті що таке Google Tag Manager.

Що таке технічне завдання на встановлення GTM

Технічне завдання на встановлення коду Google Tag Manager — це короткий і однозначний документ, який ставить завдання розробнику: куди і який код вставити, щоб контейнер GTM запрацював на сайті. На відміну від великого ТЗ на налаштування подій, тут ідеться саме про базове розміщення коду контейнера — фундамент, без якого жоден тег не запрацює.

Код контейнера складається з двох фрагментів, і кожен має своє місце на сторінці:

основний JavaScript-код — якомога ближче до початку тегу <head>;
резервний noscript-код (з <iframe>) — одразу після відкриваючого тегу <body>, він працює для користувачів із вимкненим JavaScript.

Обидва фрагменти мають бути присутні на кожній сторінці сайту. Саме тому код встановлюють у шаблон (header/footer), а не на окремі сторінки вручну.

Куди вставляти код Google Tag Manager: head і body — інфографіка

Навіщо потрібне технічне завдання на GTM

Чітке ТЗ економить час обом сторонам і прибирає двозначність. Без нього часто виникають типові проблеми: код ставлять лише на головну сторінку, плутають місця <head> і <body>, забувають замінити демонстраційний ID або встановлюють контейнер двічі (наприклад, і плагіном, і в темі).

Однозначність. Розробник бачить точні фрагменти коду й місця їх розміщення — нічого здогадуватися.
Перевірюваність. У ТЗ зафіксовано критерій приймання: контейнер видно в Preview і Tag Assistant, помилок немає.
Документація. ТЗ залишається в проєкті — за ним легко повторити встановлення на новому сайті або середовищі.

Технічне завдання: код GTM крок за кроком

Нижче — текст технічного завдання, який можна передати розробнику. Скопіюйте наведені фрагменти коду і вставте їх на кожну сторінку сайту.

Крок 1. Код у тег <head>

Вставте наведений нижче код якомога ближче до початку тегу <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-NQP9VD5D');</script>
<!-- End Google Tag Manager -->

* Зверніть увагу: ID GTM-NQP9VD5D у коді — демонстраційний. Його треба замінити на актуальний ID вашого контейнера.

Крок 2. Код одразу після тега <body>

Вставте наведений нижче код одразу після відкриваючого тегу <body>:

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

* Тут ID GTM-NQP9VD5D також треба змінити на актуальний.

Крок 3. Перевірка коректності встановлення

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

Встановлення GTM за 3 кроки — інфографіка

Як перевірити, що GTM працює

Не чекайте 48 годин — є швидкі способи переконатися, що контейнер встановлено правильно:

Режим Preview у GTM. Натисніть «Попередній перегляд» (Preview) у контейнері, введіть URL сайту — внизу/збоку з’явиться панель Tag Assistant зі статусом «Connected». Це означає, що контейнер знайдено.
Розширення Google Tag Assistant. Встановіть розширення для Chrome, відкрийте сайт — воно покаже, чи виявлено контейнер GTM і чи немає помилок.
Вкладка Network у DevTools. У браузері (F12 → Network) знайдіть запит gtm.js?id=GTM-... зі статусом 200 — це підтверджує, що скрипт завантажується.

Типові помилки при встановленні GTM

Більшість проблем зі збором даних починається ще на етапі встановлення коду. Ось чого варто уникати:

Код не на всіх сторінках. Контейнер ставлять у шаблон, а не на окремі сторінки — інакше частина трафіку не відстежується.
Переплутані місця. JavaScript має бути в <head>, а noscript — після <body>. Не навпаки.
Демо-ID залишився в коді. Дані зливаються в чужий або неіснуючий контейнер.
Подвійне встановлення. Контейнер додано і плагіном, і в темі — теги спрацьовують двічі, конверсії задвоюються.
GTM плутають із GA4. Код GTM не замінює код Google Analytics — GA4 підключається тегом усередині контейнера.

Хто відповідає: розробник чи маркетолог

Зони відповідальності варто розділити ще на старті:

Розробник — встановлює базовий код контейнера у <head> і <body> за цим ТЗ, за потреби реалізує dataLayer для динамічних значень (ціна, ID товару, статус замовлення).
Маркетолог / веб-аналітик — створює теги, тригери та змінні всередині контейнера: GA4, конверсії Google Ads, Meta Pixel тощо.

Наступний логічний крок після встановлення GTM — підключити аналітику. Як це зробити, описано в гайді як встановити Google Analytics 4.

Готовий шаблон ТЗ у форматі docx

Завантажте наш шаблон технічного завдання, замініть ID контейнера на свій і передайте розробнику:

[Шаблон] Технічне завдання на встановлення коду сервісу Google Tag Manager _ Spilno Agency Завантажити

Поширені запитання

Що таке технічне завдання на встановлення GTM?

ТЗ на встановлення GTM — це документ для розробника, у якому вказано два фрагменти коду контейнера Google Tag Manager та умови їх розміщення: основний скрипт якомога ближче до початку тегу <head>, а резервний noscript-код — одразу після відкриваючого тегу <body>. Часто ТЗ також містить ID контейнера (GTM-XXXXXXX) і вимогу перевірити коректність встановлення.

Куди вставляти код Google Tag Manager на сайті?

Перший фрагмент (JavaScript) вставляється якомога вище в теці <head> на кожній сторінці сайту. Другий фрагмент (noscript із <iframe>) — одразу після відкриваючого тегу <body>. Обидва коди мають бути на всіх сторінках, інакше частина трафіку не відстежуватиметься.

Чи можна встановити GTM без розробника?

Так. На WordPress код GTM додають через плагін (наприклад, GTM4WP, Insert Headers and Footers) або в шаблоні теми. На багатьох CMS і конструкторах є окреме поле для коду в head/body. Якщо доступу до коду немає або є сумніви — встановлення варто доручити розробнику за цим ТЗ.

Як перевірити, що GTM встановлено правильно?

Найшвидше — через режим Preview (Попередній перегляд) у самому GTM та розширення Google Tag Assistant: вони показують, чи знайдено контейнер на сторінці й чи спрацьовують теги. Також у GTM є вбудована діагностика, яка через ~48 годин показує наявність або відсутність помилок завантаження контейнера.

Чи треба змінювати ID GTM-XXXXXXX у коді?

Так, обов’язково. У прикладі коду стоїть демонстраційний ID контейнера. Перед встановленням його треба замінити на ваш власний ID контейнера, який видно у GTM у форматі GTM-XXXXXXX (праворуч угорі робочої області).

Хто відповідає за встановлення GTM: розробник чи маркетолог?

Базовий код контейнера у <head> і <body> зазвичай встановлює розробник за технічним завданням. Самі теги, тригери та змінні всередині контейнера налаштовує маркетолог або веб-аналітик. Для складних подій (ecommerce, форми, dataLayer) потрібна спільна робота розробника й аналітика.

Після того як розробник встановив код за цим ТЗ, контейнером треба ще керувати. Перед стартом робіт налаштуйте права доступу до контейнера GTM — щоб кожен виконавець мав рівно ті можливості, які потрібні для його задач.

Безкоштовний курс

Ця стаття є частиною безкоштовного курсу:

Курс маркетолога

Щоб отримати доступ до тесту після статті й відстежувати прогрес, зареєструйтесь (або увійдіть) і розпочніть курс в особистому кабінеті.

Розпочати курс

Тут будуть ваші коментарі

Щоб долучитися до обговорення, зареєструйтесь — це займе хвилину.

Зареєструватися

Валерій Красько Spilno Agency

Засновник і CEO Spilno Agency. Відповідає за стратегію агенції та напрям performance-маркетингу. Пише про Google Ads, Google Merchant Center, аналітику й автоматизацію маркетингу — на основі реальних кейсів клієнтів агенції.

Всі статті автора →

Залишились питання?

Розкажіть про задачу — відповімо по темі статті

← Повернутися до блогу