замовити дзвінок
+38 (044) 358-48-00
замовити дзвінок
Starting a new project?
отримати консультацію
Читайте наш Telegram 👈
67
1

Джерело - analyticsmania.com

Google Tag Manager — інструмент з безліччю функцій.

Чи потрібно відстежити поведінку користувачів на сайті? Протестувати нову форму зворотного дзвінка? Чи рахувати певні кліки? Із цим допоможе Google Tag Manager.

Після впровадження Google Tag Manager на сайт ви самостійно впораєтеся з цією роботою. І більше не чекатимете, поки програміст знайде час, щоб впровадити ваш код на сайт. Так, на всі 100% ви не заміните розробника, але більшу частину його дій зможете взяти на себе. Тобто станете трохи гнучкішим у реалізації нових маркетингових кампаній та/або відстеженні веб-аналітики.


1. Як працювали аналітики до появи Google Tag Manager

Якою була раніше стандартна процедура відстеження будь-яких дій користувачів:

  • задача — встановлення Google Analytics або іншого інструмента відстеження;
  • рішення — програміст додає на сайт фрагмент коду JavaScript потрібних інструментів;
  • відвідувач потрапляє на веб-сайт;
  • завантажується доданий код відстеження;
  • відвідувач відстежується.

За замовчуванням GA4 пропонує безліч метрик та деякі можливості автоматичного відстеження подій. А щоб приймати дійсно правильні та продумані рішення, відслідковувати потрібно набагато більше подій: взаємодії (наприклад, відправлення форм), продаж тощо. І щоразу доведеться звертатися до програміста і чекати.

Вихід — встановити на сайт код GTM і вже всередині самого GTM активувати будь-які необхідні коди відстеження.


2. Що таке Google Tag Manager?

Google Tag Manager — це безкоштовний інструмент для керування тегами від Google. GTM – сполучна ланка між сайтом та маркетинговими інструментами. По суті, це та сама система керування контентом (CMS або движок сайту).

Після встановлення GTM все, що вам потрібно буде зробити — додати потрібні коди відстеження в GTM, і після налаштувати події, при яких вони повинні активуватися (при завантаженні сторінки, кліку, надсиланні форми тощо).

А далі — протестувати встановлені теги. Переглянути, чи спрацьовують вони під час завантаження сторінки або натискання певної кнопки. І якщо виявилася якась неполадка, редагуєте теги в Google Tag Manager, а не вихідний код сайту. Що очевидний плюс.


3. Google Tag Manager vs. Google Analytics

Google Analytics і Google Tag Manager не одне й те саме.

Часто новачки не можуть визначитися, що з них є важливішим і що слід поставити на сайт в першу чергу. Обидва інструменти: й Аналітика, й ГТМ працюють спільно, а не окремо.

Google Analytics відстежує дані про відвідувачів сайту та відображає інформацію у звітах, а Google Tag Manager відповідає за активацію GA4.

GA – один із тегів відстеження. GTM використовується для передачі даних з одного джерела до іншого. Детальніше про GA та GTM ITForce писали у статті.

Google Analytics — не єдиний тег, який сумісний із Google Tag Manager. Інші приклади включають:

  • тег конверсії Google Ads;
  • код пікселя Facebook;
  • будь-який інший код користувача HTML/Javascript і т. д..

Основні переваги Google Tag Manager:

  • швидкість розгортання кодів відстеження;
  • відстеження розширеної аналітики;
  • всі теги контролюються у вашому обліковому записі GTM;
  • вбудовані та сторонні інструменти тестування;
  • просте відстеження подій;
  • готові шаблони тегів.

Докладніше про них та ще 6 інших ми писали про 11 переваг використання Диспетчера тегів Google.


4. Як працює Google Tag Manager?

GTM працює з 3 основними поняттями:

  • теги;
  • тригери;
  • змінні.

Стартова Google Tag Manager

Рис. 1 – Google Tag Manager

Тег — це фрагмент коду, який запускається на сайті за певної дії відвідувача.

Наприклад: відстежити цей клік і відправити його в Google Analytics і т. д..

Тригер — це умова, за якої тег повинен спрацювати.

Наприклад: тригер з умовою активувати тег лише тоді, коли користувач переглядає URL-адреси, що містять шлях /blog/. Коли виконується певна умова (або набір умов), активується тригер і з сайту надсилаються всі теги, пов’язані з тригером.

Змінна — значення, які використовуються в тригерах та тегах для фільтрації, коли має спрацьовувати певний тег.

Наприклад: змінна класу click має ім’я значення (наприклад, рядок слова), призначене кнопкам на сайті.

Змінна може:

  • містити єдиний фрагмент даних (наприклад, URL-адресу сторінки, домен веб-сайту, ідентифікатор продукту, розширення посилання тощо);
  • містить набір даних/налаштувань (змінна налаштування GA (для Universal Analytics) містить декілька налаштувань, пов’язаних з GA, таких як ідентифікатор відстеження, налаштування медійної реклами тощо);
  • бути складною функцією (але це занадто просунутий момент для новачків) і т. д..

Теги та тригери ГТМ

Рис. 2 – Теги та тригери

Розберемо взаємозв’язок між тегами, тригерами та змінними в Google Tag Manager на прикладі нижче.

Теги, тригери, змінні у ГТМ

Рис. 3 – Взаємозв’язок між тегами, тригерами та змінними в Google Tag Manager

  1. Тег конверсії Google Ads — це тег. Він вказує Google Tag Manager відстежувати конверсію.
  2. Коли потрібно активувати тег конверсії? На Thank You Page (вона ж сторінка підтвердження замовлення). Ця умова і є тригер.
  3. Тепер потрібно, щоб тригер спрацював і дані вирушили до Google Ads. Як це зробити?
  • Тег конверсії Google Ads може надіслати підсумкову суму замовлення, яка є змінною. Щоразу після завершення покупки тег Google Ads отримує значення змінної Загальна сума замовлення та відправляє його на сервери Google.
  • Тепер у тригері потрібно вказати Google Tag Manager, коли спрацьовувати. Слова на сторінці Дякую зрозумілі людині. Але не Google Tag Manager. Що таке Thank You Page? Це сторінка, URL якої містить /purchase-successful/. І тут URL сторінки — змінна. І GTM постійно перевірятиме URL сторінки при її завантаженні. Якщо змінна (URL) містить /purchase-successful/, тригер спрацює.

Отже, змінні можна використовувати і в тегах, і в тригерах, а також інших змінних.


5. Як створити обліковий запис Google Tag Manager

Для початку давайте створимо обліковий запис GTM.

  1. На офіційному сайті Google Tag Manager тиснемо на кнопку Start for Free.

Стартова сторінка ГТМ

Рис. 4 – Стартова сторінка ГТМ

Якщо у вас вже є обліковий запис Gmail, Google Ads, Google Analytics і т. д., ви автоматично увійдете в Google Tag Manager. Якщо ні, спочатку потрібно буде створити обліковий запис Google.

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

  1. У полі Ім’я вводимо назву компанії. Якщо ви представляєте агентство, попросіть клієнта створити обліковий запис GTM, а потім надати доступ до нього вам.
  2. В разділі Налаштування контейнера введіть назву сайту. Наприклад, його домен. Вибираємо Веб як цільову платформу.

Додати новий акаунт ГТМ

Рис. 5 – Додати новий обліковий запис в ГТМ

Обліковий запис Google Tag Manager працює так само, як обліковий запис GA, зазвичай він призначений для компанії/бізнесу/клієнта, а контейнер — для сайту або програми. Один контейнер може містити безліч тегів, тригерів та змінних.

Однак якщо в однієї людини кілька сайтів, і їх структура та реалізація відстеження схожі (наприклад, це 2 інтернет-магазини), то можна використовувати один контейнер на кількох сайтах.

  1. Тиснемо Створити.
  2. Читаємо Угоду про умови використання ГТМ та умови обробки даних.

Як встановити Google Tag Manager?

Один контейнер у нас уже є. Після його створення маємо 2 коди, які потрібно додати на сайт. Тут знадобиться допомога програміста: один код додається в <head> сайту, а другий — відразу після тегу <body>.

Як виглядає код ГТМ

Рис. 6 – Код ГТМ

Цей код активує всі налаштовані теги.

Як перевірити, чи працює Google Tag Manager?

Увімкнути Debug view (режим попереднього перегляду та налагодження) та подивитися, чи з’явиться він на екрані.

Для цього натисніть кнопку Попередній перегляд у верхньому правому куті GTM, потім перейдіть на сайт і перевірте, чи працює режим попереднього перегляду GTM.

Як надати доступ до Google Tag Manager?

Доступ до GTM можна надати на рівні:

  1. облікового запису;
  2. контейнера.

Для облікового запису є 2 типи дозволів:

  • адміністратор — користувач може переглядати та редагувати налаштування облікового запису, активність облікового запису та керування користувачами. Користувач отримує доступ Читання до всіх контейнерів облікового запису;
  • користувач — користувач може бачити налаштування облікового запису, його активність та керування користувачами, але не може редагувати налаштування, доступу до всіх контейнерів також немає, вони не видні.

Як надати доступ до облікового запису, описано у статті Як відкрити доступ до Google Ads, Google Analytics, GTM, Google Shopping?


6. Створення першого тега в Google Tag Manager

Як правило, перший тег, який встановлюють в Google Tag Manager, це Google Analytics 4.

Переходимо на сторінку analytics.google.com у режим Адміністратор. У розділі Властивості натискаємо Створити ресурс.

Створити ресурс ГТМ

Рис. 7 – Створити ресурс в ГТМ

Введіть назву об’єкта. Це може бути назва сайту, компанії, бренду тощо. Виберіть країну компанії, часовий пояс та основну валюту, в якій працює ваш бізнес.

Обрати країну, валюту та часовий пояс

Рис. 8 – Вибір країни компанії, часу та валюти

Потім натисніть Далі, дайте відповідь на кілька запитань і натисніть Створити.

Наступний крок — налаштування збору даних. Це джерело даних, з якого події будуть надсилатися у ваш ресурс Google Analytics 4.

У одному ресурсі може бути кілька джерел даних. Наприклад, 3 веб-ресурси, 1 для застосунку Android та 1 для застосунку iOS.

Налаштування збору даних

Рис. 9 – Налаштування збору даних

Введіть URL-адресу свого сайту (наприклад, https://www.mywebsite.com). Зверніть увагу, що протокол (https) вже вибрано.

Коли ви створюєте потік веб-даних у Google Analytics 4, у вас є можливість увімкнути або вимкнути події розширеної статистики (enhanced measurement).

Події розширеної статистики

Рис. 10 – Активація подій розширеної статистики

Коли ви будете готові, натисніть Створити потік. Коли ви створюєте потік даних (веб), ви побачите ідентифікатор виміру.

Ідентифікатор ГТМ

Рис. 11 – Ідентифікатор вимірювання

У верхньому правому куті вказано ідентифікатор відстеження вашого нового ресурсу. Скопіюйте його, він буде використовуватися в Google Tag Manager.

Перейдіть у контейнер Google Tag Manager > Теги > Створити та виберіть Конфігурація GA4.

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

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

У розділі Ініціювання виберіть Всі сторінки, а потім назвіть тег, наприклад, Конфігурація GA4 — [ідентифікатор виміру].

Створений тег ГТМ

Рис. 12 – Створений тег

Натисніть Зберегти тег.

Готово. Ви підключили Google Analytics на сайт.


FAQ о Google Tag Manager

№1. Google Tag Manager працює тільки з продуктами Google?

GTM працює з багатьма платформами. Він пропонує 80+ шаблонів тегів (Google Analytics, HotJar, тег Twitter тощо). Крім того, в GTM можна додавати власні коди за допомогою HTML.

№ 2. Google Tag Manager безкоштовний?

GTM має як безкоштовний, так і преміум-план. Безоплатний тариф добре підходить для використання МСБ. Великі підприємства можуть придбати платну версію Google Tag Manager 360. Порівняння двох тарифних планів.

№3. Що робити, якщо моя CMS не дозволяє розміщувати код Google Tag Manager у <head>?

Код GTM <script> можна розмістити у будь-якому місці сайту. Суть у тому, що чим вище розміщено код GTM, тим швидше він завантажиться і тим точнішим буде відстеження ваших подій. Найголовніше не розміщувати код <noscript> у <head> сайту. Всі інші варіанти прийнятні (наприклад, обидва коди можуть бути розміщені відразу після тега <body> або обидва коди перед закриваючим тегом </body>).

№ 4. Чи потрібно вчитися програмувати, щоб використовувати Google Tag Manager?

Ні, але знання JavaScript, HTML, CSS, регулярних виразів тощо стане плюсом, тому що ваші можливості розширяться.

№ 5. Чи потрібні мені програмісти після того, як я почну використовувати Google Tag Manager?

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

№ 6. Де я можу отримати допомогу з Google Tag Manager?


13 прийомів Google Shopping, які допоможуть покращити вашу рекламу вже сьогодні

Контекстна реклама мобільних застосунків в Google Ads

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

Ви вже підписані на нашу розсилку!

Підтвердіть свій email для завершення підписки.

Замовити
просування
Більше корисних статей та мануалів ще попереду. Будьте в курсі

Дякуємо! Скоро з вами зв'яжеться наш менеджер.