# Web SDK

## **开始使用**

要开始使用 Offer18 的 Web SDK 进行跟踪，请按照以下说明操作。

## 跟踪点击

要使用 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** (必填)：可从 Offer18 仪表板提取的跟踪 URL。
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** (必填)：可从 Offer18 仪表板提取的展示 URL。
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' 或 'pixel'
        isGlobalPixel: false, // true 或 false
        allowMultiConversion: false, // true 或 false
        conversionData: {
            event: '', // 事件名称（请注明事件）
            payout: '', // 支付金额（请注明支付金额）
            sale: '', // 销售金额（请注明销售金额）
            currency: '',
            adv_sub1: '',
            adv_sub2: '',
            adv_sub3: '',
            adv_sub4: '',
            adv_sub5: '',
        }
    })
</script>
```

{% tabs %}
{% tab title="对象配置 - window\.Offer18WebSDK.trackConversion()" %}

1. **domain** (必填)：用户的回传域名。
2. **accountId** (必填)：用户的 Offer18 帐号 ID。
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/zh/wang-luo/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.