tencent cloud

腾讯云超级应用服务

文档腾讯云超级应用服务小程序开发指南指南开放能力Banner 广告

Banner 广告

PDF
聚焦模式
字号
最后更新时间： 2025-04-09 18:35:49
使用小程序 Banner 广告，需要先打开广告菜单权限，详情请参考广告授权。
开发者可以使用 Banner 广告组件创建 Banner 广告，Banner 广告组件在创建后会自动拉取广告数据并显示。


广告尺寸设置

Banner 广告不允许直接设置样式属性，默认宽度为100%（width: 100%），高度会自动等比例计算，因此开发者可以设置广告外层组件的宽度调整广告的尺寸。 广告外层组件的宽度不允许小于300px，当宽度小于300px时，Banner 广告的宽度会强制调整为300px。
WXML
WXSS
<view class="adContainer">
    <ad unit-id="xxxx"></ad>
</view>
/* 外层组件的宽度可设置成100%或具体数值 */
.adContainer {  width: 100%;}


广告事件监听

Banner 广告在创建后会自动拉取广告。开发者可以通过 ad 组件的 onload 和 onerror 事件监听广告拉取成功或失败。
WXML
JS
<view class="adContainer">
  <ad unit-id="xxxx" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
</view>
Page({
  adLoad() {
    console.log('Banner 广告加载成功')
  },
  adError(err) {
    console.log('Banner 广告加载失败', err)
  }
})



上一篇: DarkMode 适配指南下一篇: 激励视频广告

帮助和支持

本页内容是否解决了您的问题？

填写满意度调查问卷，共创更好文档体验。

文档反馈