Трекинг-код Retail Rocket состоит из 6 скриптов, которые необходимо разместить на страницах вашего сайта.
На ваш сайт необходимо установить следующий код:
Разместите трекинг-код системы на каждой странице вашего сайта в секции <head>:
<script type="text/javascript">
var rrPartnerId = "partnerIdFromPartnerOffice";
var rrApi = {};
var rrApiOnReady = rrApiOnReady || [];
rrApi.addToBasket = rrApi.order = rrApi.categoryView = rrApi.view =
rrApi.recomMouseDown = rrApi.recomAddToCart = function() {};
(function(d) {
var ref = d.getElementsByTagName('script')[0];
var apiJs, apiJsId = 'rrApi-jssdk';
if (d.getElementById(apiJsId)) return;
apiJs = d.createElement('script');
apiJs.id = apiJsId;
apiJs.async = true;
apiJs.src = "//cdn.retailrocket.ru/content/javascript/tracking.js";
ref.parentNode.insertBefore(apiJs, ref);
}(document));
</script>
На всех страницах карточек товаров и формах быстрого просмотра необходимо установить товарный трекинг-код:
<script type="text/javascript">
(window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
// Передача данных о товарах в группе
retailrocket.productsGroup.post({
// Идентификатор группы, число без кавычек
// Если товар не объединен групповым предложением, то в качестве Group ID используйте Product ID этого товара
"groupId": <group ID>,
// Название товара
"name": "<string>",
// Цена товара, число без кавычек
"price": 777,
// Ссылка на изображение товара, не больше 1 MB. Предпочтительный размер 400-400 px. Формат изображений JPEG или PNG.
// Рекомендуем использовать изображение со страницы категории. Эти изображения будут использованы в блоках рекомендаций и письмах.
"pictureUrl": "http://example.com/path/to/Photo.jpg",
// Ссылка на товар
"url": "http://www.example.com/path/to/productPage",
// Статус наличия товара, true или false
"isAvailable": true,
// Массив, состоящий из путей до товарных категорий. В качестве разделителя между категориями
// используется косая черта (слэш). Путь до категории должен точно отражать структуру меню сайта
// и вложенность категорий (используйте только статичные названия категорий, избегайте
// использования URL путей, фильтров из боковой панели или динамических хлебных крошек).
// Передавайте пути только до самых низкоуровневых категорий: если товар находится в категориях
// "Женщинам/Одежда/Юбки" и "Женщинам/Одежда", необходимо передать только один путь -
// "Женщинам/Одежда/Юбки".
"categoryPaths": ["Example/Category/Path","Another/Category"],
// Описание товара
"description": "Some text description",
// Детали о модификациях товаров в группе
"products": {
"<product id>": {
"isAvailable": <bool>,
// Название товара, необязательный параметр
"name": "<string>",
// Цвет товара, необязательный параметр
"color": "<string>",
// Размер товара, необязательный параметр
"size": "<string>",
// Ссылка на модификацию товара, необязательный параметр
"url": "<string>",
// Ссылка на картинку модификации товара, необязательный параметр, не больше 1 MB.
// Предпочтительный размер 400-400 px. Формат изображений JPEG или PNG.
// Рекомендуем использовать изображение со страницы категории.
// Эти изображения будут использованы в блоках рекомендаций и письмах.
"pictureUrl": "<string>",
// Цена модификации товара, необязательный параметр
"price": <decimal>,
// Старая цена модификации товара, необязательный параметр
"oldPrice": <decimal>,
// Описание товара
"description": "<string>",
// Дополнительная информация о продукте, необязательный параметр
"params": {
"<custom parameter 1 name>": "<custom parameter 1 value>",
"<custom parameter 2 name>": "<custom parameter 2 value>",
"<custom parameter N name>": "<custom parameter N value>"
}
},
"<product id>": {
"isAvailable": <bool>,
"name": "<string>",
"color": "<string>",
"size": "<string>",
"url": "<string>",
"pictureUrl": "<string>",
"price": <decimal>,
"oldPrice": <decimal>,
"description": "<string>",
"params": {
"<custom parameter 1 name>": "<custom parameter 1 value>",
"<custom parameter 2 name>": "<custom parameter 2 value>",
"<custom parameter N name>": "<custom parameter N value>"
}
}
},
// Производитель товара, необязательный параметр
"vendor": "Brand name",
// Модель товара, необязательный параметр
"model": "Model name",
// Тип товара, необязательный параметр
"typePrefix": "Product type",
// Старая цена товара, необязательный параметр
"oldPrice": 999
});
// Идентификаторы товаров из просматриваемой группы, массив чисел
rrApi.groupView([<product IDs>]);
});
</script>Поле params содержит список произвольных полей, значения которых могут быть использованы в виджетах при выдаче рекомендаций или в верстке писем.
На всех страницах товарных категорий необходимо установить следующий код:
<script type="text/javascript">
(window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
// Полный путь до текущей категории с косой чертой в качестве разделителя, строка. Должен совпадать с путем, передаваемым в карточках товаров данной категории.
rrApi.categoryView("Women/Clothes/Skirts");
});
</script>На кнопках, нажатие которых приводит к добавлению товара в корзину, необходимо установить обработчик событий:
onmousedown="try { rrApi.addToBasket(<product_id>) } catch(e) {}"
Где <product_id> - ID товара.
Пример:
<div class="buy_button" onmousedown="try { rrApi.addToBasket(123) } catch(e) {}"></div>
Обратите внимание: Кнопка добавления в корзину может находиться как в карточке товара, так и в листингах. Вызов метода addToBasket нужно установить и в этом случае.
На финальной странице оформления заказа (на которой пользователю сообщают о том, что заказ сформирован, благодарят за покупку и так далее) необходимо установить обработчик совершения транзакции. Трекинг-код должен срабатывать при всех
доступных способах оплаты и доставки:
<script type="text/javascript">
(window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
try {
rrApi.setEmail("<user_email>");
rrApi.order({
"transaction": "<transaction_id>",
"items": [
{ "id": <product_id>, "qnt": <quantity>, "price": <price>},
{ "id": <product_id>, "qnt": <quantity>, "price": <price> }
]
});
} catch(e) {}
})
</script>
Где:
Пример:
<script type="text/javascript">
(window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
try {
rrApi.setEmail($('#EmailFieldID').val());
rrApi.order({
"transaction": "1235421421",
"items": [
{ "id": 12312, "qnt": 4, "price": 130 },
{ "id": 64532, "qnt": 1, "price": 220 }
]
});
} catch(e) {}
})
</script>
Каждый раз, когда вы получаете email пользователя, исполняйте код:
(window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() { rrApi.setEmail("<user_email>"); });
Важно: передавайте email только тех пользователей, которые явно выразили согласие на получение сообщений электронной почты, в том числе рекламного характера.
Пример 1: добавьте следующий атрибут для подтверждающей кнопки формы подписки, которая используется на вашем сайте:
onclick="try {rrApi.setEmail($('#EmailFieldID').val());}catch(e){}"
Пример 2: добавьте следующий код на страницу "Спасибо за заказ" если пользователь подписался на маркетинговые рассылки интернет-магазина:
<script type="text/javascript"> (window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() { rrApi.setEmail("<user_email>"); }); </script>
Пример 3: передача дополнительных данных о пользователе для дальнейшей персонализации в рассылках:
<script type="text/javascript"> (window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() { rrApi.setEmail("example@email.com", { "gender": "Male", "age": 21, "birthday": "15.01.1983" }); }); </script>
Рекомендуемые параметры для использования:
Подробнее о способах передачи можете почитать здесь.