Аналитика и масштабирование · Цель Метрики на формы сайта

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

Один код, который ставится на любой сайт заказчика один раз и засчитывает цель в Яндекс.Метрике при отправке любой формы: квиз, заявка, попап, обратный звонок. Вы меняете в нём одно число, номер счётчика, отправляете заказчику, создаёте цель и проверяете. Без программиста.

01Впишите номер счётчикаЗамените 00000000 в первой строке на номер счётчика Метрики. Где взять: доступ к счётчику от заказчика или Ctrl+U на сайте и поиск строки mc.yandex.ru/watch/. Имя цели form_sent не трогайте.
02Поставьте на сайтСохраните код в файл metrika-form-goal.html и отправьте заказчику. Tilda: Настройки сайта → Ещё → HTML-код для вставки внутрь head → Сохранить → Опубликовать все страницы. WordPress: плагин WPCode → Header. Остальное: программист вставляет перед </head>.
03Создайте цель и проверьтеМетрика → Цели → Добавить цель → тип «JavaScript-событие» → идентификатор form_sent. Проверка: откройте сайт с ?_ym_debug=1, отправьте форму с именем «Тест», в консоли (F12) появится строка Reach goal с form_sent. Через 15 минут цель видна в Отчёты → Конверсии.
Код скопируется целиком, вместе с тегами script. Менять в нём нужно только номер счётчика
Скриптвставить в head сайта
<!-- ===== Яндекс.Метрика: цель на отправку ЛЮБОЙ формы сайта ===== -->
<!-- Заполнить два поля в начале скрипта: COUNTER и GOAL. Больше ничего менять не нужно. -->
<!-- Вставляется один раз в <head> сайта (или перед </body>), действует на все страницы и все формы. -->
<script>
(function () {
  var COUNTER = 00000000;     // ← номер счётчика Яндекс.Метрики (8–9 цифр)
  var GOAL    = 'form_sent';  // ← идентификатор цели; точно такой же создаётся в Метрике (тип «JavaScript-событие»)

  var lastSent = 0;
  function send(source, form) {
    var now = Date.now();
    if (now - lastSent < 3000) return;   // одна отправка = одна цель, защита от двойного срабатывания
    lastSent = now;
    var params = {
      source:  source,                                  // какая платформа/событие поймали отправку
      form_id: (form && (form.id || form.getAttribute('name'))) || '',
      page:    location.pathname
    };
    var yc = window['yaCounter' + COUNTER];
    if (typeof window.ym === 'function') {
      window.ym(COUNTER, 'reachGoal', GOAL, params);   // современный код счётчика
    } else if (yc && yc.reachGoal) {
      yc.reachGoal(GOAL, params);                      // старый код счётчика (yaCounterXXXX)
    } else {
      // счётчик ещё не загрузился — ставим очередь, Метрика заберёт вызов, когда загрузится
      window.ym = function () { (window.ym.a = window.ym.a || []).push(arguments); };
      window.ym(COUNTER, 'reachGoal', GOAL, params);
    }
  }

  // 1. Tilda: событие приходит только после того, как сервер принял заявку
  document.addEventListener('tildaform:aftersuccess', function (e) { send('tilda', e.target); }, true);

  // 2. WordPress, плагин Contact Form 7: письмо отправлено
  document.addEventListener('wpcf7mailsent', function (e) { send('cf7', e.target); });

  // 3. Bitrix24: CRM-формы
  window.addEventListener('b24:form:submit', function () { send('bitrix24'); });

  // 4. WordPress, плагины на jQuery: WPForms, Elementor, Ninja Forms, Gravity Forms, Forminator
  function hookJQuery() {
    if (!window.jQuery) return;
    var $ = window.jQuery;
    $(document).on('wpformsAjaxSubmitSuccess',        function (e) { send('wpforms',   e.target); });
    $(document).on('submit_success',                  function (e) { send('elementor', e.target); });
    $(document).on('nfFormSubmitResponse',            function ()  { send('ninja'); });
    $(document).on('gform_confirmation_loaded',       function ()  { send('gravity'); });
    $(document).on('forminator:form:submit:success',  function ()  { send('forminator'); });
  }
  if (window.jQuery) hookJQuery(); else window.addEventListener('load', hookJQuery);

  // 5. Все остальные HTML-формы: обычное событие отправки (после встроенной проверки полей браузером).
  //    Для Tilda и Contact Form 7 не используется — там есть точные события выше.
  document.addEventListener('submit', function (e) {
    var f = e.target;
    if (!f || f.tagName !== 'FORM') return;
    if (f.classList.contains('t-form') || f.classList.contains('wpcf7-form')) return;
    send('form', f);
  }, true);
})();
</script>
<!-- ===== /Яндекс.Метрика: цель на отправку формы ===== -->

Что получите на выходе

  • Одна цель на все формы сайта. Квиз, заявка, попап, обратный звонок и формы, которые добавят позже: код ловит их все, без правок.
  • Точный момент срабатывания. На Tilda и Contact Form 7 цель уходит только после того, как сервер принял заявку; клик с ошибкой в полях не считается. На остальных сайтах цель уходит при отправке формы.
  • Без дублей. Одна отправка засчитывается один раз, повторные сигналы в течение трёх секунд отсекаются.
  • Работает с любым кодом счётчика. Новый код ym, старый yaCounter, и даже если счётчик грузится позже скрипта: вызов встаёт в очередь и не теряется.
  • Цель для Директа. На form_sent можно ставить стратегии кампаний и собирать ретаргетинг тех, кто уже оставил заявку.
Курс «Быстрый старт в Яндекс Директ»Аналитика и масштабирование · Цель Метрики на формы сайта
Made on
Tilda