微信小程序引入广告位功能,详细步骤！！！

大家碰到过首页加载时一开始出现的广告页面，这种微信官方提供了一个api进行设置，下面我们来详细解释一下。

首先第一步需要小程序累计用户数达到1000即可开通流量主，成功开通流量主之后就可以创建相应的广告位了，包括banner广告、激励广告、插屏广告、和封面广告等。

开通流量主后如何创建广告位？

1、登录进入微信小程序后台–推广–流量主–广告管理–点击【立即创建】按钮。

2、小程序广告分有Banner广告、激励广告、插屏广告、视频广告、视频贴片广告、格子广告、封面广告和原生模板广告，我们一般人只需要开通Banner广告、激励广告、插屏广告和封面广告即可。点击【新建广告位】按钮。

3、选择广告位类型，如选择Banner广告，输入广告位名称如咧表页广告，然后点击【确认】按钮即可。至此，我们已经成功创建了一个Banner广告，并获得相应的广告位ID。

点击【进入广告位列表】按钮回到广告位列表，可以看到我们刚才创建的广告位已经处于开启状态。重复以上操作，继续创建激励广告、插屏广告等广告位。

4、封面广告的设置，在广告位列表点击切换到“封面广告”，点击广告位状态下的按钮让其处于“已开启"状态，然后点击操作下的“场景设置”。

5、在“快速配置”中的“展示场景”，点击选项框即可出现相应的场景选项，勾选想要展示的场景后点击【确认】按钮即可。

小程序代码引入广告

微信官方文档

创建插屏广告组件。请通过 wx.getSystemInfoSync() 返回对象的 SDKVersion 判断基础库版本号后再使用该 API。每次调用该方法创建插屏广告都会返回一个全新的实例（小程序端的插屏广告实例不允许跨页面使用）。

代码案例：仅供参考

mounted() {// 在页面中定义插屏广告let interstitialAd = null// 在页面onLoad回调事件中创建插屏广告实例if (wx.createInterstitialAd) {interstitialAd = wx.createInterstitialAd({adUnitId: 'xxxxxxxxxxxxxxx'//广告单元 id})interstitialAd.onLoad(() => {})interstitialAd.onError((err) => {})interstitialAd.onClose(() => {})}// 在适合的场景显示插屏广告if (interstitialAd) {interstitialAd.show().catch((err) => {console.error(err)})}// 插屏广告结束},

微信小程序引入广告位功能,详细步骤！！！相关推荐

微信小程序开发语言（微信小程序开发教程）详细步骤
微信小程序开发语言开发微信小程序用什么语言 1.微信小程序开发所需要的语言比较特别,首先介绍一下需要使用到的文件类型大致分为:WXML(WeiXin Mark Language 微信标记语言).WX ...
人才招聘微信小程序开发制作功能介绍
人才招聘微信小程序开发制作功能介绍功能详情: 1.展示职位列表 2.展示简历列表 3.企业会员中心 4.个人会员中心展示 5.首页推荐企业广告位展示 6.职位详情展示人才招聘微信小程序企业入驻及 ...
小程序安装Vant Weapp详细步骤,下载和npm安装版
小程序安装Vant Weapp详细步骤使用npm下载 1.新建项目并初始化项目 2.下载Vant Weapp 3.修改 app.json 4.构建 npm 包 5.引入组件下载方式 1. npm下 ...
黯然微信小程序杂记（三）：微信小程序实现倒计时功能附讲解教学附源码
黯然微信小程序杂记(三):微信小程序实现倒计时功能附超详细注释附源码一.功能描述二.界面展示三.test.wxml代码四.test.js代码(注释很详细很易懂) CSDN私信我,有关微信 ...
微信小程序实战购物车功能
代码地址如下: http://www.demodashi.com/demo/12400.html 一.准备工作软件环境:微信开发者工具官方下载地址:https://mp.weixin.qq.com ...
微信小程序与卡券功能小结
微信小程序与卡券功能小结前段时间公司有一个微信小程序的项目,其中有与卡券打通的功能,但是微信的官方文档实在是一言难尽...找了很多资料才解决这个问题,其中涉及到卡券的领取,卡券的核销等,在这里做一个 ...
python玩微信小程序游戏_使用python实现微信小程序自动签到功能
功能描述目标完成多账号微信小程序每天自动签到输出签到成功则向微信群发送签到成功的信息否则提示用户签到失败,需手动签到包管理 requests itchat time threading 程序 ...
微信小程序搜索php,如何解决微信小程序没有模糊搜索功能
现在微信小程序有重新推出新的功能,那就是进行模糊搜索,但是很多朋友微信小程序没有模糊搜索功能怎么办,下文小编就为大家带来详细介绍,一起看看吧现在微信小程序有重新推出新的功能,那就是进行模糊搜索,用户 ...
微信小程序引入vant-weapp组件遇到的bug以及解决方法
微信小程序引入vant-weapp组件遇到的bug问题原本百度了一波,说只要安装了node还有npm之后,使用gitBash命令行工具直接cd到根目录下然后直接引入以下代码: npm i vant- ...

微信小程序引入广告位功能,详细步骤！！！

小程序代码引入广告

微信小程序引入广告位功能,详细步骤！！！相关推荐

最新文章

热门文章