Отслеживание отправки форм через Google Tag Manager

Почему отслеживание клика по кнопке искажает аналитику

Распространенная ошибка при настройке целей — вешать триггер на обычный клик по кнопке «Отправить». Пользователь может нажать кнопку с пустыми полями, ошибиться в формате телефона или кликнуть несколько раз подряд из-за медленного соединения. В счетчиках такой клик засчитается как лид, хотя реальная заявка в систему не поступила.

Корректная аналитика должна фиксировать факт успешной валидации и отправки данных на сервер. Только тогда отчеты отражают действительную стоимость привлечения клиента и реальную эффективность рекламных каналов.

Встроенный триггер «Отправка формы» в GTM

В Google Tag Manager есть предустановленный тип триггера — «Отправка формы» (Form Submission). Он слушает стандартное браузерное событие submit в HTML-форме и позволяет включить встроенную опцию «Проверить валидацию» (Check Validation).

Этот подход хорошо работает на классических сайтах со стандартной версткой, но имеет технические ограничения:

• Триггер опирается на стандартную HTML-валидацию и может игнорировать кастомные скрипты проверки полей на JavaScript.
• Если форма отправляется через AJAX без перезагрузки страницы или перехватывает событие отправки через event.preventDefault(), встроенный триггер часто не срабатывает вовсе.
• При наличии нескольких форм на странице требуется фильтрация по ID формы, CSS-классам или целевому URL, чтобы данные не смешивались в один общий отчет.

События dataLayer как наиболее надежный стандарт

Когда формы работают на современных скриптах, лучшим решением становится отправка кастомного события в массив dataLayer. Разработчик формы добавляет вызов специального метода только в ветку кода, которая получает подтверждение от сервера о сохранении заявки.

В коде сайта это выглядит как вызов функции dataLayer.push() с уникальным названием события, например form_lead_sent. В интерфейсе GTM под это событие создается триггер типа «Пользовательское событие» (Custom Event), который активирует нужные теги аналитики.

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

Альтернативные методы: триггер видимости элемента

Если доступ к исходному коду сайта ограничен и оперативно внедрить dataLayer.push силами разработчика не получается, применяют триггер видимости элемента (Element Visibility). Метод подходит для форм, которые после успешной отправки показывают всплывающее окно или текстовое сообщение с благодарностью.

Перед выбором этого пути важно учесть несколько практических нюансов:

• Блок с сообщением об успехе должен иметь уникальный CSS-селектор или ID, который не используется в других элементах интерфейса.
• Элемент должен появляться в структуре DOM только после реальной отправки, а не просто становиться видимым за счет переключения стилей при клике.
• В настройках триггера необходимо включить ограничение «Один раз на страницу» или «Один раз на элемент», чтобы избежать повторного учета при прокрутке экрана.

Отладка и проверка перед публикацией

Любые изменения в контейнере GTM требуют проверки в режиме предварительного просмотра (Tag Assistant). До публикации контейнера важно протестировать все возможные сценарии взаимодействия с формой.

В процессе тестирования стоит выполнить следующие шаги:

• Отправить форму с намеренно незаполненными или ошибочными данными, чтобы убедиться, что тег не отправляет конверсию раньше времени.
• Заполнить поля корректно и проверить в панели Tag Assistant появление события и переход тега в блок «Tags Fired».
• Проверить значения переменных, которые передаются вместе с тегом, чтобы исключить передачу неопределенных значений (undefined).
• Убедиться в отчетах реального времени аналитической системы, что событие фиксируется с правильными параметрами.

Когда настраивать сбор данных самостоятельно, а когда звать веб-разработчика

Если на сайте используется типовой лендинг с одной простой формой и стандартной перезагрузкой страницы, базовую настройку можно выполнить собственными силами с помощью стандартных триггеров GTM.

Когда на проекте работают динамические формы на базе React, Vue, многошаговые опросники или интеграции с CRM через AJAX, попытки настроить учет без понимания внутренней логики скриптов ведут к искажению аналитики. В таких ситуациях разумно привлечь веб-разработчика или технического аналитика, который настроит передачу структурированных событий через dataLayer.