AnyQuery — Передача ID товаров для трекинга

📋

Трекинг ID товаров

Основные требования и принципы

❗

Важно: ID товара должен быть сквозным (одинаковым для конкретного товарного предложения) на всех страницах и совпадать со значениями offer_id в фиде. Данные должны передаваться как в десктопной, так и мобильной версии сайта.

Для передачи данных в DOM рекомендуем использовать атрибуты: data-any-offer-id, data-any-category-id, data-any-total, data-any-order-id.

Если уникальных классов нет — добавьте классы с аналогичными именами: any-offer-id, any-category-id, any-total, any-order-id.

Справочник атрибутов и классов

Атрибут	Класс-альтернатива	Назначение
data-any-offer-id	any-offer-id	ID товара / варианта
data-any-category-id	any-category-id	ID категории (страница категории / поиска)
data-any-total	any-total	Итоговая сумма заказа
data-any-order-id	any-order-id	Номер заказа (страница успешного заказа)

🔀

Рекомендуемые способы передачи

DOM-атрибуты, классы и URL

🏷️

DOM-атрибуты

Размещайте offer_id на видимых или скрытых элементах через data-any-*

🎨

Классы

Если нет уникальных селекторов, добавьте классы any-offer-id и другие на соответствующие элементы

🔗

URL

Передавайте offer_id как query-параметр или часть пути страницы

DOM-атрибуты: размещайте offer_id через data-any-offer-id (для товара/варианта), а также, при необходимости, data-any-category-id (для страницы категории/поиска), data-any-total (для итоговой суммы), data-any-order-id (для номера заказа)

Классы: если нет уникальных селекторов, добавьте классы any-offer-id, any-category-id, any-total, any-order-id на соответствующие элементы

URL: передавайте offer_id как query-параметр или часть пути

🛍️

Карточка товара

Страница отдельного товара

На странице товара укажите offer_id любым из следующих способов:

Атрибут в DOM-дереве

Параметр в URL

Пример DOM-атрибута (статический DOM)

html

<div class="product-card" data-any-offer-id="1-1-22116-26-533/37"></div>

Примеры URL

url

// Передача через query-параметр:
https://site.ru/product?offer_id=1-1-22116-26-533/37

// Передача как часть пути:
https://site.ru/product/1-1-22116-26-533/37

📂

Страница категории / поисковой выдачи

Трекинг массива offer_id по всем видимым карточкам

На этих страницах трекается массив offer_id по всем видимым карточкам. Рекомендуется размещать data-any-offer-id на каждой карточке. При отсутствии уникальных классов добавьте класс any-offer-id на соответствующие элементы. Для контекста страницы можно дополнительно прокинуть data-any-category-id на корневой контейнер.

Пример атрибутов на карточках товара

html

<div class="category-page" data-any-category-id="shoes">
    <div class="product-card any-offer-id" data-any-offer-id="1234">...</div>
    <div class="product-card any-offer-id" data-any-offer-id="5678">...</div>
    <div class="product-card any-offer-id" data-any-offer-id="9012">...</div>
</div>

🛒

Страница корзины / оформления заказа / успешного заказа

Требования к данным и примеры разметки

Требования к данным

total (итоговая сумма заказа) — должен присутствовать на всех перечисленных страницах: корзина, оформление заказа, успешный заказ. Рекомендуемый атрибут: data-any-total Все страницы

cartItems (массив товаров: id, title, quantity, price) — только на странице корзины. Цена без скидки (oldPrice) не нужна. Только корзина

order_id — на странице успешного заказа. Рекомендуемый атрибут: data-any-order-id Успешный заказ

ℹ️

Рекомендации по селекторам: не требуется строгое использование тега a для названия или input для количества. Достаточно добавить устойчивые классы на элементы, к которым можно привязаться (например, .cart-item-title, .cart-item-qty, .price), или использовать атрибуты data-any-*.

Пример разметки корзины

html

<div class="cart-page">
  <!-- Итоговая сумма корзины -->
  <div class="cart-total" data-any-total="10470">10 470 ₽</div>
  <div class="cart-item">
    <span class="name">Товар 1</span>
    <span class="price">3 490 ₽</span>
    <input class="quantity" type="number" value="1" min="1">
  </div>
  <div class="cart-item">
    <span class="name">Товар 2</span>
    <span class="price">3 490 ₽</span>
    <input class="quantity" type="number" value="2" min="1">
  </div>
</div>

Пример разметки страницы успешного заказа

html

<div
  class="order-success"
  data-any-order-id="ORD-12345"
  data-any-total="6980"
>
    <p>Спасибо за заказ! № ORD-12345</p>
    <p>Итого: 6 980 ₽</p>
</div>

🗂️

Кейс со сгруппированными карточками

Товары с groupId — размеры, цвета и другие варианты

В фиде встречаются товарные предложения, объединённые по groupId (например, по размеру или цвету). Для таких групп выбирается offer_id первого товарного предложения в группе (первый id) в качестве представителя. Этот представительский offer_id должен прокидываться везде одинаково: на карточке товара, в категории/поиске, в корзине и т.д.

💡

Пример: товар «туфли» имеет 6 размеров с разными offer_id, объединённые под groupId «7967». Выбирается первый offer_id в группе, например 1-1-22116-26-533/37, и именно он передаётся на всех страницах.

Особенности реализации

На сайтах с предвыбором варианта (предварительно выбран размер/цвет) всё равно используйте фиксированный представительский offer_id (первый в группе), а не текущий выбранный вариант

Если при клике на вариант страница обновляется или не обновляется — правило неизменно: прокидывается один и тот же представительский offer_id, чтобы трекинг был консистентным

ℹ️

Достаточно статического DOM с рекомендованными атрибутами/классами. При необходимости дополнительных сценариев (SPA, динамическая подмена контента) менеджер интеграции запросит уточнения.