Всем привет! Я к Вам с новой полезностью)
В этот раз, благодаря Виктору Кончишину, и его разработанным кодам, мы очень подробно разберем отправку конверсии с виджет – формы Getcourse. Давайте подробнее о задаче с которой я столкнулась, а Виктор профессионально справился!
У меня есть сайт на Тильде, на нем установлен виджет-форма с GetCourse. Трафик ведется на основной сайт Тильды, но вот заявки при отправке формы не все падают в рекламный кабинет, это замедляет процесс обучения и затрудняет процесс оптимизации рекламных кампании!
Почему так происходит?
На сайте Тильды (домен https://paf.pavlova-google.ru) в куках сохраняется gclid, смотрим ниже, ?gclid=Cjw…
Но когда мы переходим на домен GetCourse (домен https://testpavl.getcourse.ru/), gclid в куках не сохраняется, и конверсия которая срабатывает в GetCourse не падает в рекламный кабинет, так как потерян идентификатор клика Google (GCLID).
Для того, чтобы это не происходило, мы будем дублировать событие которое срабатывает при отправке виджет-формы на домене GetCourse на домен Тильды, и gclid будет сохранятся!
Поехали)
Первостепенно мы должны установить GTM на виджет – формы GetCourse, и прописать код DataLayer в ней.
Заходим на платформу GetCourse – Сайты – Виджеты – Выбираем нужный виджет – Настройки:
Выбираем HTML и вставляем код GTM (только верхнюю часть кода), поднимаем HTML на самый верх:
И:
В обработчике формы Выбираем Произвольное действие – Вызов Javascript – Добавляем код – Вызвать до редиректа:
И:
Код произвольного действия
dataLayer.push ({'event': 'sendForm_GetCource'});
Сохраняем и закрываем!
Переходим к настройкам Google Tag Manager
Создаем тег Пользовательский HTML – Тильда слушатель:
Вставляем в него нижеприведенный код:
<script>
(function() {
window.addEventListener("message", function(event) {
if (!event.data || event.data.event !== "dataLayerEvent") return; // Проверяем, что это событие dataLayer
var eventData = event.data.data;
if (eventData.event === "sendForm_Get") { // Проверяем только нужное событие
console.log("Получено событие sendForm_Get из iframe");
// Добавляем событие в dataLayer родительского сайта
window.dataLayer = window.dataLayer || [];
window.dataLayer.push(eventData);
}
});
console.log("Listening for dataLayer");
})();
</script>
Создаем Триггер слушатель Тильда
Создаем триггер Модель DOM готова, условия активации триггера Некоторые события – Модель DOM готова:
- {{Page Hostname}} содержит домен сайта на тильде
Если У Вас несколько сайтов участвуют в трафике, то используем другую настройку:
- {{Page Hostname}} соответствует регулярному выражению домен_сайта_на_тильде|домен_сайта_на_тильде2|домен_сайта_на_тильде3
Теперь создаем тег Пользовательский HTML – GetCourse слушатель
Код слушатель GetCourse
<script>
(function() {
var originalPush = window.dataLayer.push; // Сохраняем оригинальный метод push
window.dataLayer.push = function(eventData) {
originalPush.apply(window.dataLayer, arguments); // Вызываем оригинальный push
// Отправляем только событие sendForm_GetCource в родительский сайт
if (eventData.event === "sendForm_GetCource") {
window.parent.postMessage({
event: "dataLayerEvent",
data: { event: "sendForm_Get" } // Переименовываем событие
}, "*"); // "*" можно заменить на конкретный домен
}
};
console.log("Iframe dataLayer");
})();
</script>
Создаем Триггер слушатель GetCourse
Создаем триггер GetCourse – Модель DOM готова, условия активации триггера Некоторые события – Модель DOM готова:
- {{Page Hostname}} содержит домен GetCourse
Теперь создаем Триггер специального события – sendForm_GetCource. Это событие, которое срабатывает на GetCourse:
Создаем триггер специального события sendForm_Get. Это событие, которое дублируется на Тильду, при срабатывании события sendForm_GetCource на GetCourse.
Далее, создаем действие конверсии для GAD, мы с Вами это изучали, триггер активации выбираем специальное событие sendForm_Get и идем в предварительный просмотр.
Приступаем к проверке. Нажимаем предварительный просмотр:
Важный момент! Когда Вы будете проверять корректность работы в первый раз после установки GTM на виджет, у Вас в отладчике событий всплывет данное сообщение! Нажмите включить! Иначе Вы не увидите действия которые происходят на виджете!
Тег GTM обнаружен на сайте тильды и на виджете GetCourse:
В режиме отладки тег слушателя Тильда срабатывает на Тильде:
Тег слушателя GetCourse срабатывает на Виджете GetCourse:
При отправки формы на сайте конверсия срабатывает на Тильде, а значит gclid отправляется в рекламный кабинет Google Ads. УРА-А-А!!!
Не забудьте после проверки отправить на публикацию контейнер в Google Tag Manager.
Спасибо за внимание! Для настройки рекламных кампаний в Google Ads и Яндекс Директ, а также настройки веб-аналитики обращайтесь в Telegram: @AFPAVLOVA
