Що таке Диспетчер тегів Google: настройка і приклади використання

  1. Чи потрібен вам менеджер тегів?
  2. Як почати роботу?
  3. Структура Диспетчера тегів
  4. Приклади використання Диспетчера тегів
  5. 2. Підключення Яндекс.Метрики
  6. 3. Відстеження подій
  7. Інші можливості Google Tag Manager
  8. підводимо підсумки

Маркетологи використовують різні допоміжні сервіси: системи аналітики, сервіси A / B тестування, ретаргетінговие, рекламні та коллтрекінговие платформи, віджети, онлайн-месенджери і багато інших. Для їх роботи необхідно вставити коди (теги) на сайт, що викликає ряд проблем.

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

По-друге, якщо сервісів багато, швидкість завантаження сторінок сповільнюється, що, як відомо, погано впливає на SEO .

По-третє, незручно працювати з масою стороннього коду, через що мають місце зайві трудовитрати і підвищується ймовірність помилки.

У 2012 році Google запустив Диспетчер тегів (Tag Manager), створений спеціально для маркетологів. Сервіс дозволяє з одного інтерфейсу управляти всіма тегами різних сервісів. На сайт інтегрується тільки один код, а решта коди маркетолог самостійно додає в Диспетчер без участі IT-фахівця.

Подібні платформи існували і до 2012 року, але працювали лише на платній основі. Революційність Google Tag Manager в його повній безкоштовності. Спочатку в нього були вбудовані тільки теги сервісів Google, але пізніше з'явилася підтримка сторонніх тегів. Також є можливість додавати довільні теги.

Чи потрібен вам менеджер тегів?

Незважаючи на всю корисність Диспетчера, його використання не завжди має сенс:

  • Якщо у вас встановлена ​​Яндекс.Метрика або Google Analytics і ви відстежуєте лише базові показники, то навряд чи ви оціните простоту і гнучкість Tag Manager. В такому випадку зручніше додати коди безпосередньо на сайт і не повертатися до цього питання.
  • У диспетчері немає необхідності, якщо ви не експериментуєте з різними сервісами, які не вибираєте оптимальний для себе, що не тестируете функціонал. Ви один раз встановіть коди на сайт і забудете про них на довгий час.

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

Як почати роботу?

Перший етап - реєстрація. Для цього перейдіть на сайт https://tagmanager.google.com/ і заведіть аккаунт (або авторизуйтесь за допомогою вже існуючого облікового запису в Google). Задайте найменування аккаунта і контейнера і вкажіть місце використання контейнера (вебсайт, додаток, AMP-сторінки ).

Після натискання кнопки «Створити» потрібно підтвердити умови угоди, після чого буде доступний код для інтеграції на сайт. Зверніть увагу, що код складається з двох частин: перша частина розміщується в розділі <head>, друга - в розділі <body>.

Не знаєте, що таке теги <head>, <body> і де їх шукати в коді? На допомогу вам - стаття про найважливіші HTML тегах для SEO.

Якщо ви не вставите код відразу після створення аккаунта, то зможете зробити пізніше.

Для правильної роботи сервісу на сайті рекомендується розміщувати тільки код Диспетчера тегів. Якщо у вас встановлена ​​Яндекс.Метрика, Google Analytics та інші системи, слід все теги перенести з сайту в створений контейнер. При цьому всі дані, зібрані раніше, збережуться. Можлива коротка (зазвичай не більше хвилини) «осідання» в зборі статистики на час перенесення тега, але це не критично.

Тепер можна створювати теги, але спочатку радимо розібратися зі структурою Диспетчера.

Структура Диспетчера тегів

Інтерфейс Google Tag Manager досить простий. Меню робочої області містить такі вкладки:

Огляд. Це головна сторінка. Тут можна створити новий тег, побачити історію змін і неопубліковані контейнери.

Тут можна створити новий тег, побачити історію змін і неопубліковані контейнери

Теги. Це фрагменти коду, які виконуються (активуються) на веб-сайті. Теги мають різне призначення, але в Tag Manager вони переважно застосовуються для передачі даних. Так, теги Google Analytics і відстеження конверсій Google Ads передають дані про дії відвідувачів сайту.

У диспетчері є готова система шаблонів тегів. Вона істотно спрощує роботу з рядом підтримуваних сервісів: AdRoll, Google Ads, Clicky, Crazy Egg, Criteo, DoubleClick, Google оптимізатор, Hotjar, Twitter і багато інших. ін. Також можна задавати користувальницькі HTML-теги.

Тригери. Це дії відвідувачів сайту, у відповідь на які активуються теги. Так, тригер «Глибина прокрутки» при значенні 50% запускає тег ремаркетингу, якщо користувач перегляне більше половини сторінки.

Як же Tag Manager дізнається, що умова, вказане в тригері, виповнилося, і пора активувати тег?

Для цього потрібно, щоб програміст налаштував так званий об'єкт рівня даних.

Рівень даних - це об'єкт, що містить всі дані, які ви плануєте передавати в менеджер тегів, де ці значення фіксуються завдяки змінним.

Щоб менеджер тегів отримував значення змінної, потрібно, крім того, передати подія за допомогою команди push. Детальна інформація про додавання змінних наведена в керівництві Google для розробників .

Немає бажання вдаватися в деталі і займатися рутиною? Запустіть SEO-оптимізацію сайту на повному автоматі за допомогою модуля SEO системи PromoPult. Фахівці налаштують аналітику, зроблять сайт зручніше для відвідувачів, підвищать його привабливість для пошукових систем.

Приклади використання Диспетчера тегів

1. Підключення Google Analytics

Спочатку натисніть «Новий тег» / «Конфігурація тега». У списку, що з'являється активуйте «Universal Analytics».

У пункті «Налаштування Google Analytics» натисніть «Нова змінна ...»:

Задайте ваш ідентифікатор відстеження. Для цього перейдіть в Google Analytics в розділ «Адміністратор» / «Код відстеження». Код має формат UA-хххххххх-хх - просто скопіюйте його:

Вставте код у відповідне поле менеджера тегів:

Натисніть «Зберегти», вкажіть ім'я змінної і ще раз збережіть. Все, ви створили перший тег.

Тепер потрібно задати правило його активації, тобто тригер. Клацніть по області «Тригер» під областю «Конфігурація тега», виберіть у списку тригер «Перегляд сторінки (All pages)» і натисніть «Зберегти»:

Клацніть по області «Тригер» під областю «Конфігурація тега», виберіть у списку тригер «Перегляд сторінки (All pages)» і натисніть «Зберегти»:

Це не все. Створений тег запрацює тільки після його публікації. Для цього клікніть по кнопці «Відправити»:

Для цього клікніть по кнопці «Відправити»:

Вкажіть назву версії та короткий опис (щоб ви розуміли, в чому суть внесених змін) та натисніть «Опублікувати»:

Вкажіть назву версії та короткий опис (щоб ви розуміли, в чому суть внесених змін) та натисніть «Опублікувати»:

У розділі «Версії» з'явиться опис нової версії тега і змінних:

У розділі «Версії» з'явиться опис нової версії тега і змінних:

Тепер система аналітики почне збирати дані (за умови, що код Диспетчера тегів інтегрований на всі сторінки сайту).

Рекомендуємо: Як позбутися від реферального спаму в звітах Google Analytics

2. Підключення Яндекс.Метрики

Яндекс.Метрика не підключена до Диспетчер тегів, тому процедура додавання коду буде трохи відрізнятися. На етапі вибору типу тега клікніть на «Призначений для користувача HTML»:

Тепер перейдіть в сервіс Яндекс.Метрика в розділ «Налаштування» / «Код лічильника» і скопіюйте код в поле внизу:

Вставте цей код в поле в менеджері позначок та додавання тригер (як ви робили при налаштуванні Google Analytics) і натисніть «Зберегти»:

Залишається опублікувати тег, щоб він почав передавати дані. Аналогічно ви можете додати будь-який тег, шаблону якого немає в базі Tag Manager.

Корисно знати: Огляд стандартних звітів Яндекс.Метрики

3. Відстеження подій

У Google Analytics є звіт в розділі «Поводження» / «Події». За замовчуванням він порожній. Для збору даних необхідно налаштувати події за допомогою Tag Manager.

Події можуть бути декількох типів:

  • клік по конкретної або однієї з вказаних посилань;
  • клік по елементу (наприклад, зображення, банеру або кнопці);
  • спрацьовування по таймеру;
  • відправка форми.

Розглянемо налаштування події на прикладі кліка по елементу сторінки - кнопці «Детальніше». Для цього спочатку необхідно дізнатися клас елемента. Для цього відкрийте сторінку, перейдіть до нього та натисніть в контекстному меню в браузері «Переглянути код» і знайдіть назву класу (в нашому прикладі - more-link):

Виберіть в диспетчері розділ «Змінні», натисніть «Налаштувати» і активуйте змінну «Click Classes»:

Створіть новий тригер (тип - «Всі елементи») з умовою активації «Деякі кліки». У випадаючому списку виберіть змінну «Click Classes» і вкажіть назву класу елемента. Якщо ви хочете, щоб подія спрацьовувало тільки при кліці по елементу на конкретній сторінці, то натисніть +, виберіть змінну Page URL і вкажіть повну адресу сторінки (за умови «дорівнює») або частину сторінки (за умови «містить»):

Натисніть «Зберегти» і назвіть тригер «GA - тригер - клік по кнопці Детальніше».

Тепер створіть новий тег (тип - «Universal Analytics»), вкажіть тип відстеження - «Подія», Категорія - «Кнопка», Дія - «Клік», Ярлик - {{Click ID}}:

Тепер створіть новий тег (тип - «Universal Analytics»), вкажіть тип відстеження - «Подія», Категорія - «Кнопка», Дія - «Клік», Ярлик - {{Click ID}}:

Додайте до цього тегу тригер «GA - тригер - клік по кнопці Детальніше». Залишається перевірити, щоб не було помилок ( «Попередній перегляд») і опублікувати тригер. Після цього в звіт «Події» в Google Analytics почнуть надходити дані.

Інші можливості Google Tag Manager

Крім наведених прикладів використання GTM, з його допомогою можна:

  • додавати семантичну розмітку на сайт (ось докладна інструкція );
  • відслідковувати конверсії і налаштовувати ремаркетинг в Google Ads;
  • моніторити дзвінки після конверсії на сайті;
  • інтегрувати платформу Google Optimize для A / B-тестування;
  • пов'язувати конверсії на різних доменах;
  • підключати сторонні сервіси (Adometry, comScore, FoxMetrics, Infinity, MouseFlow, Placed і мн. ін.).

підводимо підсумки

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

Якщо ви ще не готові самі впровадити аналітику на сайт, скористайтеся послугами « персонального менеджера »Від PromoPult. Він допоможе встановити і налаштувати лічильники відстеження відвідуваності, налаштувати цілі та події і інші параметри.

Чи потрібен вам менеджер тегів?
Як почати роботу?
Чи потрібен вам менеджер тегів?
Як почати роботу?
Не знаєте, що таке теги <head>, <body> і де їх шукати в коді?
Як же Tag Manager дізнається, що умова, вказане в тригері, виповнилося, і пора активувати тег?
Немає бажання вдаватися в деталі і займатися рутиною?