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

Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭

Добрый день, уважаемые коллеги

Есть интернет-магазин с возможностью покупки в 1 клик через заполнение формы из трех полей и нажатие кнопки "Отправить"

Вводные данные:

Отслеживание: Universal analytics

CMS: Magento

 

 

Вот код кнопки, в которую установлено посещение Виртуальной страницы /virtual/1clickorder

 

 

<button type="submit" title="Отправить" class="button validation-passed" onclick="ga('send', 'pageview', '/virtual/1clickorder');"><span><span>Отправить</span></span></button>

 

Вот параметры цели, которая соответствует этому куску:

 

1 раздел: Собственная (последний пункт)

Тип цели: Целевая страница

Переход: Регулярное выражение = /virtual/1clickorder (Также пробовал "Равно" вместо "Регулярное выражение")

 

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

Возможно проблема в том, что фактически кнопка отправляет форму, но не переходит на выбранную страницу и данный код необходимо добавить в php-код обработчика формы, но в гайде на этом же портале было сделано именно так, как сделал я (собственно, оттуда я это и взял)

 

+ интересно то, что изначально планировалось отслеживание самой отправки формы как цель через onsubmit

Код ниже: 

 

<form action="http://eurotools.com.ua/oneclickorder/index/post/" id="oneClickOrderForm" method="post" onsubmit="ga('send', 'event', 'order', 'purchase', 'quick_order')">

Однако этот метод не сработал (хоть он и "верняковый"). 

 

Прошу помощи в решении данной проблемы. Принимаются любые варианты. Спасибо

 

 

 

 

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

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

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

Добрый день.

Заказ отправляется без перезагрузки страницы и submit формы посредством Ajax.
Нужно найти код, который перехватывает события, и поставить код отслеживания в него.
Код находится в низу страницы:

 $es('#oneClickOrderForm').submit(function(e) {
        if (oneClickOrderForm.validator.validate()) {
            $es('#oneClickOrderFormWrapper').css('opacity',0.3);
            $es('#oneClickOrderFormAjaxLoading').fadeIn();

            var postData = $es(this).serialize();
            var formURL = $es(this).attr("action");
            $es.post(
                formURL,
                postData,
                function( data ) {
                    $es( '#resultOneClickOrder' ).html( data.message );
                    $es('#oneClickOrderFormAjaxLoading').fadeOut(400, function() {
                        $es('#oneClickOrderFormWrapper').slideUp(400, function() {
                            $es( '#resultOneClickOrder').slideDown();
                            $es.fancybox.update();
                        });
                    });
                },
                'json'
            );
            e.preventDefault();
        }
    });

Добавьте:

 $es('#oneClickOrderForm').submit(function(e) {
        if (oneClickOrderForm.validator.validate()) {
            $es('#oneClickOrderFormWrapper').css('opacity',0.3);
            $es('#oneClickOrderFormAjaxLoading').fadeIn();

            var postData = $es(this).serialize();
            var formURL = $es(this).attr("action");
            $es.post(
                formURL,
                postData,
                function( data ) {
                    $es( '#resultOneClickOrder' ).html( data.message );
                    $es('#oneClickOrderFormAjaxLoading').fadeOut(400, function() {
                        $es('#oneClickOrderFormWrapper').slideUp(400, function() {
                            $es( '#resultOneClickOrder').slideDown();
                            $es.fancybox.update();
                        });
                    });
                },
                'json'
            ) .done(function() {
					ga('send', 'event', 'order', 'purchase', 'quick_order');
					});
            e.preventDefault();
        }
    });

 

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭
Андрей, Благодарю за оперативный ответ.
Попробую внедрить данный кусок кода

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

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

нужно внедрить только выделенные строки

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭
Я это и имел ввиду)

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭
Андрей, вот пример страницы, на которой этот код должен работать: http://eurotools.com.ua/frezer-interskol-fm-62-1500je-2732.html
Форма, которая будет отслеживаться вашим способом доступна по кнопке "Купить в 1 клик" (красного цвета, находится ниже фотографии товара)

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

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

на кнопку <button title="Купить в 1 Клик" class="button btn-oneclickorder" href="#oneClickOrderBlock"><span><span>Купить в 1 Клик</span></span></button>
ставите виртуальную страницу onclick="ga('send', 'pageview', '/virtual/1clickorder');"
Получиться

<button title="Купить в 1 Клик" class="button btn-oneclickorder" href="#oneClickOrderBlock" onclick="ga('send', 'pageview', '/virtual/1clickorder');"><span><span>Купить в 1 Клик</span></span></button>

Это будет виртуальная страница при показе всплывающего окна
Далее как описал выше ставите код (Начинается со стр 3726 кода страницы)
Он уже будет вызывать событие при успешной отправке формы.

P.S. Удивительно, что браузер вообще выстраивает DOM при такой количестве ошибок на странице https://validator.w3.org/check?uri=http%3A%2F%2Feurotools.com.ua%2Ffrezer-interskol-fm-62-1500je-273...
Тег <body> только встречается 11 раз! Хорошо бы все исправить, а то могут быть ошибки на разных браузерах, которые трудно будет отследить.

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭
Михаил, спасибо за совет с кнопкой, но если сделать так, то будут ложные срабатывания цели - кнопку нажали, форму не заполнили - цель есть, а конверсии нет
Потому я и хотел вешать на ту кнопку, которая отвечает за отправку формы (когда форму открываете, это синяя кнопка внизу. И там код (такой как у вас) уже есть

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Ведущий участник
Отвечу за Михаила Веселый
У Вас есть вторая цель - успешная отправка формы, если Вам для статистики не нужна информация, сколько раз открывают всплывающее окно, то можете не использовать.
Можно повесить на кнопку, только если поля неправильно заполнили, то тоже повторно будет событие отправлено. Всплывающее окно и есть новая страница, так логичней, чтобы при её всплытии засчитывался просмотр виртуальной.
Определите цели анализа, и настраивайте события, чтобы получить нужные данные

Re: Отслеживание цели через виртуальную страницу по нажатию кнопки

Магистр ✭ ✭ ✭
Да, Андрей, вы полностью правы и разделяю вашу точку зрения
Требуемые данные: Валидно заполненная форма засчитывается как конверсия
1. способ - onsubmit формы (не сработал)
2 способ - открытие Виртуальной страницыпосле аполнения и отправки формы (не уступает первому, но тоже не сработал).
Михаил подсказал, как заставить второй способ работать, просто еще не вставили код(