Настроить отслеживание кликов по кнопке Купить в 1 клик в Google Tag Manager

Часто возникает необходимость отследить количество кликов на ту или иную кнопку в интернет-магазине. Эта потребность появляется при тестировании новых элементов вебдизайна или для отслеживания конверсии на сайте. Google Tag Manager позволяет настроить отслеживание кликов на кнопку буквально за пару манипуляций, не нужно лесть в код страницы интернет-магазина и быть программистом. 

Краткая справка о том, что такое Google Tag Manager

Google Tag Manager — это отличный инструмент для СЕО специалистов и интернет-маркетологов. GTM (Google Tag Manager) обладает внушительным функционалом и этот сервис абсолютно бесплатен. 

Сервис позволяет самостоятельно управлять тегами и настраивать нужные опции, не отвлекая программиста просьбами типа «А придумай какой-нибудь код, чтобы я мог посмотреть, сколько людей кликнуло на ту красную кнопочку».

Интерфейс GTM простой и интуитивно понятный, ведь его разрабатывали для маркетологов: людей, которые не изучали программирование. 

С помощью GTM вы легко можете настроить отслеживание событий и понять, как часто посетители интернет-магазина нажимают на кнопку Купить в 1 клик или Сравнить. Результаты будут видны в Google Analytics. Так как по большей части мы работаем с платформой для создания интернет-магазинов — CS-Cart, то и примеры в нашей статье будут на базу этой платформы. 

Мы расскажем, как отследить клики по кнопке "Купить в 1 клик"

Если вы еще не настроили аккаунт в Google Tag Manager и не связали аккаунты в GTM и Google Analytics, то инструкция тут. 

Обычно сложность в отслеживании событий состоит в том, чтобы правильно идентифицировать кнопку, понять по какому признаку настроить отслеживание.

Чтобы залезть в код страницы, нужно кликнуть правой кнопкой мыши по кнопке Купить в 1 клик и выбрать английское слово Inspect или Инструменты для разработчика. Есть комбинация быстрых клавиш Shift+Ctrl+I (Показать или скрыть панель инструментов разработчика), которую тоже можно использовать.

Как только вы открыли панель для разработчика, то можете посмотреть class кнопки Купить в 1 клик.

У нас класс кнопки "Купить в 1 клик" — это "cm-dialog-opener cm-dialog-auto-size ty-btn ty-cr-product-button cm-dialog-destroy-on-close".

Обратите внимание, что мы рассматриваем платформу CS-Cart.

Итак, чтобы настроить отслеживание кликов, нужно перейти в Google Tag Manager и создать новый триггер для "прослушивания" события, потом новый тэг и в этот тэг добавляем созданный триггер. 

Триггер (от анг. слова trigger в значении спусковой крючок, или приводящий в действие элемент) в GTM – это условие, при котором активируется или блокируется тег. Для запуска тега должен быть хотя бы один триггер.

Создаем триггер в Tag Manager

Назовем наш триггер "Нажатие на кнопку Купить в 1 клик".

• Тип триггера - Клик- Все элементы,
• Условие активации триггера - Некоторые клики. 
• Click Classes содержит cm-dialog-opener cm-dialog-auto-size ty-btn ty-cr-product-button cm-dialog-destroy-on-close (Это класс кнопки Купить в 1 клик, который мы посмотрели заранее).

Создаем новый тэг

Как только мы создали триггер "Нажатие на кнопку Купить в 1 клик", то нам нужно создать Тэг, где будет нужен этот триггер.

Настройки нового тэга "UA-Нажатие на кнопку Купить в 1 клик" смотрите на скриншоте выше. Мы обычно указываем в названиях тэга для какой системы аналитики создан тэг. Здесь мы указали UA (Universal Analytics), что подсказывает менеджеру в Tag Manager, что данный тэг сделан для Google счетчика, а не для Яндекс системы. 

Далее, мы поставили такие настройки:

• Тип отслеживания — Событие
• Категория — Button
• Действие — Click

Далее в настройках тэга в Google Tag Manager указываем переменную Google Analytics, которую создавали ранее, когда связывали аккаунты Tag Manager и Google Analytics. 

И добавляем ранее созданный триггер "Нажатие на кнопку Купить в 1 клик"

Обратите внимание, что после того, как настроен тэг на отслеживание кликов по кнопке, нужно создать соответствующую цель в Google Analytics аккаунте. При настройке цели в Аналитике Гугл нужно выбрать отслеживание события и указывать те настройки, которые указали в тэге в Google Tag Manager. 

Чтобы проверить правильность настройки тэга на отслеживание события, вы должны перейти к "Предварительному просмотру" и проверить изменения с помощью Tag Assistance.

 Не забудьте отключить все блокировщики рекламы в браузере. Если этого не сделать, то Tag Assistance не сможет подсоединиться к сайту. 

Вы запустили режим предварительного просмотра. Запустили сайт. 

• Tags Fired — это тэги, которые сработали на сайте, т.е. сработал триггер для запуска этого тэга.
• Tags Not Fired — это тэги, которые еще не запущены, так как еще не сработал триггер. Как только вы кликните по кнопке Купить в 1 клик, то тэг "UA-Нажатие на кнопку Купить в 1 клик" перейдет в раздел Tags Fired. Это будет значить, что тэг успешно настроен и отлично работает. Теперь можно переходить к публикации изменений в Tag Manager и сохранять изменения. Как только вы опубликуете контейнер с изменениями, настроите цель на клик в Google Analytics, то увидите результаты в Google Analytics отчетах реального времени и  в конверсиях. 

Если вы все сделали верно, то уже на следующий день будете видеть в Google Analytics, сколько кликов было совершено на кнопку Купить в 1 клик  в интернет-магазине на CS-Cart платформе.

Если вам нужно настроить цели в Tag Manager, то мы с удовольствием поможем.

Напишите нам