ТЗ по передаче событий электронной торговли в GA-4

ТЗ по передаче событий электронной торговли в GA-4 для web-разработчика от маркетолога

Привет, друзья! Меня зовут Макс Котенко я занимаюсь web-аналитикой, интернет рекламой и в целом digital-маркетингом. Вы на моем YouTube-канале. Подписывайтесь здесь много полезных, практических уроков, которые помогут прокачать ваши IT-скилы.

Также я разрабатываю индивидуальные обучающие программы и модели внедрения маркетинговых инструментов с уклоном на развитие ваших навыков и оптимизации бизнес-проектов. Детали на моем сайте.

Это видео я записываю в первую очередь для всех людей, которые когда либо столкнуться с настройкой электронной торговли в GA-4 и в частности с самым основным и по моему опыту долго реализовыващимся шагом - это постановкой ТЗ разработчику для адаптации кода онлайн магазина под события электронной торговли в GA-4.

Данное будет полезно: интернет маркетологам, таргетологам, ппс-специалистам, проджект менеджерам и всем у кого возникла задача настроить электронную торговлю в GA-4 но есть проблема в том - что код сайта не адаптирован под передачу данных электронной торговли в GA-4.

И для этого нужно либо покупать и устанавливать отдельный модуль - при условии что движок сайта это позволяет, либо же прибегать за помощью к разработчикам и просить реализовать на вашем сайте ТЗ от Google.

Это ТЗ сейчас перед вами друзья:
https://developers.google.com/tag-manager/ecommerce-ga4?hl=ru

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

Друзья и в данном видео я постараюсь детально раскрыть суть этого ТЗ а также процесса настройки электронной торговли в GA-4 через GTM.

Таким образом видео может выполнять роль стандартного технического задания по электронной торговли, которое вы сможете просто отправить своему разработчику и просмотрев его - он точно поймет что вы от него хотите, а также он поймет процесс настройки электронной торговли через GTM для GA-4 и свою роль в данном процессе.

Процесс настройки электронной торговли для GA-4 выглядит следующим образом

Трекинг событий электронной торговли + аудит текущей ситуации в online-магазине (веб-аналитик)
Установка GTM (web-аналитик + разработчик)
Установка GA-4 через GTM (web-аналитик)
Трекинг событий электронной торговли + аудит текущей ситуации в online-магазине (веб-аналитик)
Постановка ТЗ разработчику по настройке ecommerce для GA-4 (веб-аналитик)
Реализация ТЗ по событиям и параметрам ecommerce для GA-4 (разработчик + web-аналитик) или как альтернатива установка платного модуля, если он есть (разработчик + web-аналитик)
Настройка тегов и тригеров электронной торговли в GTM для GA-4 (web-аналитик)
Трекинг и доработка событий ecommerce в DebugView (web-аналитик + разработчик)

Метод передачи данных:
dataLayer.push в GTM

Одна из основных функций GTM - это возможность собирать и передавать данные из вашего веб-сайта в другие инструменты, такие как Google Analytics 4 (GA4).

DataLayer - это виртуальная структура данных на вашем веб-сайте, которую GTM может использовать для сбора данных. dataLayer можно представить как некую коробку на вашем сайте, в которую вы можете класть любые данные, которые вам нужны, и GTM сможет их распознать и передать в GA-4 в соответствии с вашими инструкциями.

dataLayer.push - это метод, с помощью которого вы можете поместить данные в эту коробку. Это просто означает "взять эти данные и положить их в dataLayer".

Метод dataLayer.push можно вызвать при выполнении определённого действия на веб-сайте или при загрузке определённой страницы. Вот два примера:

Нажатие на кнопку: допустим, вы хотите отслеживать, когда пользователь добавляет товар в корзину. Вы можете связать dataLayer.push с действием кнопки "Добавить в корзину". Так, когда пользователь нажмёт на эту кнопку, dataLayer.push отправит информацию о товаре и событии в dataLayer.

<button id="add-to-cart-button">Add to Cart</button>
<script>
document.getElementById('add-to-cart-button').addEventListener('click', function() {
dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object.
dataLayer.push({
event: "add_to_cart",
ecommerce: {
items: [{
item_name: "Donut Friday Scented T-Shirt", // Name or ID is required.
item_id: "67890",
price: "33.75",
item_brand: "Google",
item_category: "Apparel",
item_category2: "Mens",
item_category3: "Shirts",
item_category4: "Tshirts",
item_variant: "Black",
item_list_name: "Search Results",
item_list_id: "SR123",
index: 1,
quantity: 2
}]
}
});
});
</script>

В этом примере, когда пользователь нажимает кнопку с идентификатором 'add_to_cart_button', код отправляет данные о товаре в dataLayer.

Загрузка страницы: Вы можете также использовать dataLayer.push при загрузке страницы. Это полезно, если вы хотите отслеживать просмотры определённых страниц, например страницы подтверждения покупки.

window.onload = function() {
if (window.location.pathname == '/checkout/success') { // Если это страница подтверждения покупки
dataLayer.push({
'event': 'purchase',
'ecommerce': {
'transaction_id': 'T12345',
'affiliation': 'Online Store',
'value': '59.89',
'tax': '4.90',
'shipping': '5.99',
'currency': 'EUR',
'items': [{
'item_name': 'Triblend Android T-Shirt',
'item_id': '12345',
'price': '15.25',
'item_brand': 'Google',
'item_category': 'Apparel',
'item_variant': 'Gray',
'quantity': 1
}]
}
});
}
}

В этом примере, когда страница подтверждения покупки загружается, код отправляет данные о покупке в dataLayer.

Таблица событий Ecommerce и когда срабатывает метод dataLayer.push

Обратите внимание, что точные названия кнопок и этапы могут варьироваться в зависимости от того, как устроен ваш веб-сайт или интернет-магазин.

Параметры электронной торговли для GA-4

Это стандартные параметры электронной коммерции GA4, но вы можете также создавать свои собственные параметры, если есть специфические данные, которые вы хотите отслеживать.

Какие события электронной торговли для Ga-4 настроить в приоритете:

Просмотры и показы информации о товаре++

Отправить событие “view_item, когда пользователь загружает страницу с данными товара в GTM методом dataLayer.push

Примечание: при этом очень важно чтобы событие не задваивалось, а отправлялось 1 раз на 1-го пользователя по факту просмотра 1-го товара, вот как нехорошо оно может трекается в DebugView если ошибиться с кодом.

Пример кода для передачи событий по методу dataLayer.push

dataLayer.push({ ecommerce: null });
dataLayer.push({
event: "view_item",
ecommerce: {
items: [{
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}]
}
});

2.Добавление товара в корзину

Отправить событие "add_to_cart” когда пользователь добавляет товар в корзину. Отправить в GTM методом dataLayer.push

Примечание: добавление товара в корзину также может задваивается и затраиваться - важно чтобы оно передавалось 1 раз на 1 событие. На картинке передается 4 раза на 1 событие(

При этом нужно чтобы событие add_to_cart передавалось когда мы:

Добавляет товар в корзину с карточки товара
Добавляет еще один товар в самой корзине

Пример кода для передачи событий по методу dataLayer.push

dataLayer.push({ ecommerce: null });
dataLayer.push({
event: "add_to_cart",
ecommerce: {
items: [{
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}]
}
});

3.Удаление товара из корзины

Отправить событие "remove_from_cart" когда пользователь удаляет товар из корзины. Отправить в GTM методом dataLayer.push

Пример кода для передачи событий по методу dataLayer.push

dataLayer.push({ ecommerce: null });
dataLayer.push({
event: "remove_from_cart",
ecommerce: {
items: [{
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}]
}
});

4.Начало оформление покупки

Отправить событие "begin_checkout" когда пользователь начинает процесс оформления покупки, а именно переходит на страницу оплаты товара.

Пример кода для передачи событий по методу dataLayer.push

function onCheckout() {
dataLayer.push({ ecommerce: null });
dataLayer.push({
event: "begin_checkout",
ecommerce: {
items: [{
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}]
}
});

5.Покупка

Отправить событие "purchase" когда пользователь покупает через корзину. Прошу прикрепить это событие к странице “спасибо” которое открывается после оплаты товара и в случае выбора оплаты после доставки и в случае покупки на сайте - если таких страниц 2 - просьба прикрепить его к двум страницам.

Пример кода для передачи событий по методу dataLayer.push

dataLayer.push({ ecommerce: null });
dataLayer.push({
event: "purchase",
ecommerce: {
transaction_id: "T12345", // id: транзакции
affiliation: "Online Store", // Значение cart если заказ из корзины. Значение fastorder если заказ в 1 клик
value: "294", // Итоговая сумма заказа. Разделитель десятичных - точка.
tax: "0",
shipping: "0",
currency: "UAH",
items: [{
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}, {
item_name: "Футболка: UKRAINIAN SUPER DAD, привітанням з Дня Батька”:,// Название товара
item_id: "10.07.10_S/4", // Артикул товара. Должен совпадать с ID в фиде Merchant Centre (если он есть)
price: 294 // Цена товара. Разделитель десятичных - точка.
item_brand: "Wolf", // Бренд товара
item_category: "Чоловікам", // Категория
item_category2: "Одяг", // Подкатегория 2
item_category3: "Футболки", // Подкатегория 3
item_variant: "S" // Розмір
quantity: 1 // количество товара
}]
}
});

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

Также задавайте вопросы, делитесь своими успехами и результатами в комментариях под видео!
Если у вас есть идеи и пожелания к моим будущим видео, обязательно оставляйте свои комментарии, и я постараюсь создавать полезный обучающий контент, основанный на ваших предложениях.

Да прибудет с вами Богиня Удачи! До скорых встреч!

Пример ТЗ по электронной торговли:

https://docs.google.com/document/d/1BENE7v2nAimS3Zz77F1QRQfvJW92OBgZ1bRFxEYNOE4/edit?usp=sharing

Сайт и услуги интернет маркетолога Котенко Максима
https://mahadevmax.co.ua

Обучающая платформа:
https://mahadevmax.co.ua/smmkurs

Бесплатная обучающая платформа:
https://mahadevmax.co.ua/smmbaza

ТЗ по передаче событий электронной торговли в GA-4 для разработчиков