網(wǎng)站轉(zhuǎn)APP,WordPress轉(zhuǎn)小程序,安卓蘋果微信百度支付寶抖音全平臺小程序
2024年12月21日 24262 6本文內(nèi)容來自Github項目的Readme.md文件(網(wǎng)址:https://github.com/longmix/wordpress-to-app),由后臺的機器人定期負(fù)責(zé)采集最新的內(nèi)容并自動更新此內(nèi)容。網(wǎng)站轉(zhuǎn)APP和網(wǎng)站轉(zhuǎn)小程序?qū)?yīng)的在線體驗網(wǎng)址為:https://yanyubao.tseo.cn/wa/wordpressdiy.html
Wordpress網(wǎng)站轉(zhuǎn)APP和小程序
本項目旨在將Wordpress網(wǎng)站轉(zhuǎn)成原生的APP和小程序項目,而不是簡單粗暴的H5套用。同時,集成了一些會員登錄和會員卡的功能,避免了與移動端瀏覽器相同的用戶體驗,極大提高了提高蘋果應(yīng)用商店和微信小程序、百度智能小程序的審核通過率。
之前已經(jīng)預(yù)報過,本項目即將合并到“通版商城V2”這個項目中,后續(xù)不會有大的版本更新了?!巴ò嫔坛荲2”提供強大的智能建站功能,管理后臺功能豐富,同樣支持APP和微信、支付寶、百度等小程序自動生成,將于近期上傳到github上,之前已經(jīng)有一些人拿到了項目源代碼。
1 在線預(yù)覽
2 項目概況
2.1 項目主頁
-
項目的設(shè)置和使用說明發(fā)布在這里:需要注冊才能查看,使用手機號碼登錄即可。
https://yanyubao.tseo.cn/Supplier/WordpressMgr/index/setting_type/source_code.html
-
主頁鏡像:定期同步項目主頁內(nèi)容,更新略有延遲
2.2 源代碼下載
-
直接下載壓縮包
https://yanyubao.tseo.cn/download/wordpress-plugin/yanyubao-wp-to-app.zip
-
最新的代碼發(fā)布在Github上,喜歡記得點個小星星!
-
考慮到Github在國內(nèi)訪問速度較慢,也可以通過國內(nèi)的Gitee查看。
-
因為是uniapp項目,所以也直接直接在uniapp網(wǎng)站上下載。
2.3 功能擴展:Wordpress企業(yè)211主題
-
產(chǎn)品介紹和客戶案例
-
延譽寶企業(yè)211主題使用幫助
2.4 問題與交流
使用上的問題和疑問,請用微信掃碼查看其他開發(fā)者的提問和回復(fù)記錄,也可以在文章末尾寫留言。

3 常用路徑設(shè)置說明
如果你不會代碼開發(fā),那么在后臺設(shè)置路徑和掛接這些路徑鏈接,即可以將你的WordPress網(wǎng)站組織成個性化的,功能豐富的小程序或者手機APP,APP完全符合蘋果應(yīng)用商店(App Store)的上架要求。
設(shè)置路徑:SaaS云后臺>>智能建站>>網(wǎng)站轉(zhuǎn)APP和小程序>>基礎(chǔ)信息 【傳送門】
3.1 小程序內(nèi)鏈接設(shè)置
-
主要跳轉(zhuǎn)鏈接:可直接掛在底部導(dǎo)航欄:
-
首頁 /pages/index/index
-
個人中心 /pages/index/usercenter
-
分類列表和標(biāo)簽列表 /pages/index/topic
-
關(guān)于頁面 /pages/about/about
-
-
跳轉(zhuǎn)文章列表:支持以下參數(shù):
-
/pages/wordpress/list
不帶任何參數(shù),返回所有的文章列表,按照最后更新時間排序。
-
/pages/wordpress/list?categorySlug=ebiz
顯示分類別名為“ebiz”的文章列表,同時自動讀取分類的名稱和圖片。
-
/pages/wordpress/list?categoryID=1234
categoryID為分類ID,可以在Wordpress網(wǎng)站后臺找到。
-
/pages/wordpress/list?search=延譽寶
則按照關(guān)鍵詞“延譽寶”搜素指定的文章并形成列表,需要做URL編碼。
-
/pages/wordpress/list?tag_id=167&tag_name=延譽寶
顯示內(nèi)容中包含標(biāo)簽ID為167的文章列表,多個標(biāo)簽ID用半角逗號分開;同時將標(biāo)簽名稱顯示為“延譽寶”。
-
/pages/wordpress/list?action=my_favorite
顯示我的收藏。
-
/pages/wordpress/list?action=my_like
顯示我的點贊。
-
可以(1)追加參數(shù)“categoryName=文章分類”指定顯示的文章分類名稱;(2)追加參數(shù) “categorySrc=http開頭的圖片網(wǎng)址”指定文章列表上方顯示的頭部圖片。
-
其他重要路徑鏈接
-
跳轉(zhuǎn)文章詳情
-
/pages/wordpress/detail?id=1234
id為文章ID,可以在Wordpress網(wǎng)站后臺找到。
可以直接參數(shù)參數(shù)one_article=1,不顯示相關(guān)的文章列表。
-
-
跳轉(zhuǎn)頁面詳情(新)
-
/pages/wordpress/detail?id=1234&is_page=1&page_no_comment=1
id為頁面ID,可以在Wordpress網(wǎng)站后臺找到。 is_page=1為必填參數(shù),省略會按照文章查詢而得不到查詢結(jié)果。 page_no_comment為可選參數(shù),如果設(shè)置了且值等于1,則頁面顯示評論列表和發(fā)表評論的功能。 備注:如果在服務(wù)器后臺關(guān)閉了整個項目的評論功能,此參數(shù)(page_no_comment=1)也無法打開。
-
-
跳轉(zhuǎn)頁面詳情(舊)
- /pages/wordpress/page?id=1234
id為頁面ID,可以在Wordpress網(wǎng)站后臺找到。
- /pages/wordpress/page?id=1234
-
個人資料頁面(有退出登錄的按鈕)
- /pages/user/userinfo
可以修改個人資料,也可以退出登錄
- /pages/user/userinfo
-
修改賬號和密碼
- /pages/user/usersetting?account=1
可以從個人資料頁面跳轉(zhuǎn)過來,也可以直接掛接。
- /pages/user/usersetting?account=1
-
修改昵稱
- /pages/user/usersetting?nickname=1
可以從個人資料頁面跳轉(zhuǎn)過來,也可以直接掛接。
- /pages/user/usersetting?nickname=1
-
修改手機號
- /pages/user/usersetting?mobile=1
可以從個人資料頁面跳轉(zhuǎn)過來,也可以直接掛接。
- /pages/user/usersetting?mobile=1
-
“關(guān)于”頁面
- switchTab pages/about/about
需要增加 switchTab,沒有其他特殊要求。
- switchTab pages/about/about
-
自定義頁面 【設(shè)置選項】
- 入口01: /pages/welcome_page/welcome_page?scene=1234@4321@cms
1234為CMS的文章ID,4321為推薦者的userid,可以設(shè)置為0,cms為平臺標(biāo)志,支持cms和pic兩個值。
- 入口02: /pages/welcome_page/welcome_page?parentid=4321&data_url=https%3A%2F%2Fyanyubao.tseo.cn%2Fopenapi%2FTestData%2Fwelcome_data
parentid為推薦者的userid,data_url為獲取的要顯示的內(nèi)容。
- 入口01: /pages/welcome_page/welcome_page?scene=1234@4321@cms
-
萬能表單 【設(shè)置選項】
- 支持對萬能表單和文章自定義屬性的掛接, 點擊設(shè)置選型查看詳情。
- CMS萬能表單:/pages/publish/publish_write?form_type=2&token=abcdefg&formid=1234
token為CMS控制臺的項目token,設(shè)置路徑為: 系統(tǒng)設(shè)置 > 全局配置選項 >商城頭條token, 【 點擊這里設(shè)置】,formid為CMS控制臺的表單ID。
小工具和小游戲
-
簡約時鐘 /pages/tools/clock
-
計算器 /pages/tools/calculator
-
擲骰子 /pages/tools/dice
-
掃雷 /pages/tools/mine_clearing
-
拼圖 /pages/tools/puzzle (內(nèi)測版)
-
涂鴉 /pages/tools/graffiti (微信小程序中正常,H5和APP中待驗證)
3.2 Tab頁面和非Tab頁面跳轉(zhuǎn)
-
如果頁面被tabBar包含,那么跳轉(zhuǎn)的時候,需要指定,具體格式為:
switchTab [pagepath]
用空格分開,switchTab跳轉(zhuǎn)的頁面,不能帶任何多余的參數(shù),即不可以出現(xiàn)“?”及其后面的內(nèi)容。
例如:跳轉(zhuǎn)到用戶中心的鏈接,可以設(shè)置為 switchTab /pages/index/usercenter
例如:跳轉(zhuǎn)到關(guān)于頁面的鏈接,可以設(shè)置為 switchTab pages/about/about
-
如果頁面沒有被tabBar包含,那么跳轉(zhuǎn)的時候,需要指定,具體格式為:
navigateTo [pagepath]
用空格分開,navigateTo跳轉(zhuǎn)的頁面,可以帶參數(shù),參數(shù)放在“?”后面。
3.3 跳轉(zhuǎn)到H5頁面鏈接設(shè)置
-
跳轉(zhuǎn)到H5頁面,直接填寫https://開頭的網(wǎng)址,需要說明的是,對應(yīng)的域名必須是在小程序登記的業(yè)務(wù)域名中,否則無法顯示頁面。
http鏈接中支持的變量有:%oneclicklogin%, %ensellerid%, %wxa_appid%, %wxa_openid%,具體說明如下:
- %oneclicklogin%一鍵登錄獲取用戶信息參數(shù),
- %ensellerid%商戶編碼,
- %wxa_appid%小程序appid,
- %wxa_openid%微信公眾號粉絲openid。
-
可以跳轉(zhuǎn)到H5的具體的應(yīng)用
-
嵌入H5網(wǎng)頁的時候,如果頁面內(nèi)設(shè)置了頭部導(dǎo)航欄,會與小程序默認(rèn)的導(dǎo)航欄重復(fù),影響頁面美觀。
在延譽寶系統(tǒng)的H5頁面中,我們都做了自動判斷,如果被小程序中引用,會自動隱藏H5的導(dǎo)航欄;如果是在APP中引用延譽寶的H5,請在頁面網(wǎng)址中增加參數(shù)“hidden_nav_header_h5=1”以達到隱藏的目的。
-
跳轉(zhuǎn)H5網(wǎng)頁默認(rèn)方式為“navigateTo”,即小程序的左上角會顯示返回的箭頭圖標(biāo);可以指定使用“redirectTo”跳轉(zhuǎn),跳轉(zhuǎn)后左上角顯示的是小房子圖標(biāo),用于快速回到首頁。
- 對于H5頁面內(nèi)需要反復(fù)跳轉(zhuǎn)的網(wǎng)頁應(yīng)用,建議使用redirectTo跳轉(zhuǎn),以避免用戶反復(fù)點擊返回鍵產(chǎn)生疑惑。
- 設(shè)置方式:在H5網(wǎng)頁的末尾添加“#redirectTo”。
- 支持“redirectTo”的跳轉(zhuǎn)設(shè)置為:
3.4 跳轉(zhuǎn)到其他小程序鏈接設(shè)置
-
跳轉(zhuǎn)到其他小程序,使用填寫以下格式:
miniprogram [url] [appid] [pagepath] [extraData]
用空格分開,具體的參數(shù)含義為:
- [url]替換為網(wǎng)址,[appid]替換為要跳轉(zhuǎn)的小程序,
- [pagepath]替換為小程序的路徑,可以包含參數(shù),如 /pages/detail/detail?id=1577
- [extraData]為模板小程序應(yīng)用級別的參數(shù)(App.onLaunch,App.onShow中獲?。?,如 {"sellerid":"abcdef","userid":"1234"},內(nèi)容中不能留空格,變量名稱和變量值必須用雙引號。
-
在APP中喚起微信小程序,設(shè)置相同,會識別APP環(huán)境,喚起微信并自動打開小程序和對應(yīng)的頁面;需要將appid換成小程序賬號(gh_開頭的),同時extraData參數(shù)不會被使用。
-
百度小程序中的相互跳轉(zhuǎn),設(shè)置相同,需要將appid換成百度智能小程序的app key,而不是填幾個數(shù)字的appid。
-
小程序官方平臺最新的升級,要求跳轉(zhuǎn)其他小程序需要先申明要跳轉(zhuǎn)的小程序ID,所以這里的appid,需要在發(fā)布小程序新版本的時候添加,登錄延譽寶CMS后的設(shè)置路徑為:(已經(jīng)無此限制)項目設(shè)置 >>小程序版本控制
3.5 撥打電話
-
如果需要撥打電話,請按照以下格式填寫:
tel:[phone_number]
- 舉例 “tel:13812345678”。
4 二次開發(fā)文檔
如果你會簡單的代碼開發(fā),最好了解一點微信小程序的開發(fā)工具,那么,接下來的文檔完全可以簡單讀懂。
4.1 源代碼:自定義開發(fā)和重新編譯
源代碼的編譯和二次開發(fā),在uniapp環(huán)境操作,具體的步驟如下:
- 下載項目源代碼:
通過uniapp網(wǎng)站或github或延譽服務(wù)器下載,建議通過github下載最新版本的源代碼。
-
在HBuilder X中打開項目。
-
修改配置:
- 【必改】打開項目根目錄下的 abot_data.js,如下圖所示:
- 修改 default_sellerid 為自己的延譽寶商戶編號;
- 修改xiaochengxu_appid為自己的小程序appid;
- 修改current_platform為當(dāng)前要發(fā)布的平臺名稱,可以設(shè)置的值有: app, h5, mp-weixin, mp-alipay, mp-baidu。
-
【選改】在項目根目錄下,打開pages.json,
- 找到 navigationBarTitleText 將值改為自己的網(wǎng)站名稱,還可以自定義標(biāo)題文字的顏色和頂部導(dǎo)航的背景色。
備注:微信小程序、百度智能小程序、支付寶小程序?qū)?yīng)的appid各不相同,請不要填錯了。
- 通過 HBuilder X將項目導(dǎo)入到不同的小程序開發(fā)環(huán)境中編譯并提交發(fā)布。
4.2 WordPress網(wǎng)站中如何設(shè)置?
建議在Wordpress網(wǎng)站中安裝我們的插件,可以提供以下豐富的功能擴展:
- 自定義內(nèi)容分類的圖標(biāo)、簡介。
- 自定義每篇文章在文章列表中豐富的展示形式,包括小圖片形式和橫幅圖片形式等。
- 自動生成文章分享的二維碼或者小程序碼海報。
- 豐富的百度小程序和微信小程序SEO優(yōu)化功能。
安裝WordPress插件的操作步驟如下:
-
下載Wordpress插件
包括“WP轉(zhuǎn)APP和小程序”和“WP-PostViews”兩個插件,并在后臺啟用,如下圖所示:
-
下載插件“WP轉(zhuǎn)APP和小程序”:下載地址見本文第一部分。
-
下載插件“WP-PostViews”:https://yanyubao.tseo.cn/download/wordpress-plugin/wp-postviews.zip
-
管理WordPress緩存
-
查看緩存空間大?。?https://yanyubao.tseo.cn/openapi/Wordpress/restapi_cache_list_size?sellerid=pNJNyxkkP
-
刪除所有緩存: https://yanyubao.tseo.cn/openapi/Wordpress/restapi_cache_list_clear?sellerid=pNJNyxkkP
-
刪除指定緩存(url): https://yanyubao.tseo.cn/openapi/Wordpress/restapi_cache_list_clear?sellerid=pNJNyxkkP&cacheurl={{完整的WP網(wǎng)址}} 其中cacheurl為對應(yīng)的實際請求網(wǎng)址,舉例:
-
刪除指定緩存(md5): https://yanyubao.tseo.cn/openapi/Wordpress/restapi_cache_list_clear?sellerid=pNJNyxkkP&cacheidmd5={{WP網(wǎng)址的MD5值}} 其中cacheidmd5為對應(yīng)的實際請求網(wǎng)址的md5字符串。
-
- 在Wordpress后臺的路徑“設(shè)置>>網(wǎng)站轉(zhuǎn)APP設(shè)置”中,
-
(1)填寫延譽寶商戶編號“pQNNmSkaq”,如上圖,如果沒有編號,登錄延譽寶后臺獲取。
-
(2)設(shè)置默認(rèn)的文章分類的封面,如上圖。
-
在Wordpress后臺的路徑“文章>>分類目錄”中,
增加或編輯某個目錄的時候,設(shè)置目錄封面,也可以自定義封面,如下圖。
-
設(shè)置電子會員卡,路徑為:“信息中心>>電子會員卡”。
電子會員卡的設(shè)置非常簡單,幫助手冊是針對不懂技術(shù)的用戶制作的,查看地址為:
所以對于開發(fā)者來說,屬于傻瓜文檔!
5 更多關(guān)于此項目的案例請參考下圖
6 常見問題(FAQ)
網(wǎng)站轉(zhuǎn)APP和小程序這個項目是免費的嗎? 是的,網(wǎng)站轉(zhuǎn)APP和小程序這個項目免費且開源(開放源代碼)。
關(guān)于開源的說明:客戶端是完全開源的,方便個性化的二次開發(fā)以及編譯發(fā)布;同時,我們也提供基于小程序第三方開放服務(wù)商模式的自動生成小程序。
因為受到SSL證書等安全限制,同時需要解決大并發(fā)、高頻訪問等,所以基于多點部署的服務(wù)器端應(yīng)用想開源幾乎是不現(xiàn)實。
雖然SaaS云服務(wù)維護成本和技術(shù)成本比普通服務(wù)器高,但是這個項目目前的政策依然是“免費”。
為什么需要設(shè)置商戶編號? 基于運營監(jiān)管政策的需要,幾乎所有網(wǎng)站都面臨內(nèi)容審查的壓力;同時,基于Wordpress網(wǎng)站的各種垃圾評論插件層出不窮, 所以要求訪問者登錄后才可以評論和點贊是非常必要的。
設(shè)置延譽寶的商戶編號,可以一鍵集成用戶登錄和身份認(rèn)證等復(fù)雜功能,減少開發(fā)難度,降低上線門檻。
個人中心必須顯示會員卡功能嗎,可以隱藏嗎? 個人中心的會員卡功能沒有隱藏選項,當(dāng)然,你可以自定義開發(fā),刪除和隱藏這些功能,因為這個項目是開源的,小程序和APP客戶端可以自由定制。
將網(wǎng)站轉(zhuǎn)為APP和小程序(包括微信小程序、支付寶小程序、百度智能小程序、抖音小程序等),不可以認(rèn)為只是簡單的將內(nèi)容展示形式做個改變, 因為那樣在用戶體驗上沒有任何提升,使用手機瀏覽器完全可以實現(xiàn)相同的效果。
個人中心集成會員卡功能,是延譽寶“網(wǎng)站轉(zhuǎn)APP和小程序”解決方案的亮點,提現(xiàn)了APP和小程序為訪問者提供新功能的目的,所以推薦保留會員卡功能。
7 主要升級記錄
2020.3.6.
1.刪除了部分頁面多余css代碼
2.對部分頁面的布局進行調(diào)整
3.對多個頁面添加注釋
2020.3.9.
完善二維碼海報功能
2020.4.28.
客服按鈕支持自定義圖片;
2020.5.18.
1、升級文章詳情內(nèi)容展示的組件;
2、可以自定義首頁功能圖標(biāo)是否顯示;
2020.5.23.
1、新增萬能表單功能;
2、可以在服務(wù)器端控制給不同小程序平臺返回不同的配置。
2021.1.20.
1、登錄頁面和用戶中心增加了返回首頁的按鈕。
2、優(yōu)化微信小程序中sitemap.json的結(jié)構(gòu)。
最近更新
- 網(wǎng)站轉(zhuǎn)APP,WordPress轉(zhuǎn)小程序,安卓蘋果微信百度支付寶抖音全平臺小程序
- 小程序和APP在線開發(fā)制作說明:超過100個設(shè)置選項自動生成企業(yè)官網(wǎng)/商城網(wǎng)站/拼團秒殺分銷/智能建站2.0
- 物聯(lián)網(wǎng)的底層通信與應(yīng)用案例深度剖析
- 延譽小工單軟件產(chǎn)品介紹和使用幫助
- 企業(yè)網(wǎng)站與商城 APP 開發(fā):AI 助力有限,程序員地位難撼
- 電腦端登錄忘記密碼怎么辦?
- 國際版進銷存軟件:不容忽視的多重弊端
- 獨立站熱度不減,谷歌百度排名依然堅挺
- 獨立站技術(shù)方案:WordPress三合一企業(yè)網(wǎng)站建設(shè)
- 商城APP和商城小程序運營推廣:智能建站2.0幫助手冊
猜你喜歡
- 微信、淘寶、百度、抖音:關(guān)于“打通”和解除屏蔽,互聯(lián)網(wǎng)大廠的恩怨情仇
- 企業(yè)法人快速注冊微信小程序
- 服務(wù)器選擇Linux系統(tǒng)的八大理由
- 房產(chǎn)中介小程序云服務(wù)器版,含小程序源代碼可定制開發(fā)
- 國際版進銷存軟件:不容忽視的多重弊端
- 求解:WWDC18后App Store開發(fā)者無法訪問appstoreconnect?
- 商城小程序開發(fā)基礎(chǔ)版永久免費,代申請公眾號小程序賬號僅399元
- ChatGPT的智能代碼編寫和軟件開發(fā)公司的新機遇
- Hybrid APP(混合模式APP)項目開發(fā)實戰(zhàn):內(nèi)訓(xùn)課程培訓(xùn)大綱
- 掃描普通二維碼如何打開小程序?一定要小程序碼嗎?