小程序视频广告

开发者可以使用 ad 组件创建小程序视频广告组件,视频广告组件在创建后会自动拉取广告数据并显示。暂时仅支持在同层渲染模式下使用,且不支持嵌套使用。

广告尺寸设置

小程序视频广告不允许直接设置样式属性,默认宽度为100%(width: 100%),高度会自动等比例计算,因此开发者可以设置广告外层组件的宽度调整广告的尺寸。广告外层组件的宽度不允许小于屏幕宽度90%,当宽度小于屏幕宽度的90%时,视频广告组件的宽度会强制调整为屏幕宽度的90%。

  1. /* 外层组件的宽度可设置成100%或具体数值 */
  2. .adContainer {
  3. width: 100%;
  4. }
  1. <view class="adContainer">
  2. <ad unit-id="xxxx" ad-type="video" ad-theme="white"></ad>
  3. </view>

广告主题样式设置

小程序视频广告组件提供黑、白两种主题样式,开发者可以在创建视频广告时传入ad-theme参数实现主题样式选择,ad-theme参数为字符串类型,参数值可选white, black

  1. <view class="adContainer">
  2. <ad unit-id="xxxx" ad-type="video" ad-theme="white"></ad>
  3. </view>
  1. <view class="adContainer">
  2. <ad unit-id="xxxx" ad-type="video" ad-theme="black"></ad>
  3. </view>

广告事件监听

视频广告在创建后会自动拉取广告。开发者可以通过 ad 组件的 onloadonerror 事件监听广告拉取成功或失败,可以通过 onclose 事件监听广告被关闭。

  1. <view class="adContainer">
  2. <ad unit-id="xxxx" ad-type="video" ad-theme="white" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
  3. </view>
  1. Page({
  2. adLoad() {
  3. console.log('小程序视频广告加载成功')
  4. },
  5. adError(err) {
  6. console.log('小程序视频广告加载失败', err)
  7. },
  8. adClose() {
  9. console.log('小程序视频广告关闭')
  10. }
  11. })

广告定时刷新

小程序视频广告组件不适用于定时刷新参数ad-intervals