手把手教我如何开通微信小程序流量主广告？如何插入广告组件？

开通流量主流程

 

1）点击左侧导航栏的“流量主”进入专属模块

小程序累计独立访客（UV）1000以上，且无违规记录，便可开通流量主功能。

 

2）点击“新建广告位”开始建立

输入广告位名称便可，如计划插入多个广告位，须要分别新建。

 

3）获取广告位代码片断

系统将生成广告位的代码片断，开发者点击“复制代码”留用。

 

4）嵌入代码片断&测试&发布

嵌入代码片断至但愿展现广告的位置，并在发布前经过测试预览广告位展现状况。 注：请务必完成主流机型的适配测试，因为适配缘由带来的违规问题，将受到同等处罚。

 

①原生模板广告

.adContainer { width: 100%; }

<view class="adContainer"> <ad-custom unit-id="xxxx"></ad-custom> </view>

 

 

 

 

 

②插屏广告

let interstitialAd = null Page({ onLoad() { if(wx.createInterstitialAd){ //建立 interstitialAd = wx.createInterstitialAd({ adUnitId: 'xxxx' }) interstitialAd.onLoad(() => { console.log('onLoad event emit') //显示 interstitialAd.show().catch((err) => { console.error(err) }) }) interstitialAd.onError((err) => { console.log('onError event emit', err) }) interstitialAd.onClose((res) => { console.log('onClose event emit', res) }) } } })

 

 

 

 

 

③激励视频广告

let rewardedVideoAd = null Page({ onLoad() { if(wx.createRewardedVideoAd){ rewardedVideoAd = wx.createRewardedVideoAd({ adUnitId: 'xxxx' }) rewardedVideoAd.onLoad(() => { console.log('onLoad event emit') }) rewardedVideoAd.onError((err) => { console.log('onError event emit', err) }) rewardedVideoAd.onClose((res) => { console.log('onClose event emit', res) const { isEnded } = res //视频是否播放结束、能够向用户下发奖励 if (isEnded) { //@todo 得到积分数据交互 } }) } }, showVideoAd() { // 用户触发广告后，显示激励视频广告 if (rewardedVideoAd) { rewardedVideoAd.show().catch(() => { // 失败重试 rewardedVideoAd.load() .then(() => rewardedVideoAd.show()) .catch(err => { console.log('激励视频 广告显示失败') }) }) } }, })

 

 

<button type="default" bindtap="showVideoAd">观看完整视频广告</button>

 

 

 

 

 

 

总结

以上即是此次手把手教我开通小程序广告组件、接入场景与操做指引的学习笔记。多个页面接入同一种类型的流量主广告组件务必使用同一个adUnitId，不要问为何，我也不知道，就是会提升单价曝光率。