需求:自定義微信分享第三方頁面鏈接的標題和小縮略圖(如圖)
2018.6.4更新線 - - - - - - - - - - - - - - - - - -
更新:微信6.5.5版本以後調整了分享規則,針對的是沒有接入公衆號的網頁分享,必須接入微信認證公衆號!
查了下微信公衆平臺,以下做法只能在微信收藏內及收藏中長按‘轉發’時能生成縮略圖;而頁面內的‘發送給朋友’及‘分享到朋友圈’分享功能均失效了。。給各位博友帶來誤解,說聲抱歉。。
正確做法
1、標題(上圖中紅色框內文字)
- 生成標準:自動獲取當前頁面的標題,即title裏面的內容
- 自定義方法:設置頁面標題即可,可使用:document.title = “標題內容”,動態設置。
2、小縮略圖(上圖中紅色箭頭所指圖片)
- 生成標準(以下標準來自微信公衆平臺):
注:若頁面中沒有此標準的圖片,則會顯示箭頭1處的無圖樣式。- 自定義方法:在body標籤內的最前面放入一張寬度爲屏幕寬度80%的正方形img 。(如果不想顯示可將其隱藏,微信仍能提出來作小縮略圖)
<body>
<!--此圖片必須放在body標籤的最前面,且高度必須爲屏幕寬度的80% -->
<img src="你想要的小縮略圖的路徑" style="position:absolute; top:0; left:0; width: 80%; z-index:-1;opacity: 0; ">
<!-- 此處放其他元素 -->
</body>