微信小程序——添加广告

微信小程序——添加广告

要想在微信小程序中加入广告，首先要在微信小程序后台开通流量主
流量主需要满足：1、累计独立访问（uv)不低于1000；2、有严重违规的小程序不与开通。

广告主要有：banner广告、激励视频广告、卡片广告、插屏广告、盒子广告、feeds广告、积木广告。

一、banner 广告

在这里插入图片描述

banner广告比较简单，直接在html页面中适当的位置加入:

<ad unitId="你的广告id"></ad>

二、卡片广告

image.png

卡片广告跟banner广告差不多，直接在适当的位置加入

<ad unit-id="你的广告id" type="card"></ad>

三、盒子广告

在这里插入图片描述

盒子广告需要在js文件中加入

let appbox = qq.createAppBox({
  adUnitId: '你的盒子广告id'
})
appbox.load().then(()=>{
  appbox.show()
})

这里需要注意的是，从微信小程序后台复制的代码，广告id应该是字符串，要加上引号。

四、激励视频广告

在这里插入图片描述

激励视频是需要写在js文件中

var videoAd = null;
page({
    onLoad:function(){
        if (wx.createRewardedVideoAd) {
             // 加载激励视频广告
             videoAd = wx.createRewardedVideoAd({
                adUnitId: '你的 adUnitId'
             })
             //捕捉错误
             videoAd.onError(err => {
             // 进行适当的提示
             console.log('videoAd onError', res)
             })
             // 监听关闭
             videoAd.onClose((status) => {
              if (status && status.isEnded || status === undefined) {
              // 正常播放结束，下发奖励
              // continue you code
              } else {
              // 播放中途退出，进行提示
              }
             })
        }
    }
})

然后在合适的位置展示视频广告

if (videoAd) {
 videoAd.show().catch(err => {
  // 失败重试
  videoAd.load()
  .then(() => videoAd.show())
 })
 }

如果要在按钮上加入视频广告，需要注意视频广告的回调。onClose回调函数会记录点击了几次视频广告。

五、插屏广告

在这里插入图片描述

插屏广告要写在js文件中

let interstitialAd = null
Page({
  onLoad() {
    if(wx.createInterstitialAd){
　　　//1.创建广告实例
      interstitialAd = wx.createInterstitialAd({ adUnitId: 'xxxx' })
　　　//3.监听广告，广告显示出来以后你要做的操作
      interstitialAd.onLoad(() => {
        console.log('onLoad event emit')
      })
　　　//其实可以不用管这个onError，它的作用是如果广告拉取失败，就提示你
      interstitialAd.onError((err) => {
        console.log('onError event emit', err)
      })
　　　//广告关闭时，触发。
      interstitialAd.onClose((res) => {
        console.log('onClose event emit', res)
      })
    }
  },
  onshow:function(){
    //2.让广告显示出来
    interstitialAd.show().catch((err) => {
      console.error(err)
    })
  }

插屏广告需要注意的是：
1、不能在小程序一进来的时候就加入插屏广告。
2、插屏广告可能在电脑微信开发工具里显示不出来，要用真机调试才能看到