Как настроить отслеживание электронной торговли GA4 на Shopify

Опубликовано: 2022-07-19

К настоящему времени вы должны знать, что Google закрывает Universal Analytics в июле 2023 года и переводит все на GA4. Это означает, что владельцам веб-сайтов необходимо как можно скорее настроить GA4. Для веб-сайтов электронной коммерции есть дополнительные сложности, связанные с тем, что отслеживание электронной торговли работает и в GA4. Для магазинов Shopify этот процесс был очень простым в Universal Analytics, но стал более сложным в GA4.

Читайте дальше, чтобы узнать, как легко настроить отслеживание электронной торговли GA4 на любом веб-сайте Shopify без необходимости установки приложений или использования разработчиков.

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

Создать уровень данных в Shopify

Наша первая задача — создать слой данных. Уровень данных — это простой фрагмент кода, который содержит информацию о сеансе посетителя веб-сайта. Затем эта информация может быть передана на другие платформы, такие как GTM.

Мы создали для вас уровень данных, который отображается на странице завершения заказа Shopify. Он автоматически заполняет себя информацией о заказе клиента, такой как стоимость заказа, стоимость доставки и приобретенные товары.

Скопируйте и вставьте приведенный ниже скрипт в поле «Сценарии оформления заказа» в настройках администратора Shopify. Это можно найти, перейдя в «Настройки»> «Оформление заказа и учетные записи»> «Дополнительные сценарии».
Этот уровень данных отправляет событие «покупка» в GTM, которое содержит информацию о заказе клиента.

 {% if first_time_accessed %} <script> dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object. window.dataLayer.push({ 'event': 'purchase', ecommerce: { 'transaction_id': '{{ order.name || order.order_number }}', 'value': {{ total_price | money_without_currency | remove:',' }}, // Includes tax & shipping 'tax': {{ tax_price | money_without_currency | remove:',' }}, 'shipping': {{ shipping_price | money_without_currency | remove:',' }}, 'currency': '{{ shop.currency }}', 'payment_type': '{{ order.transactions[0].gateway }}', //optional parameter 'items': [ {% for line_item in line_items %} { 'item_id': '{{ line_item.sku || line_item.product_id }}', //if no SKU exists, use product Id 'item_name': '{{ line_item.product.title }}', 'discount': {{ line_item.line_level_total_discount | money_without_currency }}, 'item_variant': '{{ line_item.variant.title }}', 'price': {{ line_item.final_price | money_without_currency }}, 'quantity': {{ line_item.quantity }} }, {% endfor %} ]} }); </script> {% endif %}**

Создать триггер срабатывания в GTM

Теперь нам нужно настроить триггер, который срабатывает, когда клиенты завершают заказ. Когда триггер срабатывает, тег, содержащий информацию о заказе, отправляется в GA4.

Нам нужно определить условия, при которых срабатывает наш триггер покупки. Условием для нашего триггера будет нажатие события покупки на нашем уровне данных. Чтобы настроить это:

Войдите в GTM, перейдите в левое меню и выберите «Триггеры».
Нажмите синюю кнопку «Новый».
Назовите свой триггер "GA4 – Покупка".
Нажмите значок «Изменить» в углу окна «Конфигурация триггера».
В разделе «Выберите тип триггера» выберите «Пользовательское событие».
В поле «Название события» введите «покупка».
Установите «Этот триггер срабатывает» на «Некоторые пользовательские события».
Установите условия события:
Событие - Равно - Покупка

Когда вы закончите, это должно выглядеть так:

Создайте переменные уровня данных в GTM

Прежде чем мы настроим наш тег, нам нужно создать переменные GTM для получения информации из нашего уровня данных. Если переменные для вас новые, думайте о них как о пакетах, содержащих небольшие биты информации.

В эти переменные добавляются определенные значения из уровня данных, которые затем отправляются в GA4.

Нам нужно создать переменные для извлечения следующих значений из вашего уровня данных:

Доход от заказа
номер заказа
Валюта
налог
Стоимость доставки
Купленные товары
В GTM в левом меню щелкните страницу «Переменные».
В поле «Пользовательские переменные» нажмите кнопку «Создать».
На этом экране вы можете создать новую переменную GTM. Вам необходимо выполнить следующий процесс для каждой из перечисленных выше переменных. Детали для каждой отдельной переменной перечислены ниже:

Доход от заказа

Название: dlv - Страница благодарности - Доход от заказа

Конфигурация переменных: