微慕小程序開源版A標籤優化說明

微慕WordPress小程序全部版本里，對於文章詳情裏文字內容的解析，都是經過開源組件：wxParse 不過這個組件已經中止維護，微慕小程序在這個組件上作了一些優化，讓文章裏文字在小程序顯示更加完美。但，對於A標籤的解析，一直不夠完善，好比不能很好跳轉小程序裏的任意頁面，不能跳轉到其餘小程序，不能打開包含業務域名的連接。

好比在文章裏跳轉到另外一個文章，在pc端的html裏能夠輕易實現的，在小程序卻比較困難，由於小程序的頁面和pc端的頁面路徑不是同樣的。微慕小程序原來的解決方案-wordpress的固定連接設置成以下格式：

而後在小程序端解析這個連接，實現小程序的頁面跳轉。但這個解決方案不友好：

一、過於依賴固定連接的格式，並且並非全部wordpress網站都用這個格式，若是僅僅爲了頁面跳轉就調整固定連接格式，對SEO很不利，代價太大。
二、只能跳轉文章的頁面，對於其餘頁面，好比分類、標籤頁面，就沒法跳轉了。

那如何作到既實如今pc端的連接跳轉又能夠實如今小程序裏「定製化」的跳轉，受到短代碼的啓發,能夠給A標籤加上特定的屬性，用於支持小程序裏的A標籤自定義跳轉。因而我在標籤里加了三個屬性：

一、appid ： 須要跳轉小程序的appid ，若是是跳轉本小程序或業務域名的連接，不須要填寫這個屬性。

二、path : 小程序頁面路徑（包括參數），不管是跳轉本小程序，仍是其餘小程序都須要填寫這個屬性。對於微慕小程序的頁面路徑和參數的獲取能夠經過小程序的開發工具，獲取方法能夠看這個視頻：微慕WordPress小程序開發教程——獲取小程序頁面路徑

對於其餘小程序的頁面路徑的獲取，請看文章：獲取更多頁面路徑

三、redirectype：跳轉的類型，apppage-跳轉本小程序 miniapp-跳轉其餘小程序 webpage-跳轉業務域名的連接

優化後的A標籤形式以下:

在小程序端顯示樣式以下圖所示：若是是跳轉小程序，會在連接前面看見一個小程序logo圖標

固然這種對A標籤的優化須要手動加入這個三個屬性，若是是之前的文章須要再次編輯加入，仍是有些麻煩，不過對於新文章你能夠考慮採用這個方式來跳轉了。

爲了方便加入這個優化的A標籤，我給TinyMCE編輯器增長A標籤按鈕，簡化錄入方式，只須要添加相關屬性的值便可。

特別注意：在使用TinyMCE編輯器裏，若是使用優化的A標籤，不要切換到「可視化」模式，只能在「文本」模式使用，若是切換到「可視化」模式會把原來添加到A標籤的三個屬性去掉，可能編輯器以爲這三個屬性不是標準屬性，因而就刪除了。

微慕小程序專業版和微慕小程序加強版已經支持該功能。

btw: 微慕小程序開源版最近作一些小更新，主要更新的內容以下：

一、分享到朋友圈。
二、優化騰訊視頻解析
三、去除「猜你喜歡」中重複的文章
四、修復時間格式化的bug
五、優化A標籤的跳轉

謝謝你的閱讀，謝謝你對微慕小程序的支持。

原文連接：https://www.watch-life.net/wechat/about-minapper-free-a-tag.html