網址分享到 LINE、Facebook 沒有圖片怎麼辦？

把網站上的文章分享到 LINE 群組或 Facebook，理想的樣子是一張大圖、一行標題、一兩句說明。實際上常常遇到：

• 只有一行網址，沒有圖片。
• 圖片是網站的 Logo，或一張不相干的圖。
• 標題是網站名稱，不是文章標題。
• 明明換了新圖，分享出去還是舊的。

這些問題的原因都一樣：分享預覽圖（og:image）的設定。這篇說明它是怎麼運作的，以及怎麼修。

分享預覽是怎麼來的

你把網址貼到 LINE 或 Facebook 的那一刻，平台會派一個程式去打開那個網頁，讀網頁開頭（<head>）裡的幾個標籤，照標籤的內容組成預覽卡片。

這組標籤叫做 Open Graph，名稱都是 og: 開頭。網頁有寫，平台就照著顯示；沒寫，平台只好自己猜。Facebook 的開發者文件就寫明，沒有這些標籤時，它會用自己的判斷去猜標題、說明和圖片。猜錯，就是上面那些狀況。

我們自己也遇過。正威的網站 2026 年 9 月改版時，服務頁、關於我們這幾頁分享到 LINE、Facebook，沒有縮圖、標題也不對。查下去才發現，這幾頁只設定了給 Google 看的搜尋標題和說明，沒有分享用的 og 標籤。補上之後，每一頁都有自己的分享圖，沒有專屬圖片的頁面，就用一張 1200 × 630 的品牌圖。

最基本的 4 個標籤

<meta property="og:title" content="文章標題">
<meta property="og:description" content="一兩句說明，告訴別人點進來會看到什麼">
<meta property="og:image" content="https://example.com/images/share-1200x630.jpg">
<meta property="og:url" content="https://example.com/article">

• og:title：分享卡片上的標題。Facebook 建議寫文章本身的標題，不用加網站名稱。
• og:description：標題下面的說明，一兩句就好。
• og:image：預覽圖。要寫完整的網址，包含 https://。
• og:url：這一頁的正式網址。

另外可以加上圖片的寬高：

<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">

Facebook 的文件說明，平台要先抓過一次圖片才能顯示；寫了寬高，第一次分享時比較不會出現沒有圖的情況。

預覽圖要多大

照 Facebook 開發者文件的建議：

• 尺寸：至少 1200 × 630 像素，高解析度的手機上才清楚。
• 比例：大約 1.91 : 1，也就是橫的長方形。
• 最小：200 × 200，小於這個不會顯示。
• 檔案大小：8 MB 以內。實際上壓到幾百 KB 就夠了，分享時載入比較快。

設計預覽圖時，重要的字和 Logo 放在中間。不同平台、不同畫面顯示預覽的方式不太一樣，邊緣有可能被裁掉。

WordPress 怎麼設定

大部分 WordPress 網站，是靠 SEO 外掛輸出這些標籤，例如 Yoast SEO、Rank Math：

• 裝了外掛，文章通常會用「精選圖片」當預覽圖，所以每篇文章記得設精選圖片。
• 想讓分享的圖和精選圖片不一樣，在編輯文章畫面下方的外掛設定裡，找「社群」相關的分頁，可以另外上傳。
• 網站首頁、沒有精選圖片的頁面，外掛裡通常可以設一張預設分享圖。

怎麼確認網頁有沒有這些標籤？在電腦上打開網頁，按 Ctrl + U（Mac 是 Option + Command + U）看原始碼，搜尋 og:image。找不到，就是沒設定。

改了圖，分享出去還是舊的

這是最常被問的問題。原因是平台會把抓過的預覽存起來（快取），下次有人分享同一個網址，直接用存好的，不會每次重新抓。

• Facebook：用 Facebook 的「分享偵錯工具」（Sharing Debugger），貼上網址，它會重新抓一次網頁，顯示抓到的標籤和錯誤。另外，Facebook 是依「圖片網址」快取圖片的，換圖時換一個新檔名上傳，不要用同一個檔名覆蓋舊圖。
• LINE：LINE 也會快取預覽，一段時間後才會更新。急著要新的預覽，可以在分享的網址後面加上參數，例如 https://example.com/article?v=2，平台會把它當成新網址重新抓。網址本身打開的還是同一頁。

所以最好的做法是：上線前就把預覽圖設好，第一次分享就是對的。

分享前的檢查清單

1. 原始碼裡有 og:title、og:description、og:image、og:url。
2. 預覽圖是 1200 × 630 左右的橫圖，重要的字在中間。
3. 圖片網址是完整的 https:// 網址，打得開。
4. 每篇文章有自己的預覽圖，不是全站同一張。
5. 改過圖的話，用新檔名，再用分享偵錯工具更新一次。

文章寫好了，分享出去的第一印象就是這張卡片。正威網路行銷是 25 年經驗的基隆網頁設計工作室，也服務台北和全台灣的客戶。網站分享出去的樣子不對，不知道從哪裡改起，歡迎免費諮詢。