微信小程序怎么添加插屏廣告并設(shè)置顯示頻率-創(chuàng)新互聯(lián)

本篇內(nèi)容主要講解“微信小程序怎么添加插屏廣告并設(shè)置顯示頻率”，感興趣的朋友不妨來看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“微信小程序怎么添加插屏廣告并設(shè)置顯示頻率”吧!

在當(dāng)雄等地區(qū)，都構(gòu)建了全面的區(qū)域性戰(zhàn)略布局，加強(qiáng)發(fā)展的系統(tǒng)性、市場(chǎng)前瞻性、產(chǎn)品創(chuàng)新能力，以專注、極致的服務(wù)理念，為客戶提供網(wǎng)站建設(shè)、做網(wǎng)站 網(wǎng)站設(shè)計(jì)制作專業(yè)公司,公司網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),品牌網(wǎng)站設(shè)計(jì),營(yíng)銷型網(wǎng)站,成都外貿(mào)網(wǎng)站建設(shè),當(dāng)雄網(wǎng)站建設(shè)費(fèi)用合理。

插屏廣告


用戶觸發(fā)小程序中的特定場(chǎng)景時(shí)，插屏廣告將自動(dòng)向用戶展現(xiàn)，用戶可以隨時(shí)關(guān)閉插屏廣告。廣告觸發(fā)場(chǎng)景由流量主自定義，廣告按曝光計(jì)費(fèi)（CPM）。

微信小程序今年新上線了插屏廣告，設(shè)置和在代碼庫(kù)中接入都非常方便。詳細(xì)可見微信小程序官方文檔。

大體的流程就是在小程序后臺(tái)新建廣告位，獲取到廣告位的adUnitId并嵌入到源代碼，因?yàn)椴迤翉V告的單頁面性，在頁面的onload處添加即可。

let interstitialAd = null;
if (wx.createInterstitialAd) {
 interstitialAd = wx.createInterstitialAd({
  adUnitId: 'adunit-ID'
 })
}
if(interstitialAd) {
 interstitialAd.show().catch((err) => {
  console.error(err);
 })
}

嵌入廣告非常簡(jiǎn)單，畢竟微信已經(jīng)將所有的接口寫好了，開發(fā)者僅需調(diào)用即可。

主要的功能點(diǎn)是設(shè)置一個(gè)插屏廣告一天只顯示一次，而微信并沒有提供這方面的api，秉持前端能完成的就不要麻煩后端，便想到直接使用緩存存儲(chǔ)當(dāng)期日期，用戶打開頁面的時(shí)候獲取上次緩存的日期查看是否相同即可。

//這里使用的是mpVue框架，寫在mounted里。
let nowday = new Date().getFullYear().toString() + (new Date().getMonth() + 1).toString() + new Date().getDate().toString() ;

//獲取上次打開頁面時(shí)間
try {
 let lastDay = wx.getStorageSync('day');
 if(lastDay) {
  console.log('lastday', lastDay);
  console.log('nowday', nowday)
  if(lastDay == nowday) {
   this.flag = false;
  } else {
   this.flag = true;
  } 
 }
} catch (e) {
 //用戶首次打開
 this.flag = true;
 console.error(e);
 console.log('true no storage', this.flag)
}

if(interstitialAd && this.flag) {
 interstitialAd.show().catch((err) => {
  console.error(err);
 })
}
interstitialAd.onLoad(() => {
 try {
  wx.setStorageSync('day', nowday);
  console.log('存儲(chǔ)時(shí)間', nowday);
  } catch (e) { 
  console.log('err', err)
 }
})

PS：下面看下一天只顯示一次的彈出廣告

仿京東官網(wǎng)頂部的廣告關(guān)閉，效果為第一次進(jìn)入官網(wǎng)會(huì)出現(xiàn)廣告，然后點(diǎn)擊關(guān)閉，刷新網(wǎng)頁不會(huì)再顯示廣告，但是當(dāng)清除localStorage存入的數(shù)據(jù)，刷新網(wǎng)頁會(huì)再顯示廣告。

html代碼

<div class="header">
 <div class="header-a">
  <a href=""></a>
  <i class="close">x</i>
 </div>
</div>

css代碼

.header{
 width:100%;
 height:80px;
 background:#000;
}
.header-a{
 width:1190px;
 margin:0 auto;
 position:relative;
 background:url("images/1.jpg") no-repeat;
}
.header-a a{
 width:100%;
 height:80px;
 display:block;
}
.close{
 cursor:pointer;
 color:#fff;
 position:absolute;
 top:5px;
 right:5px;
 background:rgb(129, 117, 117);
 width: 20px;
 text-align: center;
 line-height: 20px;
}

js代碼

//localStorage方法
<script src="../js/jquery.min.js"></script>
function popAd(){
  //判斷l(xiāng)ocalStorage里有沒有isClose
  if(localStorage.getItem("isClose")){    
   $(".header").hide();
  }else{
   $(".header").show();
  }
  //點(diǎn)擊關(guān)閉隱藏圖片存取數(shù)據(jù)
  $(".close").click(function(){
   $(".header").fadeOut(1000);

   localStorage.setItem("isClose", "1"); 
  })
 }
 popAd();

chrome console清本地緩存localStorage.clear()

批量清：

localStorage.clear()

單獨(dú)清除某個(gè)記錄的緩存，如：

localStorage.clear("popup_info") 或 localStorage.removeItem("popup_info");

到此，相信大家對(duì)“微信小程序怎么添加插屏廣告并設(shè)置顯示頻率”有了更深的了解，不妨來實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)建站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

當(dāng)前名稱：微信小程序怎么添加插屏廣告并設(shè)置顯示頻率-創(chuàng)新互聯(lián)
當(dāng)前路徑：http://muchs.cn/article22/dphpcc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信小程序、標(biāo)簽優(yōu)化、網(wǎng)站維護(hù)、網(wǎng)站營(yíng)銷、做網(wǎng)站、響應(yīng)式網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)