MODX EVO + Shopkeeper. Настройка сбора статистики в яндекс метрике по заказам в интернет-магазине.

MODX EVO + Shopkeeper. Настройка сбора статистики в яндекс метрике по заказам в интернет-магазине.

Столкнулся с проблемой сбора статистики в яндекс.метрике по заказам в интернет магазине построенном на связке modx evo + shopkeeper.
https://yandex.ru/support/metrika/data/e-commerce.xml
Выделил для учета 3 события:
1. Просмотр страницы товара
2. Добавление товара в корзину
3. Покупка товара (отправка заказа)

Вот такое решение получилось:

1. Просмотр страницы товара
Вставляем чанк в шаблон страницы товара:

<script type="text/javascript">
var productData = {
"price" : "[*price*]",
"name" : "[*pagetitle*]",
"brand" : "[*id:parent=`pagetitle`*]",
"id" : "[*id*]",
"category" : "[*sex:is=`1`:then=`Одежда, обувь и аксессуары/Красота/Парфюмерия/Для мужчин`:else=`Одежда, обувь и аксессуары/Красота/Парфюмерия/Для женщин`*]"
}
window.dataLayer = window.dataLayer || [];
// просмотр товара
dataLayer.push({
"ecommerce": {
"detail": {
"products": [
{
"id" : productData.id,
"name" : productData.name,
"brand" : productData.brand,
"category" : productData.category,
"price": productData.price.replace(/\s+/g, '')
}
]
}
}
});
</script>

2. Добавление в корзину
Встраиваем js в показ всплывающего окна с информацией о добавлени товара в корзину. Ну или можно данный код включить в функцию shopkeeper

<script type="text/javascript">
function fillCartCallback(form){
var prod_name = '';
if($("input[name='shk-name']",form).size()>0){
prod_name = $("input[name='shk-name']",form).val();
}

var prod_id = '';
if($("input[name='shk-id']",form).size()>0){
prod_id = $("input[name='shk-id']",form).val();
}

var prod_price = '';
if($("input[name='shk-price']",form).size()>0){
prod_price = $("input[name='shk-price']",form).val();
}

var prod_count = '';
if($("input[name='shk-count']",form).size()>0){
prod_count = $("input[name='shk-count']",form).val();
}
var prod_brand = '';
if($("input[name='shk-brand']",form).size()>0){
prod_brand = $("input[name='shk-brand']",form).val();
}
window.dataLayer = window.dataLayer || [];
dataLayer.push({
"ecommerce": {
"add": {
"products": [
{
"id": prod_id,
"name": prod_name,
"price": prod_price,
"brand": prod_brand,
"quantity": prod_count
}
]
}
}
});
}
</script>

Суть данного блока: парсится форма отправки товара в корзину, для расширения передаваемых параметров необходимо в форму добавить скрытые инпуты с передачей необходимых параметров, например:

<input type="hidden" name="shk-id" value="[+id+]" />
<input type="hidden" name="shk-name" value="[+pagetitle+]" />
<input type="hidden" name="shk-brand" value="[+brand+]" />
<input type="hidden" name="shk-price" value="[+price+]" />
<input type="hidden" name="shk-count" value="1" size="2" maxlength="3" />

3. Покупка товара.
Чтобы учесть покупку товара, решил вставлять данный js код на странице “Спасибо”. Которая показывается после отправки заказа.
За основу взял сниппет viewOrder (который показывал состав заказа после отправки заказа). Вместо стандартного шаблона к сниппету, сделал свой который формирует js код.

<script type="text/javascript">

window.dataLayer = window.dataLayer || [];
dataLayer.push({
"ecommerce": {
"purchase": {
"actionField": {
"id" : [+orderID+]
},
"products": [
[+loop+]
{
"id": [+id+],
"name": "[+name+]",
"price": [+price:spaceout+],
"brand": "[+brand+]",
"quantity": [+count+]
},
[+end_loop+]
]
}
}
});
</script>

Был еще косячок, цена из shopkeeper бралась в форматированном виде с отделением тысяч, типа 1 999, а не 1999. Для этого сделал phx сниппет phx:spaceout
<?php
return preg_replace("/\s+/", "", $output);
?>

Добавить комментарий

Ваш адрес email не будет опубликован.