# Web SDK

## **Начать**

Чтобы начать отслеживание с помощью веб-SDK Offer18, выполните приведённые ниже инструкции.

## Отслеживать клики

Чтобы отслеживать клики с помощью SDK, добавьте следующий код в ваш скрипт.

<mark style="color:фиолетовый;">Расположение : Заголовок (все страницы)</mark>

{% code fullWidth="false" %}

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.trackClick({
        trackingURL: '<YOUR-TRACKING-LINK>',
        keymapping: ['<OFFER18-PARAMETER>:<YOUR-PARAMETER>', '<OFFER18-PARAMETER>:<YOUR-PARAMETER>',...]
    });
</script>
```

{% endcode %}

{% tabs %}
{% tab title="Конфигурация объекта - window\.Offer18WebSDK.trackclick()" %}

1. **trackingURL** (Обязательно) : URL отслеживания, который можно получить в панели Offer18.
2. **keymapping** : это массив параметров Offer18 и нативных параметров в формате `<OFFER18-PARAMETER>:<YOUR-PARAMETER>`. Пользователь может заменить `<OFFER18-PARAMETER>`  на параметры Offer18, такие как aff\_sub1, aff\_sub2 и `<YOUR-PARAMETER>` на их параметры, из которых пользователь получает значения из своей сети.
   {% endtab %}
   {% endtabs %}

#### **Пример кода**

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.trackClick({
        trackingURL: 'https://example.o18.click/c?o=0000000&m=0000',
        keymapping: ['a:<YOUR-PARAMETER>']
    });
</script>
```

`В приведённом выше примере`` `**`a`**` ``является`` `**`ID партнёра`**` ``в сопоставлении ключей`

***

## Отслеживать показы

Чтобы отслеживать показы с помощью SDK, добавьте следующий код в ваш скрипт

<mark style="color:фиолетовый;">Расположение : Заголовок (все страницы)</mark>

{% code fullWidth="false" %}

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.trackImpression({
        impressionURL: '<YOUR-IMPRESSION-URL>',
        keymapping: ['<OFFER18-PARAMETER>:<YOUR-PARAMETER>', '<OFFER18-PARAMETER>:<YOUR-PARAMETER>',...]
    });
</script>
```

{% endcode %}

{% tabs %}
{% tab title="Конфигурация объекта - window\.Offer18WebSDK.trackImpression()" %}

1. **impressionURL** (Обязательно) : URL показа, который можно получить в панели Offer18.
2. **keymapping** : это массив параметров Offer18 и нативных параметров в формате `<OFFER18-PARAMETER>:<YOUR-PARAMETER>`. Пользователь может заменить `<OFFER18-PARAMETER>`  на параметры Offer18, такие как aff\_sub1, aff\_sub2 и `<YOUR-PARAMETER>` на их параметры, из которых пользователь получает значения из своей сети.
   {% endtab %}
   {% endtabs %}

#### **Пример кода**

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.trackImpression({
        impressionURL: 'https://example.o18.click/i?o=0000000&m=0000',
        keymapping: ['a:<YOUR-PARAMETER>']
    });
</script>
```

`В приведённом выше примере`` `**`a`**` ``является`` `**`ID партнёра`**` ``в сопоставлении ключей`

***

## Отслеживать конверсии

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

<mark style="color:фиолетовый;">Расположение : Заголовок (все страницы)</mark>

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.initializeUrlParam('<YOUR-CLICK-ID-PARAMETER>');
</script>
```

После добавления скрипта необходимо добавить следующий скрипт на страницу благодарности/подтверждения заказа

<mark style="color:фиолетовый;">Расположение : Страница благодарности/Страница успеха заказа (одна страница)</mark>

```html
<script src="https://web-resources.offer18.net/sdk/web/WebSDK.js"></script>
<script>
    window.Offer18WebSDK.trackConversion({
        domain: '',
        accountId: '',
        offerId: '',
        coupon:'',
        postbackType: '', // 'iframe' or 'pixel'
        isGlobalPixel: false, // true or false
        allowMultiConversion: false, // true or false
        conversionData: {
            event: '', // Event Name (Please specify the event)
            payout: '', // Payout Amount (Please specify the payout amount)
            sale: '', // Sale Amount (Please specify the sale amount)
            currency: '',
            adv_sub1: '',
            adv_sub2: '',
            adv_sub3: '',
            adv_sub4: '',
            adv_sub5: '',
        }
    })
</script>
```

{% tabs %}
{% tab title="Конфигурация объекта - window\.Offer18WebSDK.trackConversion()" %}

1. **domain** (Обязательно) : Домен постбэка пользователя.
2. **accountId** (Обязательно) : ID аккаунта Offer18 пользователя.
3. **offerId** (Обязательно) : ID кампании.
4. **coupon :** Здесь можно использовать код купона
5. **postbackType** : Это может быть либо `'iframe'` или `'pixel'`, значение по умолчанию `'iframe'`.&#x20;
6. **isGlobalPixel** : Пользователь может настроить глобальный пиксель, установив это значение `true` , значение по умолчанию `false`.
7. **allowMultiConversion** : Пользователь может разрешить множественные конверсии, установив это значение `true` , значение по умолчанию `false`.&#x20;
8. **conversionData** : Этот объект содержит параметры, которые можно использовать для получения значений из сети.
   {% endtab %}
   {% endtabs %}

#### **Пример кода**

<pre class="language-html"><code class="lang-html">&#x3C;script src="https://web-resources.offer18.net/sdk/web/WebSDK.js">&#x3C;/script>
<strong>&#x3C;script>
</strong>    window.Offer18WebSDK.trackConversion({
        domain: 'example.o18.link',
        accountId: '0000',
        offerId: '00000000',
    });
&#x3C;/script>
</code></pre>

***

## Режим отладки

Чтобы включить режим отладки в SDK, можно добавить следующий код в ваш скрипт:

```html
<script>
    window.Offer18WebSDK.activateDebugMode();
</script>
```

Включение режима отладки позволяет пользователю получать более подробную информацию о работе SDK, включая любые ошибки или отладочные сообщения.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://knowledgebase.offer18.com/ru/set/sdk/web-sdk.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
