> For the complete documentation index, see [llms.txt](https://docs.exoclick.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.exoclick.com/tutorials/zh/jiao-cheng/fa-bu-shang-jiao-cheng/adding-exoclick-ad-zones-to-apps.md).
# 将 ExoClick 广告位添加到应用中
## 移动应用支持的广告格式
您可以使用以下格式：
* VAST
* 横幅
* 粘性横幅
* 视频滑块
* 多格式
* 即时消息
* 视频内横幅
* 页内推送通知
要将 ExoClick 广告位添加到您的应用中，您将使用 `react-native-webview` 库来显示广告的 HTML 代码。
## 示例：横幅
{% stepper %}
{% step %}
### 安装并导入 react-native-webview
运行以下命令：
```bash
npm install react-native-webview
```
然后，将 WebView 组件导入您的 React Native 文件：
```javascript
import { WebView } from 'react-native-webview';
```
{% endstep %}
{% step %}
### 广告代码
创建一个包含广告位完整 HTML 代码的 JavaScript 字符串：
```javascript
const bannerAdHTML = `
`;
```
{% hint style="info" %}
请记得替换 `您的广告位 ID` 替换为实际 ID
{% endhint %}
{% endstep %}
{% step %}
### WebView
将 WebView 组件导入您的 React Native 文件
```javascript
import { View } from 'react-native';
```
接下来，在应用的 JSX 布局中放置一个 WebView 组件。将 HTML 字符串传递给 `source` 属性：
```javascript
```
这样，您就应该能够在移动应用中显示广告。
{% endstep %}
{% endstepper %}
## 示例：VAST
视频播放器和 VAST 标签将作为单个 HTML 字符串加载。此示例使用 [Fluid Player](https://www.fluidplayer.com/) 作为视频播放器来投放广告。
我们使用与横幅广告示例中演示的相同设置流程。
```javascript
const fluidPlayerHTML = `
`;
```
{% hint style="info" %}
请记得替换 `您的广告位 ID` 和 `https://path-to-your-video.mp4` 替换为您自己的信息。
{% endhint %}
然后使用 WebView 加载它：
```javascript
```
按照这些步骤，您的应用现在将显示视频广告。
## 原生 Android 应用广告位
完整可运行示例可在此 [仓库中获取](https://github.com/EXOCLICK-TECH/android-native-ads)
您可以查看代码，了解广告如何在 Android 应用中渲染。
### 在哪里找到实现？
负责展示广告的主要文件是：
* **HTML 广告容器**\
`android-native-ads/na_app/app/src/main/assets/exoclick_ads.html`\
包含 ExoClick 广告标记。
* **Android WebView 逻辑**\
`android-native-ads/na_app/app/src/main/java/com/exoclick/adtest/MainActivity.kt`\
加载 HTML 文件。\
通过在设备的外部浏览器中打开广告来处理广告点击。
{% hint style="info" %}
**注意：** 本项目仅作为简单参考，而非完整的生产级解决方案。它展示了在 Android 应用中显示 ExoClick 广告所需的基本设置。
{% endhint %}
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## 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, and the optional `goal` query parameter:
```
GET https://docs.exoclick.com/tutorials/zh/jiao-cheng/fa-bu-shang-jiao-cheng/adding-exoclick-ad-zones-to-apps.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
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.