WordPress 作者資訊欄顯示本地頭像，無需 Gravatar 示意圖

WordPress 作者資訊欄顯示頭像（無需 Gravatar）：3 種做法

WordPress 可以在個人簡介中顯示頭像，而無需使用 Gravatar。實際做法取決於你是希望使用「每位用戶可上傳的個人頭像」（建議）還是「靜態／預設頭像」。

WordPress 作者資訊欄顯示個人頭像時，預設會透過 Gravatar 載入外部圖片。若你希望作者 Bio 使用本地頭像、無需依賴 Gravatar，本文比較外掛、子主題自訂碼與靜態預設三種做法，並以 Blocksy 子主題實作示範。

為什麼要取代 Gravatar？

  • 隱私：頭像與 Email 綁定，會對外請求 Gravatar
  • 第三方依賴：Gravatar 故障或被封鎖時，頭像無法顯示
  • 品牌一致性：無法統一使用自家設計的預設頭像
  • 效能：多一次外部 DNS/HTTP 請求

如果答案是肯定的，那麼這裡確實提供了解決方案。首先，您必須決定一個核心設計目標：您希望實作的是 「每個用戶自行上傳的照片」（← 強烈建議採用此方法），還是僅使用一個 「靜態/預設的頭像圖片」？

三種做法比較（簡表：外掛 / 自訂碼 / 靜態預設）

比較項目A：外掛B：自訂碼C：靜態預設
做法安裝本地頭像外掛子主題自訂碼全站預設圖或 Bio 硬編碼
技術門檻低中～高低
每位作者不同頭像✅✅❌
Blocksy 作者資訊欄✅✅（本站實作）⚠️
優點最快上線可控、少依賴最簡單、最一致
缺點依賴外掛需開發測試無個人化
適合短期／非技術團隊長期維護（推薦）單一作者／品牌站

選項 A： 本地頭像外掛

如果您希望快速實作功能，而不涉及複雜的代碼編寫和資料庫操作，這是最佳的選擇。

做法非常直接：安裝一個專用的「本地頭像外掛」。通過此外掛，用戶可以在他們的個人設定頁面中上傳一張代表自己的頭像圖。之後，在所有調用 get_avatar() 函數的地方，都會優先使用這張由用戶主動上傳的圖片。

推薦的外掛範例：

  • Simple Local Avatars
  • WP User Avatar (此功能組經常被品牌化為 ProfilePress)

優點： 通常無需修改任何網站主題（Theme）的主體代碼，部署流程極快。

缺點： 功能的穩定性和深度依賴於外掛本身的設計和維護。

選項 B : 子主題自定碼（推薦）

如果追求最高程度的客製化、最佳性能，且不希望依賴任何第三方插件功能，那麼手動編寫程式碼是唯一的出路。此方法的核心思想是：「將上傳頭像資料儲存在本地資料庫，然後強制覆蓋 原有的頭像生成機制。」

原理：

  1. 儲存機制 (Storage)： 由於核心的 WordPress 沒有內建「上傳」欄位，您必須手動編寫代碼將用戶上傳的圖片的 附件 ID (Attachment ID)，儲存到 user meta 中（例如命名為 local_avatar_id）。
  2. 覆蓋機制 (Override)： 接著，您需要利用一個名為 pre_get_avatar_data 的過濾器（Filter）。當 WordPress 即將輸出頭像資料時，您會在這個時間點「攔截」執行流程，強制修改傳入的參數，讓它使用我們自定義儲存的圖片 URL。

範例代碼結構 (建議放置在子主題 functions.php 或專屬外掛)： 

add_filter('pre_get_avatar_data', function($args, $id_or_email) {
    $user = false;

    if (is_numeric($id_or_email)) {
        $user = get_user_by('id', (int) $id_or_email);
    } elseif ($id_or_email instanceof WP_User) {
        $user = $id_or_email;
    } elseif (is_object($id_or_email) && !empty($id_or_email->user_id)) {
        $user = get_user_by('id', (int) $id_or_email->user_id);
    } elseif (is_string($id_or_email)) {
        $user = get_user_by('email', $id_or_email);
    }

    if (!$user) return $args;

    $attachment_id = (int) get_user_meta($user->ID, 'local_avatar_id', true);
    if (!$attachment_id) return $args;

    $size = !empty($args['size']) ? (int) $args['size'] : 96;
    $url  = wp_get_attachment_image_url($attachment_id, [$size, $size]);
    if (!$url) return $args;

    $args['url'] = $url;
    $args['found_avatar'] = true;
    return $args;
}, 10, 2);Code language: PHP (php)

只要上述代碼成功載入，之後在 Bio Template 中使用 echo get_avatar(get_the_author_meta(‘ID’), 96); 時，它就會自動優先調用本地上傳的圖片，從而繞開 Gravatar 的機制。

優點： 不依賴任何第三方插件功能，上傳頭像資料儲存在本地資料庫。

缺點： 必須手動編寫代碼。

選項 C : 靜態預設頭像

如果您根本不需要實現用戶主動上傳的功能（只是需要一個視覺上統一、穩定的作者形象），那麼可以使用這個方案。這也是最簡單的實作方式，因為它不涉及複雜的上傳管理機制。

您可以透過以下兩種方法之一：

  1. 自定義預設值 (Custom Default)： 透過 avatar_defaults 設定一個系統級別的默認頭像圖片。
  2. 硬編碼 (Hardcoding)： 直接將一張固定圖片的 URL 或 ID，寫入到您的 Bio Template 的代碼中。

適用場景： 網站內容穩定、作者形象不需頻繁更新或個人化的場景。

選項一：使用 avatar_defaults 設定自定義預設值

WordPress 允許開發者透過掛鉤（hook）到 avatar_defaults 過濾器 (filter)，將您自己的圖片加入可供選擇的默認頭像列表。這能讓您的主題在系統級別增加一個選項。

function my_custom_default_avatar($avatar_defaults) {
    // 定義本地圖片路徑
    $myavatar = get_stylesheet_directory_uri() . '/images/default-bio.png';
    // 將自定義頭像加入預設陣列
    $avatar_defaults[$myavatar] = "自定義個人頭像";
    return $avatar_defaults;
}
add_filter('avatar_defaults', 'my_custom_default_avatar');

// 【操作指南】
// 請將您的圖片 (default-bio.png) 放置在主題的 /images/ 資料夾內。Code language: PHP (php)

執行以上代碼後，請前往網站管理介面 (Dashboard) → 「設定」→「討論」→ 「預設 頭像」(Default Avatar)。您將會看到一個名為「自定義個人頭像」的新選項可供選擇。

這段機制兼容 get_avatar() 函數的調用，因此只要網站任何地方通常需要顯示頭像圖時，如果用戶未上傳本地照片，就會自動以您的預設圖片取代。

選項二：在作者資訊模板（Author Bio）中硬編碼圖像 (Hardcode)

如果您完全不想要依賴用戶個人上傳的機制，也不想參考 Gravatar 的流程，您可以直接跳過 get_avatar() 函數，直接在您的作者生平模板（Author Bio Template）中使用靜態圖片標籤輸出。

<div class="author-bio">
    <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/default-bio.png" 
         alt="Author bio picture" class="bio-avatar" />
    <p><?php the_author_meta('description'); ?></p>
</div>Code language: PHP (php)

這完全繞過了原有的頭像系統運作機制。

除非您自行增加判斷不同用戶權限（Roles）或 ID 的邏輯，否則所有作者的頭像介紹都會顯示這張相同圖片。

選擇建議：

  • 選擇方案一： 如果您的目標是維持與頭像系統的兼容性（即那些呼叫 get_avatar() 的外掛或主題仍需正常運作）。
  • 選擇方案二： 如果您追求完全的控制權，並且不關心 Gravatar 或單一用戶的個人化設定。

優點： 最簡單的實作方式

缺點： 只有一張固定圖片

如何在作者資訊欄顯示頭像（get_avatar_url() + Blocksy author box

在 Blocksy 中，單篇文章底部的作者資訊欄（Author Box）由主題函式 blocksy_author_box() 輸出。頭像並非在模板裡直接寫死 <img src="...">，而是透過 blocksy_get_avatar_url() 取得作者頭像網址，再渲染成 .author-box 區塊內的圖片。

Blocksy 內部最終會呼叫 WordPress 核心的 get_avatar_url()（見 官方文件）。而 get_avatar_url() 會走 get_avatar_data() 流程，因此在子主題掛上的 pre_get_avatar_data 過濾器（見 官方文件）同樣會生效——不必修改 Blocksy 的 author box 模板，作者資訊欄就會自動改用 local_avatar_id 對應的本地上傳圖片。

也就是說：本文選項 B 的實作，影響的不只是 get_avatar()，也包含 Blocksy 作者區塊、留言頭像等所有透過 WordPress 頭像 API 取圖的位置。

啟用 Blocksy 作者資訊欄

光有本地頭像程式碼，還要在主題裡開啟 Author Box，文章頁才會顯示作者資訊欄：

  1. 後台 (Dashboard) → 外觀 (Appearance) → 自訂（Customizer）
  2. 進入 Single Post（或對應文章類型的單篇設定）
  3. 找到 Author Box，將開關設為 啟用
  4. 可調整 Box Type、作者名稱標籤（H5 等）、社群連結、文章數量等選項
  5. 發佈自訂設定後，開啟任一文章頁檢查文末是否出現 .author-box 區塊

若某篇文章不想顯示作者區塊，可在該文的 Blocksy 文章選項中將 disable author box 設為停用（主題會依文章 meta 覆寫全域設定）。

作者簡介與頭像從哪裡來

作者資訊欄通常包含兩部分，來源不同：

  • 頭像：由頭像 API 解析。選項 B 實作後，請到 使用者 (Users)→ 個人資料 (Profile)，在「Local avatar」欄位上傳圖片並儲存。
  • 簡介文字：來自使用者個人資料的 個人說明（Biographical Info），Blocksy 會輸出到 .author-box-bio。

建議每位作者都補齊「個人說明」與本地頭像，否則作者資訊欄可能只有名稱、沒有簡介，或仍顯示預設頭像。

資料流程（選項 B + Blocksy）：

使用者上傳頭像 → 存入 local_avatar_id（user meta）→ 文章頁呼叫 blocksy_author_box() → blocksy_get_avatar_url() → get_avatar_url() → pre_get_avatar_data 回傳本地附件 URL → 作者資訊欄顯示本地上傳頭像。

本站實作（blocksy-child）

blocksy-child function.php


我們在子主題 functions.php 中實作了完整流程：

  • 使用者個人資料頁新增「Local avatar」上傳欄位（WP Media Library）
  • 以 local_avatar_id 存入 user meta
  • 透過 pre_get_avatar_data 覆寫頭像 URL

因此 作者資訊欄、留言區等所有呼叫 get_avatar() 的位置都會自動使用本地上傳圖片。

wordpress profile picture default template
default profile picture template in wordpress
wordpress profile picture gravatar
選項 B, profile picture replace gravatar in wordpress

進階：以 filter 覆寫 Author Box 頭像

Blocksy 另提供過濾器 blocksy:single:author_box:author-avatar-url，可在不改核心模板的情況下強制指定作者區塊頭像 URL；一般情況下使用 pre_get_avatar_data 已足夠，無需額外掛此 filter。

顯示異常時檢查

  • Customizer 是否已啟用 Author Box（預設為關閉）
  • 該篇文章是否勾選停用 author box
  • 作者是否已在個人資料上傳 Local avatar 並儲存
  • 子主題 functions.php 是否已載入 pre_get_avatar_data 程式碼
  • 快取外掛（如 Apache Cache, LiteSpeed Cache）是否清除後再預覽

常見問題（FAQ）

Q：WordPress作者資訊欄會自動顯示本地頭像嗎？
A：會。只要主題或外掛透過 get_avatar() 輸出頭像，pre_get_avatar_data 覆寫後就會顯示本地上傳圖片，無需改 Blocksy 模板。

Q：一定要裝外掛嗎？
A：不必。若你能修改子主題，選項 B（自訂碼）效能更好、依賴更少，也更容易版本控管。

Q：停用 Gravatar 後，沒上傳頭像的用戶會怎樣？
A：若未設定 local_avatar_id，WordPress 仍會回退到預設頭像（可能是 Gravatar 或主題預設圖）。可搭配選項 C 的 avatar_defaults 統一預設樣式。

結論

要在 WordPress 作者資訊欄顯示個人頭像、同時無需依賴 Gravatar，可依需求選擇三種做法：外掛最快、子主題自訂碼最可控、靜態預設頭像最簡單。若你使用 Blocksy 並能維護子主題，建議採用 local_avatar_id 搭配 pre_get_avatar_data 覆寫 get_avatar()——作者 Bio、留言區與其他呼叫頭像的位置都會自動改用本地上傳圖片，無須改主題模板。上線前請確認每位作者都已上傳頭像，或設定一致的預設圖

woodwood
woodwood

木木，2017 年起寫網誌。喜歡旅行、新科技和小玩意，把見聞與筆記留在這裡——給未來的自己，也給路過的你。