網(wǎng)站轉(zhuǎn)APP,WordPress轉(zhuǎn)小程序，安卓蘋果微信百度支付寶抖音全平臺(tái)小程序

 2025年5月13日  27362  6 本文內(nèi)容來自Github項(xiàng)目的Readme.md文件（網(wǎng)址：https://github.com/longmix/wordpress-to-app），由后臺(tái)的機(jī)器人定期負(fù)責(zé)采集最新的內(nèi)容并自動(dòng)更新此內(nèi)容。網(wǎng)站轉(zhuǎn)APP和網(wǎng)站轉(zhuǎn)小程序?qū)?yīng)的在線體驗(yàn)網(wǎng)址為：https://yanyubao.tseo.cn/wa/wordpressdiy.html

  

Wordpress網(wǎng)站轉(zhuǎn)APP和小程序

本項(xiàng)目旨在將Wordpress網(wǎng)站轉(zhuǎn)成原生的APP和小程序項(xiàng)目，而不是簡單粗暴的H5套用。同時(shí)，集成了一些會(huì)員登錄和會(huì)員卡的功能，避免了與移動(dòng)端瀏覽器相同的用戶體驗(yàn)，極大提高了提高蘋果應(yīng)用商店和微信小程序、百度智能小程序的審核通過率。

之前已經(jīng)預(yù)報(bào)過，本項(xiàng)目即將合并到“通版商城V2”這個(gè)項(xiàng)目中，后續(xù)不會(huì)有大的版本更新了?！巴ò嫔坛荲2”提供強(qiáng)大的智能建站功能，管理后臺(tái)功能豐富，同樣支持APP和微信、支付寶、百度等小程序自動(dòng)生成，將于近期上傳到github上，之前已經(jīng)有一些人拿到了項(xiàng)目源代碼。

1 在線預(yù)覽

在線預(yù)覽

2 項(xiàng)目概況

2.1 項(xiàng)目主頁

項(xiàng)目的設(shè)置和使用說明發(fā)布在這里：需要注冊(cè)才能查看，使用手機(jī)號(hào)碼登錄即可。

https://yanyubao.tseo.cn/Supplier/WordpressMgr/index/setting_type/source_code.html
主頁鏡像：定期同步項(xiàng)目主頁內(nèi)容，更新略有延遲

http://www.76516.cn/2616.html

2.2 源代碼下載

直接下載壓縮包

https://yanyubao.tseo.cn/download/wordpress-plugin/yanyubao-wp-to-app.zip
最新的代碼發(fā)布在Github上，喜歡記得點(diǎn)個(gè)小星星！

https://github.com/longmix/wordpress-to-app
考慮到Github在國內(nèi)訪問速度較慢，也可以通過國內(nèi)的Gitee查看。

https://gitee.com/longmix/wordpress-to-app
因?yàn)槭莡niapp項(xiàng)目，所以也直接直接在uniapp網(wǎng)站上下載。

https://ext.dcloud.net.cn/plugin?id=1542

2.3 功能擴(kuò)展：Wordpress企業(yè)211主題

產(chǎn)品介紹和客戶案例

http://www.76516.cn/446.html
延譽(yù)寶企業(yè)211主題使用幫助

http://www.76516.cn/qiye211themehelp

2.4 問題與交流

使用上的問題和疑問，請(qǐng)用微信掃碼查看其他開發(fā)者的提問和回復(fù)記錄，也可以在文章末尾寫留言。

3 常用路徑設(shè)置說明

如果你不會(huì)代碼開發(fā)，那么在后臺(tái)設(shè)置路徑和掛接這些路徑鏈接，即可以將你的WordPress網(wǎng)站組織成個(gè)性化的，功能豐富的小程序或者手機(jī)APP，APP完全符合蘋果應(yīng)用商店（App Store）的上架要求。

設(shè)置路徑：SaaS云后臺(tái)>>智能建站>>網(wǎng)站轉(zhuǎn)APP和小程序>>基礎(chǔ)信息 【傳送門】

3.1 小程序內(nèi)鏈接設(shè)置

主要跳轉(zhuǎn)鏈接：可直接掛在底部導(dǎo)航欄：
- 首頁 /pages/index/index
- 個(gè)人中心 /pages/index/usercenter
- 分類列表和標(biāo)簽列表 /pages/index/topic
- 關(guān)于頁面 /pages/about/about
跳轉(zhuǎn)文章列表：支持以下參數(shù)：
- /pages/wordpress/list
  
  不帶任何參數(shù)，返回所有的文章列表，按照最后更新時(shí)間排序。
- /pages/wordpress/list?categorySlug=ebiz
  
  顯示分類別名為“ebiz”的文章列表，同時(shí)自動(dòng)讀取分類的名稱和圖片。
- /pages/wordpress/list?categoryID=1234
  
  categoryID為分類ID，可以在Wordpress網(wǎng)站后臺(tái)找到。
- /pages/wordpress/list?search=延譽(yù)寶
  
  則按照關(guān)鍵詞“延譽(yù)寶”搜素指定的文章并形成列表，需要做URL編碼。
- /pages/wordpress/list?tag_id=167&tag_name=延譽(yù)寶
  
  顯示內(nèi)容中包含標(biāo)簽ID為167的文章列表，多個(gè)標(biāo)簽ID用半角逗號(hào)分開；同時(shí)將標(biāo)簽名稱顯示為“延譽(yù)寶”。
- /pages/wordpress/list?action=my_favorite
  
  顯示我的收藏。
- /pages/wordpress/list?action=my_like
  
  顯示我的點(diǎn)贊。

 可以（1）追加參數(shù)“categoryName=文章分類”指定顯示的文章分類名稱；（2）追加參數(shù) “categorySrc=http開頭的圖片網(wǎng)址”指定文章列表上方顯示的頭部圖片。

其他重要路徑鏈接
跳轉(zhuǎn)文章詳情
- /pages/wordpress/detail?id=1234
  
  id為文章ID，可以在Wordpress網(wǎng)站后臺(tái)找到。
  
  可以直接參數(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)站后臺(tái)找到。 is_page=1為必填參數(shù)，省略會(huì)按照文章查詢而得不到查詢結(jié)果。 page_no_comment為可選參數(shù)，如果設(shè)置了且值等于1，則頁面顯示評(píng)論列表和發(fā)表評(píng)論的功能。備注：如果在服務(wù)器后臺(tái)關(guān)閉了整個(gè)項(xiàng)目的評(píng)論功能，此參數(shù)（page_no_comment=1）也無法打開。
跳轉(zhuǎn)頁面詳情（舊）
- /pages/wordpress/page?id=1234
  
  id為頁面ID，可以在Wordpress網(wǎng)站后臺(tái)找到。
個(gè)人資料頁面（有退出登錄的按鈕）
- /pages/user/userinfo
  
  可以修改個(gè)人資料，也可以退出登錄
修改賬號(hào)和密碼
- /pages/user/usersetting?account=1
  
  可以從個(gè)人資料頁面跳轉(zhuǎn)過來，也可以直接掛接。
修改昵稱
- /pages/user/usersetting?nickname=1
  
  可以從個(gè)人資料頁面跳轉(zhuǎn)過來，也可以直接掛接。
修改手機(jī)號(hào)
- /pages/user/usersetting?mobile=1
  
  可以從個(gè)人資料頁面跳轉(zhuǎn)過來，也可以直接掛接。
“關(guān)于”頁面
- switchTab pages/about/about
  
  需要增加 switchTab，沒有其他特殊要求。
自定義頁面【設(shè)置選項(xiàng)】
- 入口01： /pages/welcome_page/welcome_page?scene=1234@4321@cms
  
  1234為CMS的文章ID，4321為推薦者的userid，可以設(shè)置為0，cms為平臺(tái)標(biāo)志，支持cms和pic兩個(gè)值。
- 入口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)容。
萬能表單【設(shè)置選項(xiàng)】
- 支持對(duì)萬能表單和文章自定義屬性的掛接，點(diǎn)擊設(shè)置選型查看詳情。
- CMS萬能表單：/pages/publish/publish_write?form_type=2&token=abcdefg&formid=1234
  
  token為CMS控制臺(tái)的項(xiàng)目token，設(shè)置路徑為：系統(tǒng)設(shè)置 > 全局配置選項(xiàng) >商城頭條token，【點(diǎn)擊這里設(shè)置】，formid為CMS控制臺(tái)的表單ID。

小工具和小游戲

簡約時(shí)鐘 /pages/tools/clock
計(jì)算器 /pages/tools/calculator
擲骰子 /pages/tools/dice
掃雷 /pages/tools/mine_clearing
拼圖 /pages/tools/puzzle （內(nèi)測(cè)版）
涂鴉 /pages/tools/graffiti （微信小程序中正常，H5和APP中待驗(yàn)證）

3.2 Tab頁面和非Tab頁面跳轉(zhuǎn)

如果頁面被tabBar包含，那么跳轉(zhuǎn)的時(shí)候，需要指定，具體格式為：

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)的時(shí)候，需要指定，具體格式為：

navigateTo [pagepath]

用空格分開，navigateTo跳轉(zhuǎn)的頁面，可以帶參數(shù)，參數(shù)放在“?”后面。

3.3 跳轉(zhuǎn)到H5頁面鏈接設(shè)置

跳轉(zhuǎn)到H5頁面，直接填寫https://開頭的網(wǎng)址，需要說明的是，對(duì)應(yīng)的域名必須是在小程序登記的業(yè)務(wù)域名中，否則無法顯示頁面。

http鏈接中支持的變量有：%oneclicklogin%， %ensellerid%， %wxa_appid%， %wxa_openid%，具體說明如下：
- %oneclicklogin%一鍵登錄獲取用戶信息參數(shù)，
- %ensellerid%商戶編碼，
- %wxa_appid%小程序appid，
- %wxa_openid%微信公眾號(hào)粉絲openid。
可以跳轉(zhuǎn)到H5的具體的應(yīng)用
- 跳轉(zhuǎn)到“我的余額” https://yanyubao.tseo.cn/User/agent_income.html?oneclicklogin=%oneclicklogin%
- 跳轉(zhuǎn)到“我的贈(zèng)款” https://yanyubao.tseo.cn/User/my_balance_zengsong.html?oneclicklogin=%oneclicklogin%
- 跳轉(zhuǎn)到“我的積分” https://yanyubao.tseo.cn/User/score.html?oneclicklogin=%oneclicklogin%
嵌入H5網(wǎng)頁的時(shí)候，如果頁面內(nèi)設(shè)置了頭部導(dǎo)航欄，會(huì)與小程序默認(rèn)的導(dǎo)航欄重復(fù)，影響頁面美觀。

在延譽(yù)寶系統(tǒng)的H5頁面中，我們都做了自動(dòng)判斷，如果被小程序中引用，會(huì)自動(dòng)隱藏H5的導(dǎo)航欄；如果是在APP中引用延譽(yù)寶的H5，請(qǐng)?jiān)陧撁婢W(wǎng)址中增加參數(shù)“hidden_nav_header_h5=1”以達(dá)到隱藏的目的。
跳轉(zhuǎn)H5網(wǎng)頁默認(rèn)方式為“navigateTo”，即小程序的左上角會(huì)顯示返回的箭頭圖標(biāo)；可以指定使用“redirectTo”跳轉(zhuǎn)，跳轉(zhuǎn)后左上角顯示的是小房子圖標(biāo)，用于快速回到首頁。
- 對(duì)于H5頁面內(nèi)需要反復(fù)跳轉(zhuǎn)的網(wǎng)頁應(yīng)用，建議使用redirectTo跳轉(zhuǎn)，以避免用戶反復(fù)點(diǎn)擊返回鍵產(chǎn)生疑惑。
- 設(shè)置方式：在H5網(wǎng)頁的末尾添加“#redirectTo”。
  
  例如： https://app.tseo.cn/o2owaimai/Merchant/MerchantWap/index/ensellerid/pQNNmSkaq?refresh_token_value=%refresh_token%&synchronize_userid=1
- 支持“redirectTo”的跳轉(zhuǎn)設(shè)置為：
  
  https://app.tseo.cn/o2owaimai/Merchant/MerchantWap/index/ensellerid/pQNNmSkaq?refresh_token_value=%refresh_token%&synchronize_userid=1#redirectTo

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)用級(jí)別的參數(shù)（App.onLaunch，App.onShow中獲取），如 {"sellerid":"abcdef","userid":"1234"}，內(nèi)容中不能留空格，變量名稱和變量值必須用雙引號(hào)。
在APP中喚起微信小程序，設(shè)置相同，會(huì)識(shí)別APP環(huán)境，喚起微信并自動(dòng)打開小程序和對(duì)應(yīng)的頁面；需要將appid換成小程序賬號(hào)（gh_開頭的），同時(shí)extraData參數(shù)不會(huì)被使用。
百度小程序中的相互跳轉(zhuǎn)，設(shè)置相同，需要將appid換成百度智能小程序的app key，而不是填幾個(gè)數(shù)字的appid。
小程序官方平臺(tái)最新的升級(jí)，要求跳轉(zhuǎn)其他小程序需要先申明要跳轉(zhuǎn)的小程序ID，所以這里的appid，需要在發(fā)布小程序新版本的時(shí)候添加，登錄延譽(yù)寶CMS后的設(shè)置路徑為：（已經(jīng)無此限制）
```
  項(xiàng)目設(shè)置 >>小程序版本控制
```
如果已經(jīng)登錄，點(diǎn)擊這里設(shè)置。

3.5 撥打電話

如果需要撥打電話，請(qǐng)按照以下格式填寫：
```
tel:[phone_number]
```
- 舉例 “tel:13812345678”。

4 二次開發(fā)文檔

如果你會(huì)簡單的代碼開發(fā)，最好了解一點(diǎn)微信小程序的開發(fā)工具，那么，接下來的文檔完全可以簡單讀懂。

4.1 源代碼：自定義開發(fā)和重新編譯

源代碼的編譯和二次開發(fā)，在uniapp環(huán)境操作，具體的步驟如下：

下載項(xiàng)目源代碼：

通過uniapp網(wǎng)站或github或延譽(yù)服務(wù)器下載，建議通過github下載最新版本的源代碼。

在HBuilder X中打開項(xiàng)目。
修改配置：

【必改】打開項(xiàng)目根目錄下的 abot_data.js，如下圖所示：
- 修改 default_sellerid 為自己的延譽(yù)寶商戶編號(hào)；
- 修改xiaochengxu_appid為自己的小程序appid；
- 修改current_platform為當(dāng)前要發(fā)布的平臺(tái)名稱，可以設(shè)置的值有： app， h5， mp-weixin， mp-alipay， mp-baidu。

源代碼修改

【選改】在項(xiàng)目根目錄下，打開pages.json，
- 找到 navigationBarTitleText 將值改為自己的網(wǎng)站名稱，還可以自定義標(biāo)題文字的顏色和頂部導(dǎo)航的背景色。

備注：微信小程序、百度智能小程序、支付寶小程序?qū)?yīng)的appid各不相同，請(qǐng)不要填錯(cuò)了。

通過 HBuilder X將項(xiàng)目導(dǎo)入到不同的小程序開發(fā)環(huán)境中編譯并提交發(fā)布。

4.2 WordPress網(wǎng)站中如何設(shè)置？

建議在Wordpress網(wǎng)站中安裝我們的插件，可以提供以下豐富的功能擴(kuò)展：

自定義內(nèi)容分類的圖標(biāo)、簡介。
自定義每篇文章在文章列表中豐富的展示形式，包括小圖片形式和橫幅圖片形式等。
自動(dòng)生成文章分享的二維碼或者小程序碼海報(bào)。
豐富的百度小程序和微信小程序SEO優(yōu)化功能。

安裝WordPress插件的操作步驟如下：

下載Wordpress插件

包括“WP轉(zhuǎn)APP和小程序”和“WP-PostViews”兩個(gè)插件，并在后臺(tái)啟用，如下圖所示：

下載插件“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為對(duì)應(yīng)的實(shí)際請(qǐng)求網(wǎng)址，舉例：
  
  http://www.tseo.cn/wp-json/wp/v2/posts/1792
- 刪除指定緩存（md5）： https://yanyubao.tseo.cn/openapi/Wordpress/restapi_cache_list_clear?sellerid=pNJNyxkkP&cacheidmd5={{WP網(wǎng)址的MD5值}} 其中cacheidmd5為對(duì)應(yīng)的實(shí)際請(qǐng)求網(wǎng)址的md5字符串。

在Wordpress后臺(tái)的路徑“設(shè)置>>網(wǎng)站轉(zhuǎn)APP設(shè)置”中，

（1）填寫延譽(yù)寶商戶編號(hào)“pQNNmSkaq”，如上圖，如果沒有編號(hào)，登錄延譽(yù)寶后臺(tái)獲取。
（2）設(shè)置默認(rèn)的文章分類的封面，如上圖。

在Wordpress后臺(tái)的路徑“文章>>分類目錄”中，

增加或編輯某個(gè)目錄的時(shí)候，設(shè)置目錄封面，也可以自定義封面，如下圖。

設(shè)置電子會(huì)員卡，路徑為：“信息中心>>電子會(huì)員卡”。

電子會(huì)員卡的設(shè)置非常簡單，幫助手冊(cè)是針對(duì)不懂技術(shù)的用戶制作的，查看地址為：

http://www.76516.cn/627.html

所以對(duì)于開發(fā)者來說，屬于傻瓜文檔！

5 更多關(guān)于此項(xiàng)目的案例請(qǐng)參考下圖

在線預(yù)覽

6 常見問題（FAQ）

網(wǎng)站轉(zhuǎn)APP和小程序這個(gè)項(xiàng)目是免費(fèi)的嗎？ 是的，網(wǎng)站轉(zhuǎn)APP和小程序這個(gè)項(xiàng)目免費(fèi)且開源（開放源代碼）。

關(guān)于開源的說明：客戶端是完全開源的，方便個(gè)性化的二次開發(fā)以及編譯發(fā)布；同時(shí)，我們也提供基于小程序第三方開放服務(wù)商模式的自動(dòng)生成小程序。

因?yàn)槭艿絊SL證書等安全限制，同時(shí)需要解決大并發(fā)、高頻訪問等，所以基于多點(diǎn)部署的服務(wù)器端應(yīng)用想開源幾乎是不現(xiàn)實(shí)。

雖然SaaS云服務(wù)維護(hù)成本和技術(shù)成本比普通服務(wù)器高，但是這個(gè)項(xiàng)目目前的政策依然是“免費(fèi)”。

為什么需要設(shè)置商戶編號(hào)？ 基于運(yùn)營監(jiān)管政策的需要，幾乎所有網(wǎng)站都面臨內(nèi)容審查的壓力；同時(shí)，基于Wordpress網(wǎng)站的各種垃圾評(píng)論插件層出不窮，所以要求訪問者登錄后才可以評(píng)論和點(diǎn)贊是非常必要的。

設(shè)置延譽(yù)寶的商戶編號(hào)，可以一鍵集成用戶登錄和身份認(rèn)證等復(fù)雜功能，減少開發(fā)難度，降低上線門檻。

個(gè)人中心必須顯示會(huì)員卡功能嗎，可以隱藏嗎？ 個(gè)人中心的會(huì)員卡功能沒有隱藏選項(xiàng)，當(dāng)然，你可以自定義開發(fā)，刪除和隱藏這些功能，因?yàn)檫@個(gè)項(xiàng)目是開源的，小程序和APP客戶端可以自由定制。

將網(wǎng)站轉(zhuǎn)為APP和小程序（包括微信小程序、支付寶小程序、百度智能小程序、抖音小程序等），不可以認(rèn)為只是簡單的將內(nèi)容展示形式做個(gè)改變，因?yàn)槟菢釉谟脩趔w驗(yàn)上沒有任何提升，使用手機(jī)瀏覽器完全可以實(shí)現(xiàn)相同的效果。

個(gè)人中心集成會(huì)員卡功能，是延譽(yù)寶“網(wǎng)站轉(zhuǎn)APP和小程序”解決方案的亮點(diǎn)，提現(xiàn)了APP和小程序?yàn)樵L問者提供新功能的目的，所以推薦保留會(huì)員卡功能。