Теперь AdWords – это Google Реклама. Новое название отражает, что сервис включает в себя различные рекламные инструменты в поисковой и контекстно-медийной сетях, на YouTube и не только. Подробнее

Analytics
Сейчас в сети: 101
Сейчас в сети: 101
Вопросы настройки тегов, правила и макросы, администрирование GTM
Подсказки
star_border
Ответить

Отправка данных из формы в пользовательские параметры GA через GTM

Студент ✭ ✭ ✭

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

 

Задача такая: при отправке формы на сайте необходимо цеплять данные из формы и кидать их в пользовательские параметры GA через GTM.

сделано:

 

1. создание нового пользовательского параметра в аналитике - dimension9

 

Снимок.JPG

 

2. создание в GTM новой переменной название name тип "собственный код javascript"

 

 сам код:

 

function getName() {
var form = document.querySelector("form");
var elements = form.getElementsByTagName('input');

for (var i = 0; i < elements.length; i++) {
var input = elements[i];
if (input.type == "text"){
if(~input.value.search( /^[a-zA-Zа-яёА-ЯЁ\s\-]+$/ )){
var name = input.value;
console.log(name);
}
}
}
return(name);}

 

2. настройка тега отправки события в аналитику,  в нем задание "специального парметра" в качестве индекса "9" в качестве значения параметра созданная ранее переменная "name" 

 

 

 

Снимок.JPG

 

 

в результате нихрена не работает((  помогите разобраться.

 

Снимок.JPG

 

 

1 Ответ экспертаverified_user

Отправка пользовательских параметров данные формы через GTM

Студент ✭ ✭ ✭

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

Отправка данных из формы в пользовательские параметры GA через GTM

Ведущий участник

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

Отправка данных из формы в пользовательские параметры GA через GTM

Студент ✭ ✭ ✭

"В форме могут быть и судя по коду вернется только значение последнего поля." - что?

 

смотрю, естественно, после срабатывания тега. не summary.

 

и у меня этот тег еще и два других параметра доосылает, но они задаются кодом: var phone = "test_js"; return(phone); и прилетают, а конструкция по выковыриванию данных из формы не работает.

Отправка данных из формы в пользовательские параметры GA через GTM

Ведущий участник

пришлите код формы или ссылку на страницу, будет проще, а то сейчас гадаю, сколько полей у вас в форме и с в какой они последовательности.

function getName() {
var form = document.querySelector("form");
var elements = form.getElementsByTagName('input');

for (var i = 0; i < elements.length; i++) {
var input = elements[i];
if (input.type == "text"){
if(~input.value.search( /^[a-zA-Zа-яёА-ЯЁ\s\-]+$/ )){
var name = input.value;
console.log(name);
}
}
}
return(name);}
Функция перебирает все поля input с типом текст у формы, которую найдет, и вернет последнее удовлетворяющее условию значение. Тут видимо и проблема. Поле name может не быть последним. 
Запустите внутренний код функции в консоле браузера и посмотрите, что выдает. Если не содержимое поля name, то нужно менять код функции



Отправка данных из формы в пользовательские параметры GA через GTM

Студент ✭ ✭ ✭

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

 

<form name="Dinamic_Landings_with_validation" action="/mount-man.html" method="POST" enctype="multipart/form-data" class="form-header"><input type="hidden" name="bxajaxid" id="bxajaxid_379bdd3109ad273a5fd0e2203514121b_19116" value="379bdd3109ad273a5fd0e2203514121b" class="form-control"><input type="hidden" name="AJAX_CALL" value="Y" class="form-control"><script type="text/javascript">
function _processform_19116(){
var obForm = top.BX('bxajaxid_379bdd3109ad273a5fd0e2203514121b_19116').form;
top.BX.bind(obForm, 'submit', function() {BX.ajax.submitComponentForm(this, 'comp_379bdd3109ad273a5fd0e2203514121b', true)});
top.BX.removeCustomEvent('onAjaxSuccess', _processform_19116);
}
if (top.BX('bxajaxid_379bdd3109ad273a5fd0e2203514121b_19116'))
_processform_19116();
else
top.BX.addCustomEvent('onAjaxSuccess', _processform_19116);
</script><input type="hidden" name="sessid" id="sessid" value="043e89c3a03798059bcea0c666a6ddfd" class="form-control"><input type="hidden" name="WEB_FORM_ID" value="100" class="form-control">
<div class="callback-input ">


<input type="text" placeholder="Фамилия и Имя" name="form_text_1154" value="" size="0" class="form-control">
</div>
<div class="callback-input ">


<input type="text" placeholder="Ваш телефон" name="form_text_1155" value="" size="0" class="form-control">
</div>
<div class="callback-input ">


<input type="text" placeholder="Ваш Email" name="form_email_1156" value="" size="0" class="form-control">
</div>
<div class="callback-input ">


<select class="inputselect form-control" name="form_dropdown_education" id="form_dropdown_education"><option selected="" hidden="" value="">Укажите ваше образование</option><option value="1157">среднее (школа) </option><option value="1158">средне-специальное (колледж, техникум) </option><option value="1159">одно и более высших</option></select>
</div>
<input type="hidden" name="form_hidden_1160" value="" class="form-control">
<input type="hidden" name="form_hidden_1161" value="MBA General + рассрочка на 3 месяца | 96 000 руб." class="form-control">
<input type="hidden" name="form_hidden_1162" value="/mount-man.html" class="form-control">
<input type="hidden" name="form_hidden_1163" value="96000" class="form-control">
<input type="hidden" name="form_hidden_1164" value="" class="form-control">
<input type="hidden" name="form_hidden_1165" value="2062" class="form-control">
<input type="hidden" name="form_hidden_1166" value="16" class="form-control">
<input type="hidden" id="clientId" class="clientId form-control" name="form_hidden_1167" value="GA1.2.582629879.1500634737"> <input type="hidden" name="form_hidden_1309" value="dir_59720ce2f1c2a" class="form-control">
<input type="hidden" name="form_hidden_1313" value="learningmba.ru/mount-man.html" class="form-control">
<input type="hidden" name="form_hidden_1319" value="" class="form-control">
<div class="callback-input ">


<input type="text" class="inputtext form-control" name="form_text_1326" value="" size="0">
</div>


<div class="callback-submit">
<button type="submit" class="submit" name="web_form_submit">Оставить заявку на обучение</button>
</div>

<div style="display:none;">
<input type="submit" name="web_form_submit" value="Отправить заявку" class="form-control">
&nbsp;<input type="reset" value="Сбросить" class="form-control">
</div>
<input type="hidden" name="web_form_submit" value="Отправить заявку" class="form-control">
</form>

Отправка данных из формы в пользовательские параметры GA через GTM

Ведущий участник

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

function getName() {
return $("form.form-header input[name='form_text_1154']:not(Показывающий языкlaceholder-shown)").val();
}

 

Даже внутри поле code смайлик показывает, вместо него : p слитно

Отправка данных из формы в пользовательские параметры GA через GTM

Студент ✭ ✭ ✭

Андрей, спасибо большое за помощь, но мне нужно не один лендинг подцепить а все. а метод input[name='form_text_1154'] подходит только для этой формы на этом лэндинге, не более.

 

Боюсь, мне придется перебирать все input на лэндинге, сейчас придумали так, но тоже не работает:

function() {
var forms = document.getElementsByTagName('form');
for(var key = 0; key < forms.length; key++){
var elements = forms[key].getElementsByTagName('input');
var regex = /[\d@]/;
for (var i = 0; i < elements.length; i++) {
var input = elements[i];
if (input.type == "text"){
if(!regex.test(input.value) && input.value.length>3){
return input.value;
}
}
}
}

 

Отправка данных из формы в пользовательские параметры GA через GTM

Ведущий участник

Если разрабатывали разные подрядчики, с разным количеством форм на странице и разным способом их отправки, то универсального способа не будет.
Или формы нужно в один вид привести, или добавить передачу данных в GTM через dataLayer или JS, или подстраиваться под каждую страницу.
Можете добавить переменную с таблицей подстановки, где name будет меняться в зависимости от домена сайта. Вам тогда, при добавлении новой страницы, нужно будет прописать новый селектор поля имени, а код в GTM импортировать из раза в раз без изменений. 

Отправка данных из формы в пользовательские параметры GA через GTM

Студент ✭ ✭ ✭

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

 

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

 

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

 

так что чиним форму свою убогую. спасибо за участие))) я на финишной.