Analytics
Сейчас в сети: 1.4K
Сейчас в сети: 1.4K
Настройка целей, отслеживание электронной торговли, многоканальные последовательности и тд
Подсказки
star_border
Ответить

Отслеживание целей через JavaScript событие

Бакалавр ✭

Всем привет.

 

Как создать условие отслеживания события по выполнению/невыполнению JavaScript-а в коде страницы?

 

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

 

Нужно зафиксировать успешное выполнение скрипта:

<script>
function ml_webform_success_5187141 () {
var $ = ml_jQuery || jQuery;

$('.ml-subscribe-form-5187141 .ml-block-success').show();
$('.ml-subscribe-form-5187141 .ml-block-form').hide();
};
</script>

 

1 Ответ экспертаverified_user
1 УТВЕРЖДЕННОЕ РЕШЕНИЕ

Утвержденные решения
Лучший ответ.
Решение
Утвердил автор темы Сергій Т
Август

Re: Отслеживание целей через JavaScript событие

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

Получаете ссылку в GTM для режима отладки. В том же браузере открываете свою страницу.
Заполняете форму и смотрите, что происходит в окне отладки
2017-08-25_09-15-36.png

 

выбирая каждое событие можно посмотреть, что на тот момент было передано в dataLayer

2017-08-25_09-18-13.png

 

2017-08-25_09-19-29.png

 

2017-08-25_09-19-53.png


UniqueLead формируется он кодом загруженным по этому адресу

https://cdn.envybox.io/widget/cbk.js?wcb_code=2ecfb1472872d400fcbe39a44eec9809
Вчера не видел это событие, возможно добавили что-то на сайте.
Если оно возникает при отправке данных на всех формах, то сделайте триггер на это событие и по нему активируйте тег. После него уже возникает событие GAEvent от CallbackKILLER, можно создать триггер на него, только добавив переменные уровня данных eventCategory и eventAction и сравнивать их с теми значениями, которые передаются совместно с event GAEvent (на последнем скрине)

Раз у вас уже есть события по нужным действиям, то активируйте свои теги по ним.
По dataLayer - это просто массив объектов js, в который каждый может передать свою пару Имя и Значение.
Значение может быть само объектом со своими уже значениями.
На некоторые имена GTM автоматически запускает свои сценарии. Например на 'event' ищет, если ли триггер, который ожидает пользовательское событие, которое указано в значении (для данного примера "GAEvent"), если такой триггер есть, то GTM запускает все теги, у которых в условии активации стоит данный триггер.

Если не хотите использовать сторонние событие, то можете активировать свой тег по стандартному событию gtm.formSubmit - которое возникает при событии onsubmit формы. При этом вам нужно будет самостоятельно проверить валидность данных формы, так как это событие возникает при любой попытке отправить данные формы, в том числе и пустые поля.

Просмотреть решение в исходном сообщении

Отслеживание целей через JavaScript событие

Аспирант ✭

Вам нужно отслеживать работает  ли форма?

Отслеживание целей через JavaScript событие

Бакалавр ✭

Нужно, чтобы отправлялась информация в ГА только о заполенных формах. Привязаться к Сlass/ID нет возможности - GTM игнорирует этот скрип и привязывается к форме, хотя фактически она не была отправлена. Пришел к выводу, что оптимальнее всего было бы привязаться к надписи благодарности, но как задать это в условии не могу понять.

Отслеживание целей через JavaScript событие

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

Этот скрипт видимо показывает блок спасибо и прячет саму форму.
Если есть возможность изменить код, то добавьте после .hide(); следующую строку:

dataLayer.push({'event': 'formSuccess'});

Настройте триггер на пользовательское событие formSuccess

Если доступа к коду нет, то можете переназначить функцию в своем коде HTML, тег с ним нужно запустить по готовности DOM

<script>
ml_webform_success_5187141_old = ml_webform_success_5187141;

function ml_webform_success_5187141 () {

dataLayer.push({'event': 'formSuccess'});

ml_webform_success_5187141_old();

}

</script>

Отслеживание целей через JavaScript событие

Бакалавр ✭

Можете немного подробнее объяснить "тег с ним нужно запустить по готовности DOM"?

Мне необходимо создать "Пользовательский HTML" тег. В нем прописать скрипт, который Вы написали. И назначить триггер для этого события "Модель DOM Готова". Верно?

Отслеживание целей через JavaScript событие

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

Будет 2 тега. Первый тег Пользовательский HTML с кодом "Если доступа к коду нет ...". Запуск его по Модель DOM Готова. В нем будет формироваться пользовательское событие в нужный момент
Второй тег - передача события в аналитику, триггер на пользовательское событие 

formSuccess



Отслеживание целей через JavaScript событие

Бакалавр ✭

Спасибо, но к сожалению не помогло. В режиме предварительного просмотра на целевой странице событие с DOM сразу запускается, а второе событие при выполнении действия заставляет траницу зависнуть. Без режима просмотра проверяю в ГА - новое событие не фикситуется. Возможно есть еще варианты? Могу дать ссылку на страницу. Возможно я упустил как-то атрибут, который бы помог все это сделать без скриптов

Отслеживание целей через JavaScript событие

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

да,  давайте ссылку на страницу и режим отладки GTM

 

Отслеживание целей через JavaScript событие

Бакалавр ✭

Ccылка на сайт: https://www.tourandvisa.com/services/visa/work-visa-pl.html

Права на GTM к сожалению не могу передать - не я админ

Отслеживание целей через JavaScript событие

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

по этой ссылке совсем не та ситуация, которую описали.  

На странице всего одна родная форма, остальные встроены с сервиса рассылки mailerlite.com на который, видимо плагином, подвязан еще и callbackKiller.
Сам скрипт проверки тоже загружается с другого сайта и номера в конце случайные, поэтому предложенный способ ранее не работает. 
Но после отправки формы есть событие "GAEvent"  от callbackKiller, на которое вы можете повесить свой триггер.