> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Пользовательская интеграция Web SDK для Rokt Thanks
> Эта статья предназначена для брендов, которые не используют Shopify Checkout, но всё же хотят воспользоваться предложениями Rokt Thanks от Aftersell.
Обзор
Если ваш магазин использует **пользовательский процесс оформления заказа**, вы всё равно можете получить доступ к предложениям Rokt Thanks, установив **Rokt Web SDK** (небольшой JavaScript-сниппет).
Установка SDK обычно проста и требует минимальных технических знаний. При необходимости команда технической поддержки Aftersell может помочь вам на протяжении всего процесса.
***
## Предварительные вопросы
Прежде чем начать, ответьте на следующие вопросы, чтобы обеспечить беспроблемную интеграцию:
1. **Можете ли вы (или кто-то из вашей команды разработчиков) добавить фрагмент кода на страницу подтверждения?**\
Страница подтверждения, также известная как **страница благодарности**, появляется сразу после оформления заказа.
2. **Какие данные или свойства пользователя доступны на странице подтверждения?**\
Нам потребуется доступ к [определённым свойствам](https://www.notion.so/rokt/Custom-Web-SDK-integration-for-Rokt-Thanks-306ee2db8608815899eadad3811b5ff3), связанным с приобретёнными товарами и информацией о покупателе. Чем больше данных доступно, тем более релевантными и точными будут ваши предложения Rokt Thanks.
3. **Есть ли простой способ получить доступ к этим данным с помощью JavaScript?**\
Например, можете ли вы запросить данные корзины или заказа на странице подтверждения?
***
## Этапы внедрения
## Шаг 1: проверка и подтверждение
* Просмотрите вопросы выше и подтвердите, к каким свойствам данных есть доступ.
* Когда вы будете готовы продолжить, вам понадобится **accountId**, который предоставит инженер Aftersell.
Чтобы создать вашу учётную запись, предоставьте следующие данные:
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
{
"firstName": "",
"lastName": "",
"primaryEmail": "",
"websiteUrl": "",
"countryCode": "",
"brand": ""
}
```
***
## Шаг 2: выбор способа установки
Решите, хотите ли вы:
* **Установить интеграцию самостоятельно**, или
* **Работать напрямую с инженером Aftersell** (для настройки с сопровождением может потребоваться тестовое окружение).
Если вы решите установить её самостоятельно, вы можете следовать [**документации Rokt**](https://docs.rokt.com/developers/integration-guides/getting-started/?layer1=siteMonetization) или сокращённым шагам ниже.\
Не все шаги из руководства по настройке Rokt обязательны, но руководство приводится в качестве справочного материала.
***
## Шаг 3: установка интеграционного скрипта
a. **Скопируйте [стартовый интеграционный скрипт](#)** (приведён ниже).
b. **Добавьте скрипт** между тегами `` любой страницы, на которой вы хотите показывать предложение Rokt Thanks (обычно это страница подтверждения заказа).
i. Заполните все обязательные **свойства данных о покупателе и транзакции**.
ii. Замените `"rokt_account_id_here"` на **accountId**, предоставленный вашим инженером Aftersell.
c. **Протестируйте вашу реализацию** с помощью [руководства по тестированию Rokt](https://docs.rokt.com/developers/integration-guides/web/testing), чтобы убедиться, что размещения загружаются корректно.
d. Совместно с нашей командой настройте размещение так, чтобы оно соответствовало стилю вашего бренда.
## Свойства (свойства, выделенные ***жирным курсивом***, настоятельно рекомендуются)
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
const cartItems = [
{
'itemPrice': '',
'itemQuantity': '',
'majorcat': '',
'majorcatid': '',
'minorcat': '',
'minorcatid': '',
'productname': '',
'sku': '',
},
{
...
}
]
```
Свойства покупателя/заказа
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
{
attributes: {
// Required
amount: '', //In $
firstname: '',
lastname: '',
billingzipcode: '',
Country: '',
Language: '',
currency: '',
cartItems: JSON.stringify(cartItems), //From above
email: '',
//Order Data
clientcustomerid: '',
cartId: '',
subtotal: '',
totalTax: '',
totalShipping: '',
margin: '',
paymenttype: '',
ccbin: '',
//Customer Data
customerType: '',
hasAccount: '',
isReturning: '',
lastVisited: '',
isLoyalty: '',
loyaltyTier: '',
mobile: '',
title: '',
age: '',
gender: '',
dob: '',
billingAddress1: '',
billingAddress2: '',
billingCity: '',
billingState: '',
billingCountry: '',
shippingAddress1: '',
shippingAddress2: '',
shippingCity: '',
shippingState: '',
shippingZipcode: '',
shippingCountry: '',
},
```
## Стартовый скрипт
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
```