如果你想讓你的網站或頁面在微信中分享時,能夠顯示自定義的標題、描述和圖片,那么你需要在html中添加如下的meta標簽:
<!-- 若自己有一個分享圖片要指定對應鏈接,否則使用默認圖標即可 --><meta property="og:image" content="http://example.com/your-image.png"><meta property="og:title" content="你的標題"><meta property="og:description" content="你的描述">
其中,og:image是指定分享出去的圖片鏈接,og:title是指定分享的標題,og:description是指定分享的描述。
同時,為了讓微信客戶端能夠識別并正確顯示上述內容,需要在頁面中添加如下的js代碼:
<!-- 注意此處在微信端無法直接加載cdn --><script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script><script>wx.ready(function () { // 需要通過下面這個接口注入配置 wx.onMenuShareAppMessage({ title: '自定義分享標題', desc: '自定義分享描述', link: 'http://example.com', imgUrl: 'http://example.com/your-image.png', success: function () { // 用戶確認分享后執行的回調函數 }, cancel: function () { // 用戶取消分享后執行的回調函數 } }); }); </script>
微信客戶端設備的js-api提供了豐富的功能,如獲取地理位置、掃一掃等操作,因為此處僅需要設置頁面分享內容,故只提取了onMenuShareAppMessage這個API用于演示。
以上,就是在html中設置微信分享內容的步驟。當然,由于微信的版本千變萬化,使用js-api可能會有更新,更為完整和詳細的資料可以訪問微信開放平臺-微信JS-SDK官方文檔。
上一篇vue 3制作自己的庫
下一篇python 開發者工具