Как с помощью Google Tag Manager отследить отправку формы на сайте > NetPeak - Независимость и осознанность
NetPeak Biz Tech    


Как с помощью Google Tag Manager отследить отправку формы на сайте

Как с помощью Google Tag Manager отследить отправку формы на сайте

< >

Отслеживание конверсий позволяет узнать, как часто происходят полезные действия: покупка, подписка на рассылку, отправка контактных данных и так далее. Процесс настройки зависит от типа выполняемого действия пользователем на сайте.

Клиент пришел на сайт из Facebook и оставил заявку в чате — как это отследить Рассмотрим на примерах, как настроить отслеживание конверсии, когда пользователь отправляет контактные данные в различные формы и чаты

Отслеживание с помощью триггера в Google Tag Manager

Если сайт выполнен корректно (со стороны программистов), доступен вариант отслеживания конверсии с помощью стандартного триггера в Google Tag Manager (GTM). Работает довольно редко, но тем не менее стоит попробовать.

Этот триггер прослушивает submit формы и когда происходит конверсия, передает событие gtm.formSubmit. Когда сpaбатывает событие gtm.formSubmit можно, например, отправить событие в Google ***ytics.

Проверяем корректность работы данного триггера:

  1. Создаем триггер в GTM:

  1. В режиме предварительного просмотра отправляем форму с заполненными полями. После успешной отправки ищем нужную переменную:

  • доpaбатываем наш триггер:

  1. Повторяем действие с отправкой формы, но уже без заполненных полей: если триггер не сpaбатывает, значит программисты молодцы и можем настраивать отправку форм через данный функционал.
  2. На каждую форму создаем свой собственный триггер и проверяем его.
  3. В GTM настраиваем тег, который будет передавать данные об отправке формы в Google ***ytics.
  4. Переходим на вкладку и создаем новый тег:

  1. Заполняем поля:

  • выбираем тип тега Google ***ytics — «Universal ***ytics»;
  • для удобства называем тег также, как и триггер;
  • выбираем тип отслеживания «Событие»;
  • категорию для удобства называем также, как и тег;
  • указываем настройку Google ***ytics (с указанным идентификатором отслеживания)
  1. В качестве правила активации тега указываем созданный ранее триггер.

  1. Нажимаем кнопку «Save».
  2. С помощью предварительного просмотра проверяем, как работает созданный тег при отправке формы.
  3. Настраиваем «Цель» в Google ***ytics.

Истории бизнеса и полезные фишки

Как отслеживать конверсии из всплывающего окна

Для отслеживания отправки формы такого рода необходим установленный на сайте GTM и Google ***ytics.

Пример окна:

  1. Для начала нужно настроить отслеживание события доступности элемента на сайте.
  2. Заходим в Google Tag Manager на вкладку «Triggers» и нажимаем кнопку «New».

  1. В открывшимся окне выбираем:

  1. Заполняем необходимые поля:

  • название триггера (название должно быть понятным) ;
  • метод выбора — «Селектор CSS»;
  • селектор элемента;

Селектор элемента необходимо определить на сайте. Для этого выполняем отправку формы. Затем видим всплывающее окно (или ответ сайта). Если сообщение через пару секунд пропадает, нажимаем на клавиатуре Esc — так можно остановить загрузку страницы и выполнение других сценариев. Нажимаем правой кнопкой мыши на окне и выбираем «Просмотреть код». В появившемся окне нас интересует:

Нажимаем правой кнопкой мыши и выбираем:

Копируем его и вставляем в поле № 3.

  • ставим флажок «Регистрация изменений DOM»;
  • выбираем:

Далее ставим флажок «Некоторые события типа “Доступность”». Затем выбираем из выпадающего списка значения как на изображении. Используя предварительный просмотр GTM, находим текст всплывающего окна и копируем его:

  • нажимаем «Сохранить»;

  • настраиваем тег в GTM. Он будет передавать данные об отправке формы в Google ***ytics:

Переходим на вкладку и создаем новый тег.

Далее заполняем поля:

Выбираем тип тега Google ***ytics — UA, для удобства называем тег также как и триггер.

Выбираем тип отслеживания — «Событие». Категорию называем также как и тег. Указываем настройку GA (с отмеченным идентификатором отслеживания).

В качестве правила активации тега указываем созданный ранее триггер.

Нажимаем кнопку «Save» и с помощью предварительного просмотра проверяем, насколько исправно работает созданный тег при отправке формы.

  1. Настраиваем «Цель» в Google ***ytics. Здесь начальные шаги такие же, как и при настройке цели на страницу «Спасибо». Создаем новую цель:

  • вводим название (удобнее будет использовать название аналогичное тегу) ;
  • тип — выбираем «Событие»;
  • нажимаем «Далее»;

В поле «Категория» копируем значение из поля категории, созданного тега из GTM и нажимаем «Сохранить».

Как отслеживать конверсии с помощью прослушивания ответа функции ajaxSuccess

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

Важно: все обработчики события ajaxSuccess вызываются при успешном завершении любого запроса Ajax. Код будет получать данные от функции только при успешной обработке формы и ее отправке.

  1. Для прослушивания ответа функции необходимо создать тег «Пользовательский HTML».

  1. Далее вставить код:
<script>$(document).ajaxSuccess(function(event, request, settings) { dataLayer.push({ \\\'event\\\': \\\'ajaxSuccess\\\', \\\'ajaxSuccessData\\\': { \\\'url\\\': settings.url || \\\'\\\', \\\'data\\\': settings.data || \\\'\\\', \\\'responseText\\\': request.responseText || \\\'\\\' } });});script>
  1. Данный тег должен сpaбатывать на каждой странице (при необходимости можно доработать).

  1. В режиме предварительного просмотра отправляем форму с заполненными полями. После успешной отправки ищем:  

  1. Создаем триггер для отслеживания данной формы:

  • тип триггера — «Пользовательское событие»;
  • для удобства называем триггер также, как и форму, которую отслеживаем;
  • указываем event name «ajaxSuccess»;
  • если необходимо отслеживать несколько разных форм, выбираем: «This trigger fires on — “Некоторые специальные события”». Если необходимо отслеживать только конверсии, без разграничения по типам/названиям форм — оставляем «Все специальные события»;
  • значение полей выбираем из предварительного просмотра GTM (для каждой формы отдельно). В качестве переменной выбираем «ajaxSuccessData.url — contains» и указываем значение со скриншота ниже.

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

Важно: если Ajax используется только для формы заявки, достаточно настроить триггер на пользовательское событие «ajaxSuccess».

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

  • url — адрес отправки данных ajax;
  • data — отправленные данные;
  • responseText — ответ, который пришел от сервера.

Эти данные можно использовать для фильтрации нужной вам формы.

  1. Создаем тег для передачи данных об отправке формы в Google ***ytics, как в предыдущих примерах.
  2. С помощью предварительного просмотра проверяем корректность работы тега и триггера.

Затем настраиваем «Цель» в Google ***ytics.

Важно: такой способ нуждается в тщательном тестировании и отладке.

В большинстве случаев код сpaбатывает прямо из «коробки», но могут быть свои необходимые доработки отслеживания. Необходимость доработок и тестирования зависит от «чистоты» и корректности написанного кода на сайте, от правильно определенных событий и условий их отработки.



Комментарии:

Социальный арбуз или самые популярные тематики в Facebook в Украине

Охват и средняя цена за клик в самых популярных тематиках....

14 06 2024 22:56:11

Как перестать платить за мусор в ссылочном индексе — исследование Serpstat

Как перестать платить за мусор в ссылочном индексе — исследование Serpstat При выборе SEO сервиса принято ориентироваться на объем ссылочной массы, но надежен ли такой подход? Большая база не всегда значит качество содержащихся в ней данных, а количество нередко обеспечивают спамные ссылки в отчетах....

13 06 2024 14:58:15

Как запустить онлайн марафон? Бесплатные и платные методы

Как собрать свой онлайн марафон на 500 или 1000 человек? Сколько это стоит и какие сервисы использовать. Давайте разбираться....

12 06 2024 20:50:32

Топ ошибок новичков в Google Рекламе

Топ ошибок новичков в Google Рекламе Топ-8 ошибок новичков в Google Рекламе: как сэкономить деньги при планировании рекламной кампании....

11 06 2024 22:24:12

Анна Романишина о школе английского, тайм-менеджменте и продвижении

Анна Романишина о школе английского, тайм-менеджменте и продвижении Интервью с основателем школы английского языка Progress...

10 06 2024 16:32:12

SMM без купюр. Наш тёплый ламповый SMM

SMM от Netpeak — это разработки стратегий продвижения, механики конкурсов, медиапланирование и постоянная интеpaктивная связь с клиентом с помощью «Личного кабинета»....

09 06 2024 4:19:33

Как отслеживать внутренний поиск по сайту

Как отслеживать внутренний поиск по сайту Настройка аналитики для пустого поиска, а также поиска по методам GET и POST...

08 06 2024 11:14:23

20 фактов о развитии мобильных приложений — инфографика

20 фактов о развитии мобильных приложений — инфографика Рынок мобильных приложений и его глобальные тренды из исследования App Annie...

07 06 2024 13:37:49

Выгружаем данные из Google ***ytics для 100+ проектов одновременно — кейс агентства Netpeak

Выгружаем данные из Google ***ytics для 100+ проектов одновременно — кейс агентства Netpeak Как мы создаем BI-решение для департамента поискового продвижения — первые шаги...

06 06 2024 3:37:38

Как привлечь клиентов в 2021 году. Способы лидогенерации, о которых вы могли не знать

Как привлечь клиентов в 2021 году. Способы лидогенерации, о которых вы могли не знать Как снизить стоимость лидов путём использования новых технологий...

05 06 2024 13:35:42

Digital-маркетинг по формуле 8Р

Примеры новой концепции Digital-маркетинга по формуле 8Р...

04 06 2024 9:58:28

Почему SEO-аудит сайта должен делать специалист

Почему SEO-аудит сайта должен делать специалист Как не облажаться при выборе подрядчика для SEO-аудита....

03 06 2024 18:19:20

Массовые действия в Яндекс.Директ — как управлять кампаниями оптом

Массовые действия в Яндекс.Директ — как управлять кампаниями оптом Инструкция для новичков по одновременной работе с кампаниями, а также объявлениями и группами в Яндекс.Директ...

02 06 2024 5:39:36

Как проверить качество кампаний в Google Рекламе за 10 минут

Как быстро определить, что ваш подрядчик плохо работает с рекламной кампанией....

01 06 2024 0:24:53

Обновление Яндекс.Директ Коммaндер — обзор бета-версии

Обновление Яндекс.Директ Коммaндер — обзор бета-версии В конце октября Яндекс начал открытое бета-тестирование новой версии Коммaндера. Я решила уже сейчас проверить все плюсы и минусы новой версии сервиса...

31 05 2024 12:13:31

Контекстная реклама — что это, как выглядит, как работает.

Контекстная реклама — что это, как выглядит, как работает. Всё что нужно знать про контекстную рекламу — Как выглядит, какая бывает, сколько стоит, популярные сервисы и др....

30 05 2024 8:57:51

Pitch perfect: как получить публикации в топовых медиа

Pitch perfect: как получить публикации в топовых медиа Если у вас есть продукт, о котором миру стоит узнать, книга Pitch perfect придется вам очень кстати....

29 05 2024 2:44:41

Что делать, если трафик на сайт резко упал

Что делать, если трафик на сайт резко упал Как найти и быстро исправить причины падения трафика? Совет номер один — не паниковать....

28 05 2024 15:30:13

5 железных правил IT-бухгалтеров

5 железных правил IT-бухгалтеров Бухгалтерский мир Netpeak: цель, задачи, мотивация....

27 05 2024 17:47:10

Примеры писем интернет-магазинов: лучшие e-mail письма и рассылки клиентам после покупки

Примеры писем интернет-магазинов: лучшие e-mail письма и рассылки клиентам после покупки Как надолго завоевать доверие покупателя с помощью грамотного email-маркетинга? Примеры обращений к клиенту в рассылках, текст писем для привлечения и благодарности за покупку....

26 05 2024 2:21:10

Digital стратег Даша Шигаева о работе, отчетах и киборгах

Digital стратег Даша Шигаева о работе, отчетах и киборгах Работа — рекламировать. Интервью с директором по стратегии агентства Smartica/Skykillers....

25 05 2024 0:54:52

Как запустить торговые кампании в Bing Ads

Товарные объявления торговых кампаний заметнее в выдаче, да и показываться будут и в Bing, и в Yahoo, и в AOL...

24 05 2024 5:55:41

Реклама медицинских услуг: требования и ограничения для контекстной рекламы

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

23 05 2024 7:56:32

Реклама интернет-магазина техники в Москве — как мы получили ROMI 200% в Smart Shopping за 8 месяцев

Реклама интернет-магазина техники в Москве — как мы получили ROMI 200% в Smart Shopping за 8 месяцев Как Netpeak продвигал Cifrus.ru, один из ведущих магазинов цифровой техники в Москве....

22 05 2024 7:56:10

Списки в Twitter: зачем составлять и как вынести пользу

Списки в Twitter: зачем составлять и как вынести пользу В Twitter удобно собрать список потенциальных клиентов, чтобы время от времени посматривать за их новостями...

21 05 2024 9:57:27

Что такое внутренние дубли страниц и как с ними бороться?

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

20 05 2024 2:11:59

Как привлечь дополнительный трафик с помощью SNDS-кампаний — кейсы Netpeak

Как привлечь дополнительный трафик с помощью SNDS-кампаний — кейсы Netpeak Как получить больше конверсионного трафика из поиска и не выйти за рамки KPI? Запустите SNDS-кампании...

19 05 2024 8:35:13

Как рекламировать промоакции в Google Ads и увеличить доход на 54,7% — кейс Citrus.ua

Как рекламировать промоакции в Google Ads и увеличить доход на 54,7% — кейс Citrus.ua Тонкости настройки предпраздничной рекламной промо кампании на примере Citrus.ua....

18 05 2024 6:48:35

Портрет SEO-специалиста 2019: результаты опроса Serpstat

Профессиональный уровень SEO-специалиста в штатных комaндах редко определяется конкретной категорией (Junior, Midle, Senior). Но большинство считает себя мидлами. Узнать больше!...

17 05 2024 13:34:57

Чем наш PPC-отдел круче остальных?

Чем наш PPC-отдел круче остальных? Мария Гoлyб устала отвечать на вопрос «Какие преимущества PPC-отдела в Netpeak?» и решила написать об этом пост....

16 05 2024 10:55:26

Sad But True — телеграм-канал Андрея Чумаченко. Коротко и правдиво про бизнес, самоорганизацию и управление людьми

Sad But True — телеграм-канал Андрея Чумаченко. Коротко и правдиво про бизнес, самоорганизацию и управление людьми Рассказываем про телеграм-канал со-основателя Netpeak и чем он интересен для предпринимателей, руководителей и маркетологов....

15 05 2024 1:12:16

Главред блога Netpeak про управление задачами и собой

Главред блога Netpeak про управление задачами и собой Неля Серебро рассказывает про внутреннюю кухню блога Netpeak...

14 05 2024 21:54:45

Как настроить языковую версию сайта

Если выполнить настройку не корректно, поисковик воспримет материалы как дубли контента....

13 05 2024 14:56:57

Семантическое ядро: сервисы для автоматического сбора запросов

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

12 05 2024 16:33:58

Как разработать графический интерфейс для скриптов R

Как упростить работу со скриптами на языке R? Программирование удобного интерфейса с помощью пакета «gWidgets»...

11 05 2024 22:28:45

Эти странные соцсети: явления в интернете, которые формируют тренды и нашу действительность

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

10 05 2024 9:27:26

Как настроить динамический ремаркетинг в Google Рекламе без Google Merchant Center

Как настроить динамический ремаркетинг в Google Рекламе без Google Merchant Center Создаем фид товаров, настравиваем код и списки динамического ремаркетинга для интернет-магазинов в странах, где отсутствует Google Merchant Center....

09 05 2024 5:14:29

Как сделать гифку из видео — два способа для новичков

Как сделать гифку из видео — два способа для новичков Гифка — это зациклиненное видеоизображение, рисунок-ролик, крохотный фильм, без которого трудно представить современный сайт. Как быстро создавать гифки и получать профит....

08 05 2024 17:30:45

О влиянии счастья на бизнес: как Zappos получил $1,2 млрд от Amazon за умение делать покупателей счастливыми

О влиянии счастья на бизнес: как Zappos получил $1,2 млрд от Amazon за умение делать покупателей счастливыми Клиенты возвращаются к хорошему сервису, который начинается с понятного интерфейса на сайте, продолжается в общении с вежливым сотрудником и заканчивается в общении с воспитанным курьером или менеджером в пункте самовывоза. Что ещё? Читайте!...

06 05 2024 17:15:48

Как небольшому медийному агентству выйти на новый уровень?

Как небольшому медийному агентству выйти на новый уровень? Мы хотим купить комaнду с компетенциями в сфере медиабаинга, чтобы объединить силы для развития онлайн-рынка...

05 05 2024 2:16:41

Что такое VPN-соединение и как им пользоваться

Что такое VPN-соединение и как им пользоваться VPN — технология анонимного сетевого подключения. Она позволяет организовать подсеть в уже существующем соединении. Поверхностная сеть закрыта от внешнего доступа, потому вмешаться в нее не смогут. Чтобы узнать больше, читайте дальше!...

04 05 2024 20:52:25

Продвижение на prom.ua — настраиваем аналитику, ремаркетинг, Google Merchant Center

Лафхаки для маркетологов и владельцев сайтов на Prom...

03 05 2024 6:34:29

Функции вычисляемых полей Google Data Studio

Всё, что вы хотели знать о функциях вычисляемых полей, но боялись спросить....

02 05 2024 20:16:30

Как привлечь трафик на сайт: 15+ эффективных способов

Как привлечь трафик на сайт: 15+ эффективных способов Наконец-то вы создали сайт. Вы потратили усилия на дизайн, разработку, его наполнение. Но этого оказалось недостаточно, чтобы о вашем интернет- ресурсе узнали. Как же привлечь посетителей на сайт?...

01 05 2024 8:41:42

Как настроить код динамического ремаркетинга Google Ads без программиста

Часто в распоряжении клиента только интерфейс конструктора сайтов, весьма ограниченный в функциональности. Тогда на помощь интернет-маркетологу приходит сервис Tag Manager, благодаря которому можно настроить необходимый код расширенной электронной торговли....

30 04 2024 9:50:14

10 полезных приемов работы в Редакторе AdWords

10 полезных приемов работы в Редакторе AdWords Как специалисту сэкономить время для создания и оптимизации кампаний, проверки орфографии и другие фишки. Советы из пpaктики....

29 04 2024 14:44:49

Как настроить ретаргетинг для рекламы в Instagram и Facebook

Как настроить ретаргетинг для рекламы в Instagram и Facebook Понятная инструкция для SMM-специалистов для тех, кто экспериментирует с настройками аудиторий в рекламных кампаниях. Вы увидите, как настраивать ремаркетинг на примере Facebook. Существует 10 типов индивидуализированных аудиторий в Facebook, разберем три...

28 04 2024 21:43:37

Как создать гибкий шаблон для наглядной статистики и автоматизировать отчетность для всех участников проекта

Как создать гибкий шаблон для наглядной статистики и автоматизировать отчетность для всех участников проекта Как стандартизировали сбор данных по проектам клиентов и отчетности, чтобы тратить меньше времени и не совершать лишние действия...

27 04 2024 9:18:17

Продвинутые способы аналитики кампаний на Facebook — Инспектор и внутренние диаграммы

Узнайте, как пользоваться Инспектором и внутренними диаграммами Facebook, чтобы быть в лидерах своей ниши!...

26 04 2024 6:41:27

Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::