Серверный трекинг в Shopify: как он работает и как его настроить

Серверный трекинг в Shopify означает, что каждая покупка попадает в Meta, TikTok и другие рекламные платформы из данных заказов вашего магазина, отправляемых сервером, а не только из пикселя в браузере покупателя. Shopify сообщает о каждом оплаченном заказе приложению трекинга через webhook, а приложение отправляет его в conversions API каждой платформы, сопоставив с кликом по рекламе, который привёл покупателя.

В этом руководстве рассматриваются части этого процесса, относящиеся к Shopify: встраивание в тему и app proxy, пиксели в чекауте, webhook orders/paid, сопоставление заказов, дедупликация, согласие и настройка в ROASaurus. Сначала прочитайте что такое серверный трекинг, чтобы понять общую идею.

Как работает серверный трекинг в Shopify

Клик и покупка происходят в разное время и в разных местах. Клик виден только в браузере, на лендинге. Оплаченный заказ достоверно известен только на стороне Shopify, когда платёж получен. Серверный трекинг записывает первое, ждёт второго и соединяет их.

Части Shopify: встраивание в тему, app proxy, пиксели и webhooks

Магазин Shopify даёт приложению трекинга четыре места для работы. У каждого своя задача, а полная настройка использует все четыре.

Встраивание в тему и app proxy

Встраивание приложения в тему (theme app embed) — это блок, который приложение добавляет в вашу тему. Вы включаете его в редакторе тем, так что вставлять код не нужно. Встраивание ROASaurus загружает скрипт на каждой странице. На лендинге он считывает click id, такие как fbclid, ttclid и gclid, и параметры UTM и сохраняет их вместе с first-party id посетителя.

Скрипт отправляет свои события через app proxy Shopify. App proxy пересылает запросы с пути на вашем домене, например yourstore.com/apps/roasaurus, на сервер приложения. Для браузера это запрос к вашему собственному сайту, что может помочь против блокировщиков рекламы, которые блокируют известные домены трекинга. Shopify удаляет заголовок Cookie из запросов app proxy и заголовок Set-Cookie из ответов, поэтому id посетителя передаётся внутри самого события, а не в cookie.

События клиента и пиксели в чекауте

В чекауте Shopify скрипты трекинга работают как пиксели в песочнице, а не на самой странице. Управлять ими можно в разделе Settings › Customer events. Есть два вида. Пиксели приложений поставляются вместе с приложением и работают в строгой песочнице. Пользовательские пиксели добавляет владелец магазина, и они работают в менее строгой песочнице, где можно загружать сторонние скрипты, например пиксель Meta.

ROASaurus использует оба вида. Его пиксель приложения включается при установке приложения. Он сообщает ROASaurus о начале чекаута, шаге с контактными данными и завершённом чекауте. Необязательный пользовательский пиксель добавляет в чекаут браузерные пиксели Meta, TikTok, Snapchat, Pinterest и Reddit, а также отправляет конверсии Google Ads.

Webhooks заказов

Webhook — это сообщение, которое Shopify отправляет приложению, когда в магазине что-то происходит. ROASaurus подписывается, в частности, на orders/paid и orders/create. Заказ в webhook содержит id заказа, сумму, товарные позиции, данные клиента, токены корзины и чекаута, атрибуты корзины, а также IP-адрес и браузер, с которых был оформлен заказ. Он приходит с серверов Shopify, поэтому блокировщик рекламы или закрытая вкладка не могут его остановить.

Как заказы сопоставляются с кликами по рекламе

Webhook сообщает ROASaurus, что заказ оплачен. Чтобы отправить полезную конверсию, ROASaurus нужно знать ещё и то, какой посетитель оформил заказ, потому что в записи посетителя хранятся click id. Он пробует эти связи по порядку, от самой прямой к наименее прямой:

Атрибуты корзины — причина того, что в Shopify сопоставление прямое. Это пары «ключ — значение», которые хранятся в корзине, а Shopify копирует их в заказ. Значение, записанное на странице товара, остаётся на месте к моменту прихода webhook, даже если покупатель рано закрыл страницу благодарности.

Есть одно исключение: кнопки ускоренного оформления заказа, например Buy it now, пропускают корзину. ROASaurus советует отключить их, чтобы добавление в корзину отслеживалось всегда. Заказы, оформленные через них, по-прежнему можно сопоставить по токену чекаута.

Один заказ от начала до конца

Вот что происходит с одним заказом из рекламы Meta при установленном пользовательском пикселе:

Когда отправляется покупка: orders/paid или orders/create

Какой webhook запускает отправку покупки, зависит от того, как платят ваши покупатели. Вы выбираете это как тип чекаута в Store settings.

ROASaurus ненадолго удерживает каждую покупку после прихода webhook. За это время обычно приходит и событие завершённого чекаута из браузера. Его URL страницы, IP-адрес и user agent затем добавляются к серверному событию рядом с click id из записи посетителя. Заказы, которые Shopify помечает как тестовые, записываются, но не отправляются на рекламные платформы.

Как работает дедупликация с браузерными пикселями

Когда браузерные пиксели работают рядом с серверными событиями, платформа получает каждую покупку дважды и должна оставить только одну. Она делает это по id события. ROASaurus присваивает обеим копиям покупки один и тот же id, построенный из id заказа Shopify: order-6123456789012 для заказа с id 6123456789012. Это длинное число в админском URL заказа, а не название заказа вроде #1042. Пиксель чекаута использует его для браузерного Purchase, а сервер — для события conversions API. Например, Meta оставляет одну копию, когда совпадают название и id события и обе пришли в течение 48 часов.

Id события работает только между событиями, которые его несут. Если другое приложение отправляет тот же пиксель, у его событий свои id, и платформа засчитывает заказ повторно. В Shopify обычные причины — канал Facebook & Instagram, подключённый к тому же пикселю, приложение TikTok и код пикселя, вставленный в theme.liquid. Наше руководство по дублирующимся событиям покупки показывает, как их найти, а материал Предотвращение двойного подсчёта перечисляет способы исправления.

Согласие через Customer Privacy API Shopify

Customer Privacy API Shopify хранит выбор cookie каждого посетителя. Его заполняет ваш баннер cookie, будь то собственный баннер Shopify или приложение согласия, подключённое к API. Скрипты и пиксели затем могут спросить у него, разрешён ли маркетинг для этого посетителя.

При включённой настройке Respect visitor consent, которая стоит по умолчанию в Store settings, скрипт витрины и пиксели чекаута ROASaurus спрашивают API, прежде чем начать отслеживание.

Email, телефоны, имена и адреса хешируются с помощью SHA-256 перед отправкой на рекламную платформу. Важны ещё три детали:

• Решает ваш баннер. ROASaurus следует тому, что сообщает API. Если API на странице недоступен, ROASaurus считает посетителя давшим согласие, поэтому убедитесь, что ваш баннер к нему подключён.
• Лендинг остаётся в заказе. Shopify хранит адрес лендинга вместе с каждым заказом, и он может содержать метки кампании и click id. ROASaurus использует его в собственных отчётах по атрибуции, в том числе для посетителей, которые отказались, и не отправляет его на рекламные платформы.
• Отправка заказа — юридическое решение. Можно ли вообще отправлять оплаченный заказ посетителя, который отказался, — это юридический вопрос для вашего магазина.

Наше руководство по Consent Mode v2 и GDPR объясняет правила в общих чертах, а в разделе Согласие и конфиденциальность есть подробности.

Как настроить серверный трекинг в Shopify с ROASaurus

Выполняйте шаги настройки в таком порядке:

1. Установите приложение

   Откройте Add a store, выберите Shopify, введите свой домен .myshopify.com и нажмите Install app. Подтвердите приложение в Shopify. ROASaurus зарегистрирует webhooks заказов и включит свой пиксель приложения.

2. Включите встраивание в тему

   На странице Tracking & platforms нажмите Open theme editor, включите встраивание ROASaurus и сохраните.

3. Добавьте пиксель чекаута

   В Shopify admin откройте Settings › Customer events и добавьте пользовательский пиксель с названием ROASaurus. Установите для него разрешение Not required, потому что скрипт ROASaurus сам проверяет маркетинговый выбор посетителя. Вставьте сниппет со страницы Tracking & platforms. Этот пиксель нужен для браузерных пикселей в чекауте и для Google Ads.

4. Подключите рекламные платформы

   В разделе Tracking & platforms нажмите Add pixel для каждой платформы или Connect with Facebook для Meta. Оставьте включённой опцию загрузки браузерного пикселя, если вам нужны дедуплицированные события браузера.

5. Проверьте настройки магазина

   В Store settings выберите тип чекаута и оставьте включённой настройку Respect visitor consent, если вы продаёте там, где требуется согласие.

6. Уберите других отправителей

   В канале Facebook & Instagram удалите этот пиксель из настроек передачи данных. Снижения уровня передачи данных недостаточно, потому что каждый уровень, включая Standard, отправляет пиксель Meta из браузера. Если то же самое делает приложение TikTok, остановите и его, а также удалите код пикселя из темы.

Сниппет пользовательского пикселя выглядит так. Скопируйте его со страницы Tracking & platforms, где ключ вашего магазина уже подставлен. Те же шаги описаны в руководстве по настройке Shopify.

self.tl = this; document.head.appendChild(document.createElement('script')).src = 'https://app.roasaurus.com/c.js?k=YOUR_STORE_KEY';

Как проверить, что всё работает

Протестируйте на одном реальном заказе, прежде чем полагаться на цифры:

1. Откройте свой магазин с ?roasaurus=connected в конце URL. Сообщение подтвердит, что скрипт работает.
2. Для Meta вставьте код из Events Manager › Test events в поле Test event code пикселя.
3. Оформите реальный недорогой заказ и затем сделайте по нему возврат. Тестовые заказы Shopify не отправляются.
4. В Event log серверная отправка по заказу отображается для каждой платформы как sent вместе с ответом платформы.
5. В тестовом представлении платформы проверьте, что браузерный и серверный Purchase используют один id события: order- плюс id заказа Shopify.
6. После этого удалите тестовый код события.

Что серверный трекинг в Shopify не решает

• Отказ от согласия. Заказы посетителей, отклонивших маркетинговые cookie, отправляются, но без click id, поэтому рекламные платформы сопоставляют их хуже.
• Ограничения cookie в Safari. Покупатель, вернувшийся позже чем через 7 дней, может выглядеть как новый посетитель. First-party поддомен для трекинга оставляет сбор на вашем домене, но Safari всё равно может ограничивать срок жизни таких cookie 7 днями.
• Различия в атрибуции. Каждая рекламная платформа по-прежнему засчитывает продажи по своим окнам и моделям. Чтобы сравнивать каналы по единым правилам, используйте собственную атрибуцию.
• Другие приложения на том же пикселе. Id событий объединяют только те события, у которых они совпадают.

Он решает другое: покупки, которые произошли, но не дошли до рекламной платформы, потому что событие браузера потерялось. О том, что ROASaurus отправляет на каждую платформу, см. серверный трекинг и интеграцию с Shopify.

Источники

1. Shopify: Customer Privacy API
2. Shopify: Authenticate app proxies
3. Shopify Help Center: Manage your custom pixels
4. Shopify Help Center: Facebook data sharing
5. Meta: Handling Duplicate Pixel and Conversions API Events

В ROASaurus

• Справка: настройка ROASaurus в Shopify
• Интеграция с Shopify
• Серверный трекинг в ROASaurus
• Справка: согласие и конфиденциальность

Читайте дальше