8 (495) 215-53-73

В Москве

(048) 737-5-736

В Одессе


Главная страница Блог SEO-инструменты Отслеживание отправки форм на сайте с помощью GTM

Блог SiteClinic

Отслеживание отправки форм на сайте с помощью GTM

Для кого: SEO-специалистам

Уровень подготовки: начальный

Ранее мы уже писали о том, как установить и настроить Google Tag Manager на сайт, а также как с его помощью настроить отслеживание кликов. В этой статье мы расскажем о том, как с помощью GTM настроить отслеживание успешной отправки формы.

В зависимости от настроек CMS отслеживание отправки форм на сайте можно настроить разными способами. Например, если после отправки формы происходит перенаправление на страницу благодарности, настроить отслеживание будет очень просто, так как в таком случае конверсией можно считать посещение страницы благодарности. Соответственно, можно настроить цель без помощи GTM и вмешательства в исходный код сайта.

Достаточно настроить в Google Analytics цель «Переход на страницу благодарности».

Рисунок 1
otslezhivanie-form-v-gtm-01

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

 

Настройка отслеживания успешной отправки форм на сайте при передаче данных с помощью submit

В нашем случае такие формы отправляются на сервер через submit. Для отслеживания цели можно привязаться к классу или идентификатору формы. Для этого находим уникальный идентификатор элемента, к которому можно привязаться. В нашем случае это id-формы.

Рисунок 2
otslezhivanie-form-v-gtm-02

 

Далее проверяем, активированы ли переменные в разделе «Формы».

Рисунок 3
otslezhivanie-form-v-gtm-03

 

На следующем этапе создаём триггер с такими параметрами:
Тип: «Отправка формы»
Условия активации: «Некоторые формы»
Условие, при наступлении которого должен активироваться триггер: в нашем случае это Form ID = cfprm1 на главной странице сайта

Рисунок 4
otslezhivanie-form-v-gtm-04v2

 

Затем создаём тег с такими параметрами:
Тип тега: «Universal Analytics»
Тип отслеживания: Событие
Категория: мы назвали «Form»
Действие: мы назвали «Otpravka»
Триггер активации: триггер, созданный на предыдущем шаге

Рисунок 5
otslezhivanie-form-v-gtm-05

Рисунок 6
otslezhivanie-form-v-gtm-06

После того как мы убедились в правильной настройке тега (для этого используем режим предварительного просмотра), настраиваем отслеживание цели в Google Analytics.

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

Настройка отслеживания успешной отправки форм на сайте при передаче данных с помощью AJAX

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

А. Найти Javascript код, в котором расположена функция, отправляющая данные через AJAX;
Б. Найти в этой функции параметр «Success», отвечающий за действия, которые будут выполняться после успешной отправки данных на сервер;
В. Прописать внутри function() { … } команду
dataLayer.push({'event': 'event_name'}) заменив «name» придуманным названием.
Мы написали так:
dataLayer.push({'event': 'otpravka_form'}) 

В коде это выглядит следующим образом:

Рисунок 7
otslezhivanie-form-v-gtm-07

 

Г. Настроить отслеживание успешной отправки формы с помощью GTM. Для этого нужно создать триггер со следующими параметрами:
Тип триггера: «Пользовательское событие»
Имя события: нужно указать event, который был прописан в функции; в нашем случае это ‘otpravka_form’

Рисунок 8
otslezhivanie-form-v-gtm-08

 

Затем нужно создать тег с такими параметрами:
Тип тега: «Universal Analytics»
Тип отслеживания: Событие
Категория: мы назвали «form ajax»
Действие: мы назвали «otpravka»
Триггер активации: триггер, созданный на предыдущем шаге

Рисунок 9
otslezhivanie-form-v-gtm-09

После того как вы убедитесь в правильной настройке тега (для проверки нужно использовать режим предварительного просмотра), можете настроить отслеживание цели в Google Analytics.

По примерам, приведённым выше, вы сможете сами настроить отслеживание отправки форм на сайте. Если возникнут вопросы, пишите в комментариях, с радостью вам ответим!

Оцените статью: 
1 Star2 Stars3 Stars4 Stars5 Stars (14 оценок, среднее: 5,00 из 5)

Автор: Наталия Бондаренко, SEO-оптимизатор

n.bondarenko@siteclinic.ru

Подписаться
Наверх
  • Сергей

    Пробежав статью, я так понял, без вебмастера, мне, дурному сеошнику, эту статью читать не имеет смысла? Самостоятельно, не зная кода, отслеживание не настроишь?

    • Наталия Бондаренко

      Сергей!
      Настроить отслеживание отправки форм с помощью GTM можно без привлечения вебмастера. С помощью данной статьи вы легко настроите отслеживание. Если возникнут вопросы — пишите, с радостью Вам ответим!

  • Сергей

    А можно подробней о настройке в Google Analytics цели «Переход на страницу благодарности»? Как вы поставили Тип цели — Переход, и почему у вас не указана вторая страница, на которую должны были перейти? Или это не важно, так как ваша задача была, чтобы пришли на страницу указанную на картинке?

    • Наталия Бондаренко

      Добрый день!

      Мы указали тип цели: «Целевая страница» — http://clip2net.com/s/3ILsan5
      Не указана вторая страница, так как в нашем случает целью является переход на страницу https://siteclinic.ua/done/

  • Алексей

    По поводу настройки события по id формы, получается что событие будет срабатывать при любом нажатии на кнопку отправить форму — т.е. если юзер неверно заполнил данные либо вобще не заполнил — событие всё равно сработает?

    • Наталия Бондаренко

      Добрый день!

      Событие будет срабатывать только при успешной отправки форм

  • Наталия Бондаренко

    Спасибо за комментарий! Поправили скрин.