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

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

293989
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
293989
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
Владислав, можете подробнее объяснить – что значит вписать код Метрики в код ссылки? Какой ссылки? Вы хотите отслеживать клики по определенной ссылке на сайте или что?
Обсуждаемое

5 фраз из-за которых администраторы клиники косметологии теряют до 40% запись каждый месяц Статья

Есть клиники, которые тратят на рекламу столько же, сколько конкуренты, а записей у них вдвое больше и причина не в том, что у них хитрее настроен Директ или дешевле заявка, разница прячется в 40 секундах телефонного разговора, где заявка либо превращается в запись, либо уходит в "Закрыто и не реализовано". Ниже разберу пять фраз, на которых чаще всего срывается запись, и что администратор может ответить на каждую, чтобы человек дошёл до кресла.3

Как клинике косметологии собрать оффер, против которого скидка конкурентов бессильна? Статья

Есть клиники, услуги которых стоят заметно дороже конкурентов, при этом они не жалуются на пустые кресла. В то время, как конкуренты раздают скидку за скидкой и всё равно не могут заполнить пустые окна записями.3

Как клиника косметологии теряет миллионы на ушедших пациентах и почему дело не в рекламе Статья

Обычно, когда клиника косметологии считает, сколько она заработала, она смотрит на средний чек процедуры. Реклама привела человека, косметолог сделал ему хорошую чистку или один сеанс эпиляции, касса пополнилась, все довольны.3
Свежее

7 сервисов для маркетолога: CRM, отзывы, чаты, аналитика, Авито и геопродвижение Статья

Маркетинговые сервисы помогают бизнесу объединять работу с клиентами, автоматизировать коммуникации, анализировать продвижение и повышать конверсию. В подборке собрали платформы и сервисы, которые упростят работу маркетологов и фрилансеров.

Контент для B2B-продаж: как превратить возражения клиентов в статьи, которые помогают сделке Статья

Если B2B-контент не помогает продажам, чаще всего проблема не в количестве публикаций. Компания пишет «про тренды» и «про продукт», а клиент в реальной сделке задаёт совсем другие вопросы: почему так дорого, чем вы отличаетесь, что будет при интеграции, кто отвечает за риск, сколько займёт внедрение.

Контент для отложенного B2B-спроса: что писать клиенту, который вернётся через полгода Статья

В длинных B2B-продажах часть людей не отказывает. Они просто говорят: «вернёмся позже».