Как добавить javascript событие в цели метрики

Яндекс Метрика поддерживает отправку целей с помощью JavaScript-событий. Это позволяет фиксировать действия, которые невозможно отследить через стандартные условия, такие как переходы по URL или клики по ссылкам. Например, можно засечь открытие модального окна, завершение анимации или успешную отправку формы без перезагрузки страницы.

Чтобы передать событие в Метрику, используется метод reachGoal объекта ym. Синтаксис: ym(ID, 'reachGoal', 'название_цели');. Вместо ID подставляется номер счётчика, а строка ‘название_цели’ должна совпадать с идентификатором цели, указанным в настройках интерфейса Метрики.

Вызов этого метода необходимо вставить в обработчик нужного события на странице. Пример для кнопки отправки формы: document.querySelector('#form-btn').addEventListener('click', function() { ym(12345678, 'reachGoal', 'form_submit'); });. Убедитесь, что счётчик Метрики загружен до вызова этого кода, иначе функция ym будет недоступна.

Для отладки используйте консоль браузера. Если событие отправлено успешно, в разделе «Цели» → «Вебвизор» или в «Отчётах по целям» появится соответствующее срабатывание. Также можно проверить, передаётся ли событие, через вкладку «Сеть» в DevTools: запрос к mc.yandex.ru/watch должен содержать параметр watch/goal.

Как добавить JavaScript событие в цели Яндекс Метрики

Для передачи события в Яндекс Метрику через JavaScript необходимо использовать метод ym с указанием идентификатора счётчика и параметров цели.

1. Убедитесь, что код счётчика Яндекс Метрики установлен на странице и загружается без ошибок.
2. Найдите ваш ID счётчика. Он указывается в коде вида ym(XXXXXX, "init", {...}).
3. Создайте цель в интерфейсе Метрики:
   • Откройте раздел «Цели» в настройках счётчика.
   • Выберите тип «Событие JavaScript».
   • Укажите идентификатор цели – произвольное название латиницей, например "form_submit".
   • Сохраните цель.
4. Добавьте вызов цели в JavaScript-код на странице:

   ym(XXXXXX, 'reachGoal', 'form_submit');

   Где XXXXXX – ваш ID счётчика, 'form_submit' – идентификатор цели.

5. Рекомендуется размещать вызов после успешного действия пользователя, например, после отправки формы:

document.querySelector('form').addEventListener('submit', function(e) {
e.preventDefault();
// логика отправки данных
ym(XXXXXX, 'reachGoal', 'form_submit');
});

Проверьте срабатывание цели через «Отладчик» в расширении Метрики для браузера или в режиме реального времени в интерфейсе счётчика.

Как подключить код счетчика Яндекс Метрики с поддержкой событий

Для корректной регистрации событий необходимо добавить на сайт стандартный код Яндекс Метрики с включённой опцией «Вебвизор» и поддержкой JavaScript API. Перейдите в интерфейс Яндекс Метрики, создайте счётчик или выберите существующий, затем в настройках включите опции «Вебвизор», «Точный показатель отказов» и «Отслеживание кликов по ссылкам». Сохраните изменения.

Скопируйте предложенный код счётчика. Вставьте его перед закрывающим тегом </head> на всех страницах сайта. Пример кода:

<script type="text/javascript" >
(function(m,e,t,r,i,k,a){
m[i]=m[i]||function();
m[i].l=1*new Date();
k=e.createElement(t),a=e.getElementsByTagName(t)[0],
k.async=1;k.src=r;a.parentNode.insertBefore(k,a)
})(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(XXXXXXX, "init", {
clickmap:true,
trackLinks:true,
accurateTrackBounce:true,
webvisor:true
});
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/XXXXXXX" style="position:absolute; left:-9999px;" alt="" /></div></noscript>

Замените XXXXXXX на ID вашего счётчика. Без этой инициализации функция ym() для отправки пользовательских событий работать не будет.

После подключения убедитесь, что тег загружается без ошибок. Используйте консоль браузера или вкладку «Сеть» (Network), чтобы проверить наличие запроса к tag.js и успешную инициализацию счётчика.

Где найти ID счетчика и как его правильно использовать в коде

Для передачи события через JavaScript ID требуется в вызове функции ym(). Пример правильной вставки:

ym(12345678, 'reachGoal', 'form_submit');

Число 12345678 – это ID счетчика, 'reachGoal' – метод вызова цели, 'form_submit' – название цели, заданное в настройках Метрики. Важно, чтобы название цели полностью совпадало с тем, что указано в интерфейсе Метрики.

Если на сайте установлено несколько счетчиков, убедитесь, что используете ID именно того, в котором настроена нужная цель. При динамической подгрузке элементов вызывайте ym() только после полной инициализации Метрики, иначе событие не будет зафиксировано.

Как настроить цель типа «Событие» в интерфейсе Яндекс Метрики

Откройте интерфейс Яндекс Метрики, выберите нужный счётчик. Перейдите в раздел «Цели» и нажмите кнопку «Добавить цель».

В поле «Название цели» введите идентификатор, который будет понятен при анализе отчётов.

В качестве типа выберите «Событие».

Укажите параметры события: Категория, Действие, Ярлык. Эти поля должны точно совпадать с аргументами, передаваемыми в метод ym() на стороне сайта. Например, если используется вызов ym(XXXXXX, ‘reachGoal’, ‘button_click’), то в поле Действие нужно указать button_click.

Поля Категория и Ярлык можно оставить пустыми, если вы передаёте только действие. Но если на сайте используется триада параметров (категория, действие, ярлык) через params, необходимо заполнить все три поля идентично вызову.

После заполнения нажмите «Добавить цель». Проверьте, появилась ли цель в списке активных. Данные начнут поступать после срабатывания соответствующего события на сайте.

Как вызвать цель с помощью функции ym() в JavaScript

Пример базового вызова:

ym(12345678, 'reachGoal', 'form_submit');

Цель с именем 'form_submit' должна быть заранее создана в настройках счётчика. Идентификатор счётчика можно найти в личном кабинете Метрики.

Допускается передача дополнительного объекта с параметрами, если в отчётах требуется анализировать детали события:

ym(12345678, 'reachGoal', 'order_complete', {price: 1000, currency: 'RUB'});

Вызов должен происходить после загрузки кода Метрики. Чтобы избежать ошибок, обёртывание вызова в конструкцию window.onload или использование колбэка в асинхронной загрузке счётчика обеспечивает корректное выполнение:

window.addEventListener('load', function() {
ym(12345678, 'reachGoal', 'page_view');
});

Функция ym() доступна только после инициализации счётчика, поэтому вызов до загрузки может не сработать. Для отслеживания нажатий на элементы используйте привязку обработчика события:

document.getElementById('buy-button').addEventListener('click', function() {
ym(12345678, 'reachGoal', 'buy_click');
});

При отладке проверяйте, отправляются ли цели в режиме реального времени в интерфейсе Метрики или через консоль браузера с включённой вкладкой «Сеть» – запрос вида watch/ с параметром ar=1 указывает на успешную отправку события.

Как проверить срабатывание цели через отладчик Метрики

Для проверки срабатывания цели, заданной через JavaScript, используйте встроенный отладчик Метрики в браузере.

1. Откройте сайт, где установлена Метрика, в браузере Google Chrome или Firefox.
2. Откройте инструменты разработчика (F12 или Ctrl+Shift+I), перейдите на вкладку «Console».
3. Перед выполнением действия, которое должно отправить цель, введите в консоль:

   yaCounterXXXXXX.params

   Где XXXXXX – ваш ID счётчика. Если параметр существует, счётчик загружен корректно.

4. Выполните действие на странице, при котором должна сработать цель (например, нажатие кнопки).
5. Проверьте в консоли наличие вызова функции:

   yaCounterXXXXXX.reachGoal('имя_цели')

   Если видите ошибку, цель не была вызвана. Проверьте синтаксис и наличие счётчика на странице.

6. Для подтверждения отправки цели перейдите на вкладку «Network» и введите в фильтр watch.
7. Найдите запрос вида:

   https://mc.yandex.ru/watch/XXXXXX

   Откройте его и убедитесь, что в параметрах есть site-info с именем цели.

8. Дополнительно откройте интерфейс Метрики → Счётчик → Вебвизор и найдите сессию с тестированием цели. Воспроизведите и проверьте наличие события.

Если цель не срабатывает, проверьте наличие блокировщиков (AdBlock, uBlock) и отключите их на время отладки.

Что делать, если цель не срабатывает: типичные ошибки и их решение

1. Неправильно указан идентификатор счетчика

Проверьте значение переменной ym(НомерСчетчика, …). Часто ошибка возникает из-за копирования кода с другого ресурса или тестового окружения. Убедитесь, что номер счетчика соответствует текущему сайту.

2. Цель не настроена в интерфейсе Метрики

Откройте раздел «Цели» в настройках счетчика. Убедитесь, что цель существует и активна. При использовании JavaScript-события тип цели должен быть «Событие».

3. Ошибки в синтаксисе вызова события

Формат должен быть точным: ym(НомерСчетчика, ‘reachGoal’, ‘имя_цели’);. Название цели чувствительно к регистру. Дополнительные параметры можно передавать только как объект четко по синтаксису.

4. Цель вызывается до загрузки счетчика

Скрипт Метрики должен быть полностью загружен до вызова ym(…). Используйте отложенный вызов: например, через setTimeout или обработчик событий DOM.

5. Конфликт с блокировщиками рекламы

Некоторые расширения браузеров блокируют загрузку Метрики. Проверьте поведение цели в режиме инкогнито без расширений. На сайте используйте fallback-обработку событий, если точность критична.

6. Неверно задано имя цели

В коде сайта имя цели должно точно совпадать с тем, что указано в интерфейсе Метрики. Например, ‘form_submit’ не сработает, если в Метрике задано ‘Form_Submit’.

7. Цель не успевает отправиться из-за редиректа

При переходе на другую страницу сразу после вызова reachGoal событие может не отправиться. Используйте event.preventDefault() и вызывайте редирект через setTimeout с задержкой не менее 300 мс.

Вопрос-ответ:

Какие события можно отслеживать через Яндекс Метрику?

С помощью Яндекс Метрики можно отслеживать различные действия пользователей на сайте, например: клики по кнопкам, просмотры страниц, отправка форм, прокрутка страницы, взаимодействие с элементами, как видео или карусели. Все эти действия можно привязать к целям, чтобы точно понять поведение пользователей и измерить эффективность сайта.

Как проверить, что событие в Яндекс Метрике сработало правильно?

Для проверки правильности работы события в Яндекс Метрике можно использовать инструмент «Отладчик Яндекс Метрики». Для этого нужно в браузере открыть консоль разработчика и посмотреть, отправляются ли данные события. Если событие сработало, в консоли появится запрос на сервер Яндекс Метрики с информацией о событии. Также можно проверить статистику по этой цели в интерфейсе Яндекс Метрики через несколько часов, чтобы убедиться в том, что данные корректно отслеживаются.