WebX 集成

InMobi WebX 使发布商能够通过轻量级 JavaScript 集成来渲染广告，从而实现网站盈利。

先决条件

集成前请确保您已具备以下条件：

发布商 ID（由 InMobi 提供）。
一个有效的 HTML 容器，广告将在此容器中呈现。
请确保满足以下同意和隐私要求：
- 将InMobi（供应商 ID：333）添加到您的同意管理平台 (CMP) 供应商列表中。
- 请确保已为 InMobi 启用以下功能：
  - 目的 1 – 信息的存储和访问
  - 目的 2 – 基本广告
  - 目的 7 – 测量
  - 要启用个性化广告，还需启用：
    - 目的 3 – 个性化广告
    - 目的 4 – 个性化内容

创建默认位置

在开始进行 InMobi WebX 集成之前，您需要先创建默认网站位置。

按照“默认网站位置”中的步骤开始创建网站位置。

笔记

请联系您的客户成功经理，以在您的库存上激活 WebX。

集成方法

该SDK支持多种集成方式，具体取决于您的使用场景：

方法	描述
仅脚本集成（推荐）	页面加载时自动加载并渲染广告
手动初始化	可控制广告加载时间
动态广告位集成	根据用户互动信号加载广告

方法一：仅脚本集成

使用此方法可实现快速简便的集成。它使用脚本属性来配置 SDK。页面加载时，SDK 会自动加载并渲染广告。

添加一个容器元素来显示广告。
```
<div id="inmobi-ad-container"> </div>
```
添加包含发布者 ID 的 SDK 脚本，并使用脚本属性对其进行配置： "https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>"。
```
<script defer src="https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>" data-mode="auto" data-container="inmobi-ad-container"></script>
```

可配置参数

属性	描述
`data-mode="auto"`	启用自动广告加载
`data-container`	指定广告将要渲染的容器 ID。

笔记

支持多个广告位

除了单个广告容器外，发布商现在还可以在同一页面上渲染多个广告。要启用此功能，请在 DOM 中使用前缀`ad-slot-`（例如，`ad-slot-1`、`ad-slot-2` 等）定义多个容器。SDK 将自动检测所有此类容器，并在每个位置渲染广告。

只需要一个带有主容器的“script”标签；可以在 DOM 中添加额外的ad-slot-*容器，SDK 会自动检测到这些容器。

例子

<!DOCTYPE html>
<html>
<head>
  <title>InMobi Ad Example</title>
</head>
<body>

<h1>My Website</h1>

<div id="inmobi-ad-container"></div>

<script
  defer
  src="https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>"
  data-mode="auto"
  data-container="inmobi-ad-container">
</script>

</body>
</html>

方法二：手动集成

此方法允许您控制广告的加载时间和位置。在此模式下，SDK 仅在init()被调用时运行。它适用于：

单页应用程序（React、Angular、Vue）
动态页面内容
广告延迟加载
自定义广告投放逻辑

添加一个容器元素来显示广告。
```
<div id="ad-slot"></div>
```

添加包含发布商 ID 的 SDK 脚本，并使用脚本属性对其进行配置。

<script defer src="https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>"></script>

页面加载完成后调用 InMobiWebSDK.init() 。调用此方法后，SDK 将在指定的容器内加载广告 init() 。

<script>
window.addEventListener("DOMContentLoaded", function () {

  InMobiWebSDK.init({
    containerId: "ad-slot"
  });

});
</script>

可配置信号

您可以提供以下信号，以帮助 SDK 优化广告投放。

信号	类型	选修的	描述	示例值
`containerId`	细绳	不	广告将显示在容器（html div）中	`"inmobi-ad-container"`
`slotSize`	字符串或数组	是的	广告位尺寸。SDK 使用此信息请求兼容的广告素材。	`"300x250", ["300x250","336x280"]`
`format`	细绳	是的	该广告位支持的广告格式。有助于选择兼容的广告素材。	`banner, native, video, interstitial`
`placement`	细绳	是的	描述广告在页面上的显示位置。有助于优化布局和竞价需求。	`above_fold, in_article, sidebar, footer`
`contentCategory`	细绳	是的	用于上下文定向的页面上下文类别。	`sports, tech, finance, gaming`
`summaryType`	细绳	是的	用于情境定向的 AI 生成的摘要类型。	`key-points, tldr, teaser`
`keywords`	细绳	是的	发布商提供的页面关键词，用于改进上下文定向。	`["AI","machine learning","startups"]`
`userConsent`	细绳	是的	指示用户是否已同意接收个性化广告。此项为隐私合规要求。	`true, false`
`gdprApplies`	细绳	是的	指示 GDPR 是否适用于用户会话。	`true`
`usPrivacyString`	细绳	是的	CCPA/美国隐私字符串，用于合规性。	`"1YYN"`

例子

<!DOCTYPE html>
<html>
<head>
<title>InMobi Web SDK Example</title>

<script defer src="https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>"></script>

</head>
<body>

<h1>My Website</h1>

<div id="ad-slot"></div>

<script>
window.addEventListener("DOMContentLoaded", function () {

  InMobiWebSDK.init({
    containerId: "ad-slot",
    slotSize: ["300x250"]
  });

});
</script>

</body>
</html>

方法三：动态广告位集成

这种方法可以根据用户互动情况（例如页面停留时间或滚动深度）动态加载广告。它适用于：

延迟加载广告
在长篇内容中插入广告
提高可视性指标
根据用户行为控制广告的展示时间

工作原理

该SDK会根据用户互动情况而不是页面加载情况来加载广告。

您可以配置一个或多个触发条件（例如，页面停留时间或滚动深度）。
SDK 初始化后会监控这些条件。
当满足任何条件时，SDK 会自动创建广告容器（如果需要），将其插入 DOM 中，并渲染广告。
如果定义了多个触发器，则第一个满足的条件会触发广告加载。

支持的触发器配置

范围	类型	必需的	描述	例子
`minSeconds`	数字	不	Minimum time (in seconds) the user must spend before the ad can be inserted	`10`
`minViewabilityPercentage`	number	No	The percentage of page scroll after which the ad will be inserted	`50`

Note

At least one trigger parameter must be provided.
If multiple triggers are configured, the earliest satisfied condition will load the ad.
The SDK automatically creates the ad container.

Example

<!DOCTYPE html>
<html>
<head>
<title>InMobi Web SDK Example</title>

<script defer src="https://app.inmobi.com/web-sdk?publisherId=<inmobi_accountID>"></script>

</head>
<body>

<h1>My Website</h1>

<div id="ad-slot"></div>

<script>
window.addEventListener("DOMContentLoaded", function () {

  InMobiWebSDK.init({
    minSeconds: 3,
    minViewabilityPercentage: 50,
  });

});
</script>

</body>
</html>

无填充事件监听器

当某个广告位没有可用广告时，SDK 会NO_FILL在窗口对象上触发一个自定义事件。您可以监听此事件以执行备用操作。

window.addEventListener('NO_FILL', function(event) { 

 const slotId = event.detail.slotId; 

 console.log('No fill for slot:', slotId); 

});

最佳实践

始终使用该属性加载 SDK defer。
请确保容器存在后再加载广告。
如果要在页面上放置多个广告，请使用唯一的容器 ID。
初始化后避免动态移除广告容器。

故障排除

如果广告无法显示，请检查以下各项：

发布 者 ID 正确。
容器 ID存在于 DOM 中。
SDK脚本加载成功。
浏览器控制台中没有 JavaScript 错误。

如需更多帮助，请联系我们。

最后更新于 : 10 Sep, 2026

You are almost there...

By installing this SDK update, you agree that your Children Privacy Compliance setting remains accurate or that you will update that setting, whenever there is a change in your app's audience. You may update the app's Children Privacy Compliance settings at https://publisher.inmobi.com/my-inventory/app-and-placements.

I AGREE