Вернуться на предыдущую страницу

Часто необходимо быстро найти решение, которое бы работало. Но даже в официальной документации яндекса, на момент написания этой статьи, код нерабочий или возвращающий неверные значения.

Рабочий пример цели при отправке формы:

<form id="modal-callback-pdf" onsubmit="yaCounter53916664.reachGoal('form_pdf'); return true;">
<div class="success">
<span>Спасибо за заявку!<br>Мы свяжемся с вами<br> в ближайшее время</span>
</div>
<input type="hidden" name="admin-data">
<h3 class="modal-pdf-title">Отправим Вам презентацию в течении 5 минут</h3>
<input type="hidden" name="project_name" value="FOX">
<input type="hidden" name="admin_email" value="sun@gmail.com">
<input type="hidden" name="form_subject" value="Скачать полную презентацию">
<div class="group">
<p>Введите свои данные и мы Вам отправим презентацию</p>
<input type="text" name="name" placeholder="Ваше имя">
</div>
<div class="group">
<p>За номером мы зафиксируем специальные условия</p>
<input type="tel" name="phone" placeholder="Ваш Телефон" required>
</div>
<div class="button-wrap pdf">
<button class="btn-callback button" type="submit">
<span>Скачать полную презентацию</span>
<small class="pdf">PDF — 2.1 mb</small>
</button>
</div>
</form>

Где важным является именно:

onsubmit="yaCounter53916664.reachGoal('form_pdf'); return true;"

где yaCounter53916664 - цифры - это НОМЕР СЧЕТЧИКА!, а не цели!

Укажите номер вашего счетчика, правильно назовите «идентификатор цели» (на англ. языке, БЕЗ пробелов). И в результате все будет хо.

Пример использования JavaScript обработчика событий достижения цели:

$(".pdf").on('click',function() {
  ym(54979558, 'reachGoal', 'form_pdf');
})

А также после удачного AJAX запроса:

$("form.modal-callback.btmfrm").submit(function(e) {
e.preventDefault()
var th = $(this);
$.ajax({
type: "POST",
url: "mail.php",
data: th.serialize()
}).done(function() {
ym(54979558, 'reachGoal', 'konsutlniz');
console.log('form ok btm')
setTimeout(function() {
location.href='/success.html';
}, 1000)
});
});

где ym(54979558, 'reachGoal', 'konsutlniz');

54979558 - идентификатор !счетчика!, а НЕ цели!,
konsutlniz - название цели!

Также можно другой код вешать на форму:

<form class="modal-callback wow fadeInUp" onsubmit="ym(56179804, 'reachGoal', 'konsutlniz'); return true;">
...
</form>

где onsubmit="ym(56179804, 'reachGoal', 'konsutlniz'); return true;"

56179804 - идентификатор СЧЕТЧИКА!
konsutlniz - название цели

Номер идентификатора счетчика можно взять здесь:

Или здесь

Для тех, кто не хочет смотреть видео:

1. Заходим в метрику, выбираем нужный сайт. Заходим в шестеренку Настройка > Цели > Добавить цель

2. Выбираем JavaScript-событие. Вводим понятное для Вас название на русском, а идентификатор цели на английском без пробелов (это просто для фен-шуя).

3. Вставляем в исходный HTML код вот это:

onsubmit="yaCounter53916664.reachGoal('form_pdf'); return true;"

где yaCounter53916664 – замените на Ваш номер счетчика, а reachGoal('_vash_id_tceli_')

Дебаг Яндекс Метрики:

https://site.org/?_ym_debug=1
?_ym_debug=1
Настройка целей на форме в Яндекс метрике JavaScript события