Як налаштувати відстеження кліків по кнопках за допомогою Google Tag Manager

Вміння працювати з Google Tag Manager (GTM) — мастхев для кожного інтернет-маркетолога, адже це дозволить вам зекономити дорогоцінний час на написання технічного завдання та очікування його реалізації розробниками. 

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

У статті — покроковий план із п’яти етапів, що допоможе все правильно реалізувати.

Налаштування відстеження кліку по кнопці

Важлива ремарка, перш ніж почати налаштування: сам факт кліку не можна вважати ключовою метою на сайті, навколо якої можна побудувати маркетингову стратегію та приймати рішення щодо подальшого перерозподілу бюджету. Однак він може слугувати допоміжним фактором при аналізі поведінки користувача на сайті на шляху до головної мети (покупки, відправки форми).

Етап 1. Увімкніть вбудовані змінні

Перед тим як відстежувати кліки по будь-якій кнопці, треба увімкнути вбудовані змінні типу «Кліки». Це дасть можливість надалі обрати правильні умови для тригера активації, а також вони знадобляться при налаштуванні тегів. 

Щоби налаштувати вбудовані змінні, перейдіть у розділ «Змінні» та натисніть «Налаштувати». У вікні, що відкрилось, встановіть галочку навпроти усіх наявних змінних у розділі «Кліки». 

Етап 2. Створіть тригер-помічник 

В контейнері GTM існує два види тригерів для відстеження кліків: «Усі елементи» та «Лише посилання». 

Тригер «Усі елементи» відстежує кліки по будь-якому елементу, в той час як тригер «Лише посилання» — тільки кліки по посиланнях . 

Детальніше про створення обох тегів — в наступному розділі.

Для налаштування відстеження кліку по кнопці необхідно знати її унікальний ідентифікатор. 

Етап 3. Визначте унікальний ідентифікатор для кнопки

Серед основних типів ідентифікаторів:

• іd;
• class, 
• name.

Щоб його визначити:

1. Відкрийте в браузері сторінку, де знаходиться кнопка, яку треба відстежити.
2. Натисніть на неї правою кнопкою миші та оберіть пункт «Подивитись код» або «Проінспектувати код», залежно від операційної системи та типу браузера.
3. З’явиться код сайту з підсвіченим елементом, який характеризує кнопку. Лівою кнопкою миші виділіть кнопку, яку плануєте відстежувати. Підсвічений рядок у коді сторінки — це і є унікальний ідентифікатор вашої кнопки. 

Альтернативний спосіб для визначення унікального ідентифікатора кнопки на сайті — допоміжний тригер «Клік — Всі елементи». Він слугує помічником, але не знадобиться для налаштування тегу. 

Щоб увімкнути тригер:

1. Перейдіть в розділ «Тригери». та створіть тригер типу «Клік — Всі елементи» (Click — All elements). Як умову запуску тригера оберіть «Усі кліки», тому що важливо зафіксувати всі кліки та визначити унікальні ідентифікатори кнопки, яку відстежуєте.

2. Збережіть тригер та активуйте режим «Попереднього перегляду».
3. Перейдіть на сайт і натисніть на кнопку, яку хочете відстежити. Перегляньте значення змінних, які було активовано на першому етапі. Для цього в лівій бічній панелі «Шкала подій», натисніть на «Клік» (Click), а потім — на вкладку «Змінні» (Variables). Тут ви побачите значення, які прийняли змінні. 

Кнопка має ідентифікатор елементу (Click ID) і клас (Click Classes). Ця інформація знадобиться під час налаштування додаткових умов активації тригера.

Як визначити унікальний ідентифікатор 

Алгоритм наступний:

1. Якщо у елемента є ID, тоді як умову активації тригера можна використати Click ID містить.

2. Якщо в елемента є Class, тоді умова активації тригера — Click Classes дорівнює.

3. Якщо немає жодного з цих елементів, обирайте: Click Element — відповідає вибору CSS. 

Цей варіант потребує поглиблених знань, що таке CSS-селектор, тому в статті я його не розглядаю. 

Етап 4. Налаштуйте тригер та створіть до нього тег

Для цього:

1. Перейдіть в контейнері до розділу «Тригери».
2. Натисніть «Створити» і створіть тригер «Клік — Усі елементи». Цього разу в розділі «Запуск тригера» оберіть «Окремі кліки». 

3. В полі для вибору додаткових умов активації тригера оберіть Click ID — містить — vin-submit.

4. Збережіть налаштування та перейдіть до розділу «Теги».
5. В правому верхньому кутку натисніть «Створити».

6. Оберіть тип тегу «Подія Google Analytics 4». 

В налаштуваннях тегу:

1. Змініть його назву.
2. Додайте ідентифікатор показника — це ідентифікатор аналітики, тег якої встановлено на сайті і який вже налаштовано в вашому контейнері GTM. 

3. Додайте назву події. Врахуйте, що назва події відображатиметься в розділі «Події» в ресурсі GA4. Вибираючи назву нової події, дотримуйтеся наведених нижче правил:

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

7. Тригером активації оберіть, налаштований на початку етапу 4, тригер «Клік на кнопку Відстежити». Натисніть «Зберегти». 

Етап 5. Перевірте налаштування

Щоби це зробити:

1. Активуйте режим попереднього перегляду. 

2. На сайті, який автоматично відкриється у режимі попереднього перегляду, натисніть на кнопку, відстеження якої налаштували.
3. Поверніться до шкали подій і виберіть подію «Клік». 
4. Якщо у розділі «Теги» ви побачите, що тег активовано, отже все зроблено правильно. 

5. Можна опублікувати контейнер. Натисніть «Надіслати» і всі зміни опублікуються. 

Відстеження кліку на кнопку за посиланням

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

1. Поверніться до тригера-помічника, який створили на другому кроці.
2. Увімкніть режим попереднього перегляду та клікніть на кнопку, наприклад, посилання на соціальні мережі. 

3. Перейдіть до шкали подій і активуйте пункт «Клік посилання». Знайдіть змінну Click URL та значення, яке вона прийняла. Його слід використати як умову активації тригера. 

Процес налаштування тригера «Клік посилання» охоплює ті ж самі кроки, що і для попереднього типу тригера. Відмінність в тому, що в полі «Тип активатора» оберіть «Клік — Лише посилання», а як і умову активації тригера — Click URL містить ‘адреса посилання’.

Перейдіть до етапу 4 — створення тега. Як тригер оберіть щойно створений «Клік посилання». Далі виконайте етап 5 — перевірте налаштування в режимі попереднього перегляду. Якщо все працює коректно — публікуйте контейнер.

Висновки

Навички роботи з Google Tag Manager допоможуть вам самостійно налаштовувати відстеження подій без залучення розробників. 

1. Увімкніть вбудовані змінні типу «Кліки».
2. Створіть тригер-помічник.
3. Визначте унікальний ідентифікатор для кнопки.
4. Налаштуйте тригер з визначеним ідентифікатором кнопки та створіть тег з відповідною назвою. 
5. Перевірте налаштування в режимі попереднього перегляду. 
6. Опублікуйте контейнер GTM.