Всё для рекламы
и про рекламу
Навигация по статье
Настройка цели на кнопку в Яндекс.МетрикеНастройка цели на кнопку в Google AnalyticsКак вставить теги Google Analytics и Яндекс.Метрики в один html-код
Аналитика

Настройка цели на кнопку в Яндекс.Метрике и Google Analytics

267880
7
Клики по кнопке call-to-action – полезные действия, которые можно отслеживать и анализировать. Достаточно настроить цели в Яндекс.Метрике или Google Analytics.
 
В этой статье – руководство для тех, кто собирается это сделать самостоятельно, без привлечения программистов. Кстати, это достаточно легко. Смотрите сами!

Настройка цели на кнопку в Яндекс.Метрике

1) В верхнем меню нажмите «Счетчики»:
 
Настройка цели на кнопку – меню «Счетчики» в Метрике
 
2) Выберите, для какого счетчика настраивать цель. Кликните по значку настроек рядом с ним:
 
Настройка цели на кнопку – выбор счетчика в Метрике
 
 
Выйдет страница настройки.
 
3) Перейдите в раздел «Цели» и добавьте новую цель:
 
 
Настройка цели на кнопку – кнопка добавления цели.png
 
Либо кликните сразу на эту кнопку со страницы со списком счетчиков:
 
Настройка цели на кнопку – кнопка добавления цели в списке счетчиков.png
 
В Метрике 11 видов целей. Обо всех написано здесь.
 
Выберете нужную:
 
Настройка цели на кнопку – клик по кнопке
Другой способ настройки цели на кнопку.
 
Выберите тип цели «JavaScript-событие».
 
Настройка цели на кнопку – цель JavaScript-событие
Придумайте название, по которому легко понять, что за цель, и уникальный идентификатор.
 
Требования к значению идентификатора
 
  • Не повторяется на сайте более одного раза (для каждой кнопки – своя цель);
  • Соответствует тому, которое вы вставите в код сайта.
 
Когда всё готово, нажмите «Добавить цель».
 
Так как мы настраиваем цель на кнопку, нужно, чтобы при нажатии на сайте работала функция вызова цели. Для этого корректируем html-код сайта.
 
Найдите фрагмент кода, который отвечает за кнопку. Добавьте в него тег onclick:
 
<input type="button" onclick="ym(ID_СЧЕТЧИКА, 'reachGoal', 'ИДЕНТИФИКАТОР_ЦЕЛИ'); return true;" value="ТЕКСТ_КНОПКИ" />
 
Пример
 
Пользователи нажимают на сайте кнопку, чтобы подписаться. Мы отслеживаем это событие. Имя идентификатора – push_button, текст кнопки – «Подписаться».
 
  • Заменяем в теге номер счетчика и уникальный идентификатор. В итоге тег выглядит так:
 
onclick="ym(ID_СЧЕТЧИКА, 'reachGoal', 'push_button'); return true;" value="Подписаться" />
 
  • Копируем его без закрывающего символа >
  • Открываем код и находим строку с настройкой кнопки
  • Вставляем в нее тег
  • Проверяем, на месте ли закрывающий элемент />
  • Сохраняем и закрываем.

Проверка

Чтобы убедиться, что информация о нажатии на кнопку отправляется, добавьте в адрес страницы такой параметр:
 
http:///?_ym_debug=1
 
После этого проверяйте сообщения о достижении целей в консоли браузера (Ctrl + Shift + J).

Настройка цели на кнопку в Google Analytics

На некоторых сайтах после нажатия на кнопку URL не изменяется. Отследить цель в Google Аналитике можно, если добавить в код событие или виртуальную страницу.
 
Алгоритм следующий:
 
1) Узнайте код кнопки.
 
Настройка цели на кнопку – кнопка
Для этого кликните по ней правой кнопкой мыши – и выйдет такое меню:
 
Настройка цели на кнопку – кнопка «Просмотреть код»
В нем нажмите «Просмотреть код». Появится консоль справа на странице, на которой код кнопки выделится серым цветом:
 
Настройка цели на кнопку – код кнопки в Google Analytics
2) Скопируйте код кнопки для удобства в текстовый файл.
 
Получите доступ к сайту по FTP и скачайте страницу, на которой находится кнопка. Откройте исходный код документа и найдите код элемента (тот самый, который вы скопировали).
 
3) Добавьте в этот код тег события onclick по такому шаблону:
 
onClick="ga('send', 'event', 'КАТЕГОРИЯ', 'ДЕЙСТВИЕ', 'ЯРЛЫК');"
 
Вместо слов «Категория», «Действие» и «Ярлык» введите любые понятные вам слова на латинице. В дальнейшем они понадобятся при настройке цели в Google Аналитике.
 
Если мы берем виртуальную страницу, шаблон будет выглядеть так:
 
onClick=“ga (‘send’, ‘pageview’, ‘URL_СТРАНИЦЫ’);”
 
Возьмем пример, когда посетитель интернет-магазина нажимает кнопку «Купить». Назовем категорию submit и действие (то есть название события) buy_button.
 
В итоге тег события выглядит так:
 
onClick=“ga (‘send’, ‘event’, ‘submint’, ‘buy_button’);”>
 
Важно! Этот код подходит для старой версии счетчика (ga.js). Для новой версии (gtag.js) шаблон кода выглядит иначе:
 
gtag ( 'event', 'aaa', {
  'event_category' : 'bbb',
  'event_label' : 'ccc'
});
 
Здесь aaa – действие, bbb – категория, ccc – ярлык.
 
Итак, код изменен. Теперь создаем цель в Google Аналитике.
 
4) В панели «Администратор» перейдите в раздел «Цели».
 
Настройка цели на кнопку – переход к целям из администратора Google Analytics
 
Создайте цель:
 
Настройка цели на кнопку – создание цели в Google Analytics
Настройте её, как показано на скриншотах.

Тип «Событие»

Шаг 1:
 
Настройка цели на кнопку – описание цели в Google Analytics
Шаг 2: Впишите те же категорию и действие, которые задавали в коде (submit, buy_button):
 
Настройка цели на кнопку – подробные сведения о событии в Google Analytics
Сохраните.

Тип «Целевая страница»

Принцип тот же, что для цели «Просмотр страницы» (смотрите полное руководство по целям в Google Analytics), но вы подставляете значение не реальной, а виртуальной страницы.
 
Шаг 1:
 
Настройка цели на кнопку – описание цели для целевой страницы в Google Analytics
Шаг 2:
 
Настройка цели на кнопку – подробные сведения о виртуальной странице в Google Analytics
В этом поле – адрес виртуальной страницы, на которую попадает посетитель после того, как нажимает на кнопку.
 
По желанию включите опцию «Последовательность» и задайте следующие шаги. В нашем примере – это добавление в корзину и оформление заказа:
 
Настройка цели на кнопку – настройка последовательности для виртуальной страницы в Google Analytics
Сохраните.

Проверка

  • Перейдите в раздел Отчеты / Отчет в реальном времени / Конверсии;
  • В другой вкладке браузера откройте сайт и совершите целевое действие;
  • Снова переключитесь на Аналитику. Проверьте вкладку «Конверсии»:
Настройка цели на кнопку – отчеты в реальном времени в Google Analytics
 

Как вставить теги Google Analytics и Яндекс.Метрики в один html-код

Впишите все параметры  в шаблон:
 
onclick=“ga (‘send’, ‘event’, ‘КАТЕГОРИЯ’, ‘СОБЫТИЕ’); ym(ID_СЧЕТЧИКА, 'reachGoal', 'ИДЕНТИФИКАТОР_ЦЕЛИ'); return true;"
 
Добавьте этот тег в строку, которая отвечает за кнопку. Получается примерно так:
 
<div class= “button red3 cart”id= “413”>Купить</div> onClick= “ga (‘send’, ‘event’, ‘submit’, ‘buy_button’); ym(XXXXXXXX, 'reachGoal', 'push_button'); return true;">
 
Синий текст – это тег GA, оранжевый – Метрики.
 
Как видите, настроить цели на кнопку совсем не сложно.
 
Высоких вам конверсий!
Команды YAGLA и Kokoc Group ведут несколько телеграм-каналов, где публикуются мнения экспертов и авторские лонгриды о бизнесе и маркетинге, многие из которых не попадают на этот сайт. Обязательно подписывайтесь по ссылке: https://t.me/addlist/EhE5LANnrBphMjUy
Опубликовано редакцией Yagla
267880
7
27
Написать комментарий
СергейNovember 26, 2019 в 4:27 PM
Здравствуйте. Подскажите пожалуйста, так правильно?
Ольга БлагодатнаяJuly 18, 2019 в 8:00 PM
Добрый день! На нашем сайте https://myrodoslovie.ru/наши-основные-услуги есть форма обратной связи. Код кнопки выглядит вот так: Но почему-то в Яндекс-Метрике цели не учитываются. Пожалуйста, помогите найти причину. Спасибо.
Иоаннъ ЗомбиApril 4, 2019 в 4:19 PM
Добрый день! А если не напрямую на кнопку устанавливать, а с помощью скрипта. Как в скрипте прописать цели? Например есть яндекс, как добавить гугл сюда function trackUserAction(data){ if(data.action == "click" && data.target == "payment-pay-button"){ window.yaCounter000000.reachGoal('Form_Submit_BookingSK'); } }
СергейFebruary 6, 2019 в 1:49 PM
Купить
onClick=“ga (‘send’, ‘event’, ‘submint’, ‘buy_button’);”> Атрибут onClick в диве должен же быть
Дмитрий ПрядкоNovember 22, 2018 в 1:08 PM
А почему событие вне тега, к которому оно применяется? Получается что div закрылся, а потом ещё раз закрылся? Почему не:
Купить
?
Владислав ГрековJuly 19, 2018 в 9:04 AM
А подскажите как вписать код цели от Яндекс Метрики и Гугл Адвордс в код ссылки. А также два кода цели "Событие" от Яндекс Метрики в код ссылки?
Александр ЯглаJuly 25, 2018 в 11:08 AM
Владислав, можете подробнее объяснить – что значит вписать код Метрики в код ссылки? Какой ссылки? Вы хотите отслеживать клики по определенной ссылке на сайте или что?
Обсуждаемое

Как магазин кормов для животных на Ozon вывел прибыль из минуса в плюс. Несмотря на «ретроградный» «Меркурий» Статья

Как продавать на маркетплейсах продукцию с коротким сроком годности? Как решить проблемы с поставками, связанные с оформлением товаров в системе «Меркурий»? Производитель кормов для животных открыл магазин на Ozon, но быстро ушел в минус. Сделал выводы, научился выделяться на фоне конкурентов, планировать поставки и вырос из -246 000 до +46 500 рублей.1

Вы покупаете мебель или заказываете? Фабрика мебели не знала разницу и спускала деньги на бесполезную рекламу Статья

Продавать всем подряд или зайти в узкую нишу? Фабрика мебели из массива рекламировалась всем, кому просто нужна мебель. Предлагала готовую, а не на заказ, ведь покупатель ждать не любит.1

Как продвигать септики (очистные канализации) Статья

В этом кейсе мы подробно расскажем о нашем опыте работы с продвижением септиков и поделимся, как команда агентства «В точку» применила современные инструменты таргетированной рекламы для значительного увеличения числа заявок и роста продаж. Мы опишем выбранные стратегии и тактики, благодаря которым удалось не только качественно расширить воронку лидов, но и повысить реальную отдачу для бизнеса клиента.1
Свежее

Как продвигать септики (очистные канализации) Статья

В этом кейсе мы подробно расскажем о нашем опыте работы с продвижением септиков и поделимся, как команда агентства «В точку» применила современные инструменты таргетированной рекламы для значительного увеличения числа заявок и роста продаж. Мы опишем выбранные стратегии и тактики, благодаря которым удалось не только качественно расширить воронку лидов, но и повысить реальную отдачу для бизнеса клиента.1

Как управление деловой репутацией организации формирует доверие сотрудников Статья

Управление деловой репутацией давно вышло за пределы работы с внешней аудиторией и стало инструментом внутренней стабильности. Эксперты, знающие тонкости этого процесса, уверены: образ компании напрямую влияет на уровень доверия сотрудников.

Как мы набрали автослесарей по ГАЗ/УАЗ через ВК-таргет: AI, TargetHunter и супергео в деле Статья

Наше агентство«В точку» делится опытом, как с помощью современных digital-инструментов мы закрыли узкоспециализированную вакансию автослесарей по ГАЗ/УАЗ для крупного московского автосервиса. .