WordPress 精選圖片該用多大尺寸？

大多數人想要的數字是 1200 x 630 像素。這正是 Facebook、LinkedIn 和 X 在連結預覽時使用的比例（1.91:1），也是 Open Graph 圖片應該採用的尺寸。如果你設定精選圖片主要是為了讓分享出去的連結看起來正確，那就用 1200 x 630，到此為止就好。

但這個數字並不是你的佈景主題實際顯示在文章上的尺寸。WordPress 很少以原始尺寸顯示你的精選圖片。佈景主題會請求某個已註冊的特定圖片尺寸，而 WordPress 會提供符合的那個預先產生的裁切版本。這就是為什麼一張在 Facebook 上看起來完美的圖片，放進你的單篇文章範本裡卻可能顯得模糊、被拉伸或裁切錯誤。所謂「正確」的尺寸取決於佈景主題，而不是某個通用法則。

為什麼佈景主題會覆蓋掉那個數字

當你上傳一張圖片時，WordPress 並不會只儲存一個檔案。它會執行 wp_generate_attachment_metadata()，並為每一個已註冊的圖片尺寸產生衍生版本：三個預設尺寸（thumbnail、medium、large）、區塊編輯器用的 medium_large（寬 768px），再加上佈景主題或外掛透過 add_image_size() 註冊的任何尺寸。

一個想要寬版 16:9 主視覺的佈景主題，會在 functions.php 裡寫類似這樣的程式碼：

add_theme_support( 'post-thumbnails' );
add_image_size( 'hero-featured', 1200, 675, true );

第四個參數 true 代表硬裁切（hard crop）。WordPress 會把你的圖片精確裁切成 1200 x 675，並丟棄任何不符合 16:9 框架的部分。如果你的主體靠近畫面的上緣或下緣，就會被切掉。設為 false（或省略）時，圖片會等比例縮放，最終的尺寸可能和你要求的不一樣。

接著範本會決定要取用哪個尺寸：

the_post_thumbnail( 'hero-featured' );

傳給 the_post_thumbnail() 的名稱是什麼，就會渲染出那個裁切版本。所以你網站上真正的精選圖片尺寸，是由兩個不是你自己寫的地方定義的：佈景主題裡的 add_image_size() 呼叫，以及 the_post_thumbnail() 呼叫。上傳一個更大的檔案並不會改變其中任何一個。

還有一層。WordPress 會提供 srcset，所以在較小的螢幕上，瀏覽器可能會載入 medium 或 large 衍生版本，而不是完整的裁切版本。你在開發者工具（DevTools）裡看到的尺寸，往往不是你上傳的那一個。

該如何依序修正

1. 先搞清楚你的佈景主題實際請求的是什麼。 在猜測之前，先看清楚 WordPress 從你的圖片產生的每一個尺寸，以及哪一個才是被裁切的主視覺。把你的圖片丟進 WordPress 圖片尺寸工具——它會以精確的像素尺寸顯示 WordPress 會建立的每一個衍生版本，讓你能把來源圖片對應到真正的目標，而不是那個虛構的 1200x630。

2. 上傳夠大的圖片以涵蓋最大的裁切尺寸。 如果佈景主題的主視覺是 1200 x 675，就至少上傳這個尺寸，理想上為了視網膜螢幕應該上傳 2 倍（2400 x 1350）。WordPress 縮小圖片很乾淨；但它永遠不會放大。來源圖片尺寸不足，是造成精選圖片模糊最常見的單一原因。

3. 讓你的長寬比符合佈景主題的裁切比例。 如果佈景主題硬裁切成 16:9，就餵給它 16:9 的圖片。構圖時把主體置中，這樣硬裁切才不會把任何人的頭切掉。

4. 如果註冊的尺寸有問題，就修改它並重新產生。 在子佈景主題裡編輯 add_image_size() 的數值，然後重建現有的縮圖——新尺寸只會套用在之後上傳的圖片，除非你執行：

wp media regenerate --yes

沒有 WP-CLI？Regenerate Thumbnails 外掛可以在控制台裡做到同樣的事。

不該做的事

不要以為只上傳一張 1200x630 的圖片就萬事俱備。 如果佈景主題註冊的尺寸是 16:9，WordPress 會硬裁切你那張 1.91:1 的圖片，於是你就會失去上下兩端。Open Graph 的數字和顯示用的數字是兩件不同的工作。

不要為了「保留原圖」而停用 WordPress 的圖片尺寸。 有人會找到把中間尺寸設為 0 或解除 the_post_thumbnail 掛鉤的建議。這麼做之後，佈景主題會退而在瀏覽器裡提供縮小後的完整尺寸檔案——一張 4000px 的 JPEG 被送到手機上。這會拖垮你的載入速度和 Core Web Vitals。這些衍生版本的存在是有原因的。

不要相信外掛的「建議尺寸」勝過你佈景主題實際註冊的尺寸。 SEO 外掛建議 OG 標籤用 1200x630，這對那個標籤來說是正確的。但它完全沒有說明你的單篇文章範本會裁切成什麼樣子。

不要在更改尺寸後省略 wp media regenerate。 編輯 add_image_size() 對已經上傳的圖片毫無作用。這是大家會忘記的步驟，然後就下結論說程式碼沒有用。

還是卡住嗎？

如果在對齊尺寸並重新產生之後圖片仍然不對，問題通常出在裁切模式（true 與 false），或是 srcset 提供了比你預期更小的衍生版本。把檔案丟進 圖片尺寸工具，看清楚你的設定究竟會產生哪些裁切版本，然後在開發者工具裡把它和瀏覽器實際載入的版本做比對。讓這兩者一致，猜測就結束了。