如何將pbootcms手機網頁封裝成微信小程序
準備工作
1、登陸微信公眾平臺,申請微信小程序(這個不懂請百度)
2、搭建好pbootcms網站,需要支持https,例如://bilinxiyi.cn/,可以使用自適應模板,或者單獨的手機模板
3、安裝微信開發者工具,
操作步驟
第一步:登陸微信小程序官方平臺,獲取你的appid信息
第二步:打開微信開發者工具,創建小程序
將第一步獲取到的appid填寫進去,
第三步:修改app.json配置
1. 打開app.json文件,pages項只保留 "pages/index/index" 這一行即可
2. window項的navigationBarTitleText填寫小程序名稱
第四步:打開/pages/index/index.wxml文件,將里面的代碼全部刪除,添加下面這一行代碼
<web-view src="//bilinxiyi.cn/"></web-view>
注意代碼中的//www.cms88.com換成你自己的網站域名。
第五步:測試小程序
1. 見下圖,勾選不校驗合法域名、web-view(業務域名)、TLS版本以及HTTPS證書
2. 小程序正式上線后,需要在微信小程序管理中心中,把pbootcms網站域名添加為業務域名。
操作路徑:登錄微信公眾平臺 → 開發管理 → 開發設置 → 業務域名:
到此,pbootcms網站就封裝到了微信小程序中。
進階技巧
微信審核還是比較寬松的,如果有遇到不支持、或者不宜、不想要在微信小程序中顯示的內容的,可以通過JS來隱藏dom元素來實現屏蔽效果。
這里給一段演示代碼,有需要的朋友可以學習一下
<script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.3.2.js"></script> <script> var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { //ios的ua中無miniProgram,但都有MicroMessenger(表示是微信瀏覽器) wx.miniProgram.getEnv((res)=>{ if (res.miniprogram) { alert("在小程序里"); } else { alert("不在小程序里"); } }) }else{ alert('不在微信里'); } </script>
文章標題:如何將pbootcms手機網頁封裝成微信小程序
文章版權:PB模板網 (bilinxiyi.cn) 所發布的內容,部分為原創文章,轉載請注明來源,網絡轉載文章如有侵權請聯系我們!
原文作者:CMS博客 | //www.cms88.com/cms/231.html
本文最后更新發布于
2023-03-19 09:41:09
,某些文章具有時效性,若有錯誤或已失效,請在下方留言或聯系客服: