Настройка трекинг-кода Retail Rocket

Трекинг-код Retail Rocket состоит из 6 скриптов, которые необходимо разместить на страницах вашего сайта. 

На ваш сайт необходимо установить следующий код:

1. Основной трекинг-код системы

Разместите трекинг-код системы на каждой странице вашего сайта в секции <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>
2. Трекер просмотра карточки товара

На всех страницах карточек товаров и формах быстрого просмотра необходимо установить товарный трекинг-код:

<script type="text/javascript">
    (window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
        // Передача данных о просматриваемом товаре
        retailrocket.products.post({
            // Идентификатор товара, число
            "id": <product ID>,
            // Название товара, строка
            "name": "Example product name",
            // Цена товара, число
            "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": ["Women/Clothes/Skirts","Women/New Arrivals"],
            // Описание товара
            "description": "Some text description",
            // Производитель товара, необязательный параметр
            "vendor": "Brand name",
            // Модель товара, необязательный параметр
            "model": "Model name",
            // Тип товара, необязательный параметр
            "typePrefix": "Product type",
            // Старая цена товара, необязательный параметр
            "oldPrice": 999,
            // Дополнительная информация о продукте, необязательный параметр
            "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 - уникальный идентификатор товара, число без кавычек
        rrApi.view(<product ID>);
    });
</script>

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

3. Трекер просмотра страницы товарной категории

На всех страницах товарных категорий необходимо установить следующий код:

<script type="text/javascript">
    (window["rrApiOnReady"] = window["rrApiOnReady"] || []).push(function() {
        // Полный путь до текущей категории с косой чертой в качестве разделителя, строка. Должен совпадать с путем, передаваемым в карточках товаров данной категории.        
        rrApi.categoryView("Women/Clothes/Skirts");
    });
</script>
4. Трекер добавления товаров в корзину

На кнопках, нажатие которых приводит к добавлению товара в корзину, необходимо установить обработчик событий:

onmousedown="try { rrApi.addToBasket(<product_id>) } catch(e) {}"

Где <product_id> - ID товара.

Пример:

<div class="buy_button" onmousedown="try { rrApi.addToBasket(123) } catch(e) {}"></div>

Обратите внимание: Кнопка добавления в корзину может находиться как в карточке товара, так и в листингах. Вызов метода addToBasket нужно установить и в этом случае.

5. Трекер совершения транзакции

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

<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>

Где: 

  • <user_email> - email адрес пользователя,
  • <transaction_id> - ID транзакции,
  • <product_id> - ID товара,
  • <qnt> - количество единиц товара в заказе,
  • <price> - цена за единицу товара.

Пример:

<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>

6. Трекер получения email

Каждый раз, когда вы получаете 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>

Рекомендуемые параметры для использования:

  • gender (строка),
  • age (число без  кавычек),
  • name (только имя, строка),
  • birthday (строка, формат DD.MM.YYYY).

Подробнее о способах передачи можете почитать здесь.