Как отследить отправку формы в GTM?

Question

[Резван Абдунов]

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

И все было бы легко и здорово если бы эта форма была бы обычной.
Но технически это форма подписки не форма и я никак не могу понять как такую форму можно передавать в gtm.

<div class="ulp-content" style="transform: translate(0px, 0px) scale(1);">
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-355" data-left="0" data-top="15" data-appearance="fade-in" data-appearance-speed="1000" data-appearance-delay="0" data-scrollbar="off" data-confirmation="off" style="left: 0px; top: 15px;"></div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-356" data-left="0" data-top="15" data-appearance="fade-in" data-appearance-speed="1000" data-appearance-delay="0" data-scrollbar="off" data-confirmation="off" style="left: 0px; top: 15px;"></div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-363" data-left="85" data-top="285" data-appearance="slide-up" data-appearance-speed="1000" data-appearance-delay="1000" data-scrollbar="off" data-confirmation="off" style="left: 85px; top: 285px;"><i class="fa fa-lock"></i> Мы не рассылаем Спам и не передаем третим лицам ваши данные.</div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-357" data-left="15" data-top="35" data-appearance="slide-down" data-appearance-speed="1000" data-appearance-delay="200" data-scrollbar="off" data-confirmation="off" style="left: 15px; top: 35px;">Ваш убойный заголовок</div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-359" data-left="15" data-top="155" data-appearance="slide-down" data-appearance-speed="1000" data-appearance-delay="200" data-scrollbar="off" data-confirmation="off" style="left: 15px; top: 155px;">Описание</div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-358" data-left="15" data-top="135" data-appearance="slide-right" data-appearance-speed="1000" data-appearance-delay="300" data-scrollbar="off" data-confirmation="off" style="left: 15px; top: 135px;"></div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-364" data-left="350" data-top="45" data-appearance="slide-down" data-appearance-speed="1000" data-appearance-delay="200" data-scrollbar="off" data-confirmation="off" style="left: 350px; top: 45px;">Заполните форму и нажмите кнопку (Ваш продукт)</div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-362" data-left="350" data-top="220" data-appearance="slide-up" data-appearance-speed="1000" data-appearance-delay="900" data-scrollbar="off" data-confirmation="off" style="left: 350px; top: 220px;"><a href="#" class="ulp-submit ulp-inherited" onclick="return ulp_subscribe(this);" data-label="Отправить" data-loading="Отправляю...">Отправить</a></div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-361" data-left="350" data-top="170" data-appearance="slide-left" data-appearance-speed="1000" data-appearance-delay="800" data-scrollbar="off" data-confirmation="off" style="left: 350px; top: 170px;"><input class="ulp-input ulp-input-field" type="email" name="ulp-email" placeholder="Введите Свой E-mail..." value="" onfocus="jQuery(this).removeClass('ulp-input-error');" data-tamboo-input-id="2"></div>
								<div class="ulp-layer" id="ulp-inline-layer-9T191d96aD3OKCSG-360" data-left="350" data-top="120" data-appearance="slide-right" data-appearance-speed="1000" data-appearance-delay="700" data-scrollbar="off" data-confirmation="off" style="left: 350px; top: 120px;"><input class="ulp-input ulp-input-field" type="text" name="ulp-name" placeholder="Введите Имя..." value="" onfocus="jQuery(this).removeClass('ulp-input-error');" data-tamboo-input-id="3"></div>
							</div>

ссылка на страницу с тестовой формой - https://abdunovrezvan.com/testfoma/

Comments

[Андрей Куртучкин]

Может зайти с другой стороны и заменить на форму форму? Или сделать переход на другую страницу после успешной отправки и уже это отслеживать?

Answer 1

[Евгений]

Здравствуйте!

1. В форме нет кнопки с «type=submit» - нельзя использовать триггер «Form Submission»
   
2. После отправки POST-запроса на admin-ajax.php возвращается json, который не обрабатывается никак
   

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

Остаётся слушать все ajax-запросы и отправлять их в dataLayer, а уже нужный запрос отправлять в аналитикс как событие, ну а дальше уже понятно.

Вот пример от Lunametrics:
https://www.lunametrics.com/blog/2015/08/27/ajax-e...

P.S.
Это не конечное решение, но наводка для тех, кто прочитает коммент и допишет код. У меня нет времени, к сожалению.