HackMD
HTML｜連結預覽縮圖｜Open Graph｜如何設置｜圖片大小建議｜如何清除 LINE 服務器端緩存
什麼事 Open Graph？
官方中文翻譯：開放社交關係圖標記
是由 Facebook 提出的設定，目標是讓網頁在社交媒體呈現時，能有較豐富的內容展示，如縮圖、標題、描述等。
Facebook 官方資料：給網站管理員的分享功能指南
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
如何設置於 HTML 之中?
將程式碼放置於 HTML 的 <head> 標籤之中
這邊我們直接參考 W3school 的網站程式碼作為範例
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
<meta property="og:image" content="https://www.w3schools.com/images/w3schools_logo_436_2.png">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="436">
<meta property="og:image:height" content="228">
<meta property="og:title" content="W3Schools Free Online Web Tutorials">
<meta property="og:description" content="W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.">
以下整理出空的標籤（供複製取用
<meta property="og:image" content="圖片可使用「絕對路徑」或「相對路徑」">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="">
<meta property="og:image:height" content="">
<meta property="og:title" content="">
<meta property="og:description" content="">
圖片大小
臉書官方資料：
- 最小的可允許圖像尺寸為 200 x 200 像素。
- 圖像檔案的大小不可超過 8 MB。
- 請對高解析度裝置使用至少 1200 x 630 像素的圖像以獲得最佳顯示。您應至少使用 600 x 315 像素的圖像來顯示具有較大圖像的連結粉絲專頁貼文。
最佳建議尺寸：
請儘可能將圖像的長寬比維持在接近 1.91:1，以在動態消息中顯示完整圖像而不需任何裁剪。
製作圖案時需考慮到兩種剪裁：
- 長方形
- 正方形
因此盡量將重要具有「特色」或「意涵」的畫面至於中間。
這裡參考 W3school 的官網圖樣範例尺寸
影像尺寸：436px * 228px
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
清除 line 伺服器緩存：
- 輸入 Input URL: (你要刪除緩存的得連結)
- Language「 Chinese-Taiwan 」
- 勾選Clear Cache
- Submit
- 完成
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
參考資料：
