本文整理自网络,侵删。
Grid 广告
小程序广告流量主操作指引:文档地址
开发者可以使用 ad 组件创建 Grid 广告组件,Grid 广告组件在创建后会自动拉取广告数据并显示。
广告尺寸设置
Grid 广告不允许直接设置样式属性,默认宽度为100%(width: 100%),高度会自动等比例计算,因此开发者可以设置广告外层组件的宽度调整广告的尺寸。格子广告有最小尺寸限制,5个的形态为331px,8个的形态为294px。
/* 外层组件的宽度可设置成100%或具体数值 */
.adContainer {
width: 100%;
}
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" ad-theme="white" grid-count="5"></ad>
</view>
广告事件监听
Grid 广告在创建后会自动拉取广告。开发者可以通过 ad 组件的 onload 和 onerror 事件监听广告拉取成功或失败,可以通过 onclose 事件监听广告被关闭。
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" ad-theme="white" grid-count="5" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
</view>
Page({
adLoad() {
console.log('Grid 广告加载成功')
},
adError(err) {
console.log('Grid 广告加载失败', err)
},
adClose() {
console.log('Grid 广告关闭')
}
})
广告主题样式设置
小程序视频广告组件提供黑、白两种主题样式,开发者可以在创建视频广告时传入ad-theme参数实现主题样式选择,ad-theme参数为字符串类型,参数值可选white, black
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" ad-theme="white"></ad>
</view>
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" ad-theme="black"></ad>
</view>
广告格子个数设置
小程序视频广告组件提供黑、白两种主题样式,开发者可以在创建视频广告时传入grid-count参数实现主题样式选择,grid-count参数为数字类型,参数值可选5, 8
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" grid-count="5"></ad>
</view>
<view class="adContainer">
<ad unit-id="xxxx" ad-type="grid" grid-count="8"></ad>
</view>
标签:微信小程序
相关阅读 >>
微信小程序api 绘图setlinejoin(设置线条交点样式)
微信小程序api 绘图中使用setglobalalpha设置全局画笔透明度
更多相关阅读请进入《微信小程序》频道 >>

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者