重要提示：此文档不适用于您当前选择的格式 电子邮件！

amp-ad

描述

用于显示广告的容器。

必需脚本

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

支持的布局

fill fixed fixed-height flex-item fluid intrinsic nodisplay responsive

用法

amp-embed 是 amp-ad 标签的别名，它通过不同的标签名称派生其所有功能。当语义上更准确时，使用 amp-embed。AMP 文档仅支持通过 HTTPS 提供的广告/嵌入。

amp-ad / amp-embed 的规范可能会随着时间的推移而发生重大变化。当前的方法旨在引导格式以能够显示广告。

广告像 AMP 文档中的所有其他资源一样加载，使用名为 <amp-ad> 的特殊自定义元素。不允许在 AMP 文档中运行任何广告网络提供的 JavaScript。相反，AMP 运行时从与 AMP 文档不同的源（通过 iframe 沙箱）加载一个 iframe，并在该 iframe 沙箱内执行广告网络的 JS。

<amp-ad> 需要根据其布局类型的规则指定宽度和高度值。它需要一个 type 参数来选择要显示的广告网络。标签上的所有 data-* 属性都会自动作为参数传递给最终渲染广告的代码。给定类型的网络需要哪些 data- 属性取决于广告网络，并且必须在广告网络文档中说明。

示例：显示一些广告

<amp-ad
  type="a9"
  data-amzn_assoc_ad_mode="auto"
  data-divid="amzn-assoc-ad-fe746097-f142-4f8d-8dfb-45ec747632e5"
  data-recomtype="async"
  data-adinstanceid="fe746097-f142-4f8d-8dfb-45ec747632e5"
  width="300"
  height="250"
  data-aax_size="300x250"
  data-aax_pubname="test123"
  data-aax_src="302"
>
</amp-ad>
<amp-ad
  width="300"
  height="250"
  type="industrybrains"
  sticky="bottom"
  data-width="300"
  data-height="250"
  data-cid="19626-3798936394"
>
</amp-ad>
<amp-embed
  type="taboola"
  width="400"
  height="300"
  layout="responsive"
  data-publisher="amp-demo"
  data-mode="thumbnails-a"
  data-placement="Ads Example"
  data-article="auto"
>
</amp-embed>

在 playground 中打开此代码片段

占位符

可选地，amp-ad 支持带有 placeholder 属性的子元素。如果广告网络支持，则会显示此元素，直到广告可供查看为止。请在占位符和回退中了解更多信息。

<amp-ad width="300" height="250" type="foo">
  <div placeholder>Loading ...</div>
</amp-ad>

无可用广告

如果该广告位没有可用的广告，AMP 会尝试折叠 amp-ad 元素（即设置为 display: none）。AMP 确定此操作可以在不影响用户滚动位置的情况下执行。如果广告位于当前视口中，则不会折叠该广告，因为它会影响用户的滚动位置；但是，如果广告位于当前视口之外，则会被折叠。

如果这是一个粘性广告单元（设置了 sticky 属性），则整个粘性广告将不会显示，而不考虑 fallback 属性。

如果折叠尝试失败。amp-ad 组件支持带有 fallback 属性的子元素。如果存在回退元素，则会显示自定义的回退元素。否则，AMP 将应用默认的回退。

带有回退的示例

<amp-ad width="300" height="250" type="foo">
  <div fallback>No ad for you</div>
</amp-ad>

投放视频广告

在 AMP 中，有 3 种方法可以通过视频广告获利

AMP 原生支持许多视频播放器，例如 BrightCove、DailyMotion 等，它们可以通过广告获利。有关完整列表，请参阅媒体组件。
使用amp-ima-video组件，该组件带有内置的 IMA SDK 和 HTML5 视频播放器
如果您使用 AMP 中不支持的视频播放器，则可以使用amp-iframe来提供您的自定义播放器。使用 amp-iframe 方法时：_ 确保在第一个视口中加载播放器时有海报。详细信息。_ 视频和海报必须通过 HTTPS 提供。

从自定义域名运行广告

AMP 支持从自定义域名（例如您自己的域名）加载用于加载广告的引导 iframe。

要启用此功能，请将文件 remote.html 复制到您的 Web 服务器。接下来，将以下 meta 标签添加到您的 AMP 文件中

<meta
  name="amp-3p-iframe-src"
  content="https://assets.your-domain.com/path/to/remote.html"
/>

meta 标签的 content 属性是您 Web 服务器上 remote.html 文件副本的绝对 URL。此 URL 必须使用“https”架构。它不能与您的 AMP 文件位于同一来源。例如，如果您在 www.example.com 上托管 AMP 文件，则此 URL 不能在 www.example.com 上，但 something-else.example.com 是可以的。有关 iframe 允许的来源的更多详细信息，请参阅 “Iframe 来源策略”。

安全

在将传入的数据传递给 draw3p 函数之前，验证传入的数据，以确保您的 iframe 只执行它期望执行的操作。对于允许自定义 JavaScript 注入的广告网络来说，尤其如此。

Iframe 还应强制执行它们仅被 iframe 到它们期望被 iframe 到的来源中。这些来源将是

您自己的来源
https://cdn.ampproject.org 用于 AMP 缓存

对于 AMP 缓存，您还需要检查“源来源”（由 cdn.ampproject.org 提供的文档的来源）是否是您的来源之一。

可以使用 draw3p 的第 3 个参数强制执行来源，并且还必须使用 allow-from 指令来获得完整的浏览器支持。

增强传入的广告配置

这是完全可选的：有时需要在向广告服务器发出广告请求之前增强广告请求。

如果您的广告网络支持快速获取，请使用实时配置 (RTC)。（例如，DoubleClick 和 AdSense 集成都支持快速获取和 RTC）

如果您的广告网络使用延迟获取，您可以在remote.html文件中的 draw3p 函数调用中传递一个回调。回调接收传入的配置作为第一个参数，然后接收另一个回调作为第二个参数（在下面的示例中称为 done）。必须使用更新的配置调用此回调，以便继续进行广告渲染。

示例

draw3p(function(config, done) {
  config.targeting = Math.random() > 0.5 ? 'sport' : 'fashion';
  // Don't actually call setTimeout here. This should only serve as an
  // example that is OK to call the done callback asynchronously.
  setTimeout(function() {
    done(config);
  }, 100)
}, ['allowed-ad-type'], ['your-domain.com']);

属性

`type`（必需）

指定广告网络的标识符。type 属性选择要用于广告标签的模板。

`sticky`（可选）

用于表示这是一个粘性广告单元并指定此单元的位置。其值必须是以下之一

top
bottom
bottom-right
left
right

`data-foo-bar`

大多数广告网络需要进一步配置，这可以通过使用 HTML data– 属性传递给网络。参数名称受标准数据属性破折号到驼峰式转换的影响。例如，“data-foo-bar”作为“fooBar”发送给广告进行配置。请参阅广告网络文档，了解可以使用哪些属性。

`data-vars-foo-bar`

以 data-vars– 开头的属性保留用于 amp-analytics 变量。

`src`（可选）

使用此属性加载指定广告网络的脚本标签。这可以用于需要将单个脚本标签插入页面的广告网络。src 值必须具有指定广告网络允许列表的前缀，并且该值必须使用 https 协议。

`json`（可选）

使用此属性将配置作为任意复杂的 JSON 对象传递给广告。该对象会原封不动地传递给广告，不对名称进行任何修改。

`data-consent-notification-id`（可选）

如果提供此属性，则需要确认具有给定 HTML ID 的 amp-user-notification，直到用户的“AMP 客户端 ID”（类似于 cookie）传递给广告。这意味着广告渲染将被延迟，直到用户确认通知。

`data-loading-strategy`（可选）

指示广告在距离当前视口给定数量的视口内时开始加载。如果没有 data-loading-strategy 属性，则默认数量为 3。您可以指定 [0, 3] 范围内的浮点值（如果未指定值，则将值设置为 1.25）。

使用较小的值可以获得更高的可视度（即，增加广告加载后被看到的机会），但存在产生较少展示次数（即，加载较少广告）的风险。如果指定了该属性但未填写值，则系统将分配一个浮点值，该值可优化可视度，而不会对展示次数产生太大影响。请注意，将值指定为 prefer-viewability-over-views 也会自动优化可视度。

`data-ad-container-id`（可选）

在尝试折叠的情况下，通知广告容器组件的 ID。容器组件必须是广告父级的 <amp-layout> 组件。当指定 data-ad-container-id 并且找到这样的 <amp-layout> 容器组件时，AMP 运行时将尝试折叠容器组件而不是广告组件，在无填充期间。当存在广告指示器时，此功能可能很有用。

title (可选)

为组件定义一个 title 属性，以传播到基础的 <iframe> 元素。默认值为 "Advertisement"。

通用属性

此元素包含扩展到 AMP 组件的通用属性。

样式

<amp-ad> 元素本身可能不具有或放置在设置了 CSS position: fixed 的容器中（amp-lightbox 和粘性广告单元除外）。这是由于全页覆盖广告的 UX 影响。未来可能会考虑允许在 AMP 控制的容器内部使用类似的广告格式，这些容器保持某些 UX 不变量。

验证

请参阅 AMP 验证器规范中的 amp-ad 规则。

支持的广告网络

支持的嵌入类型

需要更多帮助？

您已经阅读过本文档十几次了，但它并没有真正涵盖您的所有问题？也许其他人也有同样的感受：请在 Stack Overflow 上联系他们。

前往 Stack Overflow

发现错误或缺少功能？

AMP 项目强烈鼓励您的参与和贡献！我们希望您能成为我们开源社区的持续参与者，但我们也欢迎您为自己特别感兴趣的问题做出一次性贡献。

前往 GitHub

amp-ad

描述

必需脚本

支持的布局

用法

占位符

无可用广告

投放视频广告

从自定义域名运行广告

安全

增强传入的广告配置

属性

type（必需）

sticky（可选）

data-foo-bar

data-vars-foo-bar

src（可选）

json（可选）

data-consent-notification-id（可选）

data-loading-strategy（可选）

data-ad-container-id（可选）