AI 繪圖整合進 WordPress：打造全自動內容生產線實戰

找圖永遠是寫文章和設計頁面最磨人的環節：合適的找不到、找到的怕版權，遇上抽象概念更是連圖庫都救不了。與其每篇內容都卡在這一步，不如把 AI 繪圖直接整合進 WordPress，讓配圖在發佈流程裡自動生出來。這篇就從 API 串接做到自動進媒體庫，實戰打造一條全自動的內容生產線。

但這幾年 AI 的發展，尤其是 AI 生成圖片技術，簡直是我們這些內容創作者和開發者的救星。從 DALL-E、Midjourney 到 Stable Diffusion，AI 不僅能畫出照片等級的逼真圖像，還能根據你天馬行空的想法創造出獨一無二的視覺作品。問題來了：怎麼把這麼酷炫的技術，無縫整合進我們最熟悉的 WordPress 工作流程裡？

今天，我就要來點硬核的，不只是聊聊裝哪個外掛就好，而是帶你深入探討「AI 生成圖片整合 WordPress 實作」的兩種路徑，從簡單的外掛方案到更具彈性的 API 串接，一步步教你打造屬於自己的全自動內容生產線。準備好了嗎？泡杯咖啡，我們開始吧！

外掛 vs. API：你該選擇哪條路？

要在 WordPress 裡使用 AI 繪圖功能，主要有兩種方法：安裝現成的外掛，或是自己動手串接 API。這兩種方式就像是買現成的套裝電腦跟自己組裝電腦一樣，各有優劣，沒有絕對的好壞，只有適不適合你的需求。

輕鬆上手的外掛方案：方便，但不夠自由

對於不想碰程式碼、追求快速上線的朋友來說，市面上有許多優秀的 AI 外掛可以選擇，例如 AI Engine、Imajinn AI 等。它們的優點非常明顯：

• 安裝即用： 就像安裝其他 WordPress 外掛一樣簡單，在後台點幾下就能完成設定。
• 介面整合： 通常會直接整合在 WordPress 的編輯器或媒體庫中，使用體驗非常流暢。
• 一站式服務： 你不需要自己去申請各大 AI 平台的 API Key，外掛通常會幫你處理好，你只需要付費給外掛開發商即可。

聽起來很美好對吧？但身為一個囉嗦的工程師，我還是得提醒你幾個缺點。這些外掛通常是「黑盒子」，你很難客製化它的功能，例如你想調整 API 請求的特定參數，或是想把生成流程整合到你的客製化功能中，可能就會卡關。此外，費用通常是訂閱制，長期下來也是一筆開銷，而且網站的效能多少會被外掛影響。

終極彈性的 API 串接：我的地盤我作主

如果你跟我一樣，喜歡完全掌控自己的工作流程，追求極致的客製化與效能，那麼直接串接 API 絕對是你的首選。這代表我們將繞過外掛，直接用 PHP 程式碼和 AI 服務的 API 進行溝通。

• 完全客製化： 你可以決定 AI 生成的圖片要用在哪裡、怎麼用。例如，你可以做一個功能，讓商品上傳時自動根據商品標題生成情境圖。
• 成本更低： 直接使用 OpenAI 或 Stability AI 的 API，通常是按使用量計費，對於用量不大的用戶來說，成本可能比訂閱外掛更低。
• 效能更佳： 沒有多餘的外掛程式碼，只有你自己寫的精簡函式，對網站的負擔最小。

當然，缺點就是你需要具備一些基礎的 PHP 和 WordPress 開發知識。不過別擔心，接下來我就手把手帶你走一遍，你會發現其實沒有想像中那麼難。

實戰演練：用 PHP 串接 OpenAI DALL-E 3 API

接下來，我們就以目前最主流的 OpenAI DALL-E 3 為例，示範如何在 `functions.php` 中撰寫程式碼，讓我們可以直接在 WordPress 後台呼叫 API 來生成圖片，並自動存到媒體庫。

步驟一：取得你的 OpenAI API Key

首先，你必須有一個 OpenAI 帳號，並前往 API Keys 頁面建立一組屬於你的 API 金鑰。這組 Key 非常重要，就像你家的鑰匙，絕對不要外洩，也千萬不要直接寫在前端的 JavaScript 程式碼裡！最好的作法是將它儲存在 `wp-config.php` 檔案中。

打開你的 `wp-config.php`，在 `/* That's all, stop editing! Happy publishing. */` 這行註解之前，加上以下這行：

define('OPENAI_API_KEY', 'sk-YourSuperSecretApiKey');

記得把 `sk-YourSuperSecretApiKey` 換成你自己的金鑰。

步驟二：在 `functions.php` 建立 API 呼叫函式

現在，打開你佈景主題的 `functions.php` 檔案，我們要來寫核心的程式碼了。這段程式碼會建立一個名為 `generate_ai_image` 的函式，它會接收一個「提示詞 (Prompt)」，然後向 OpenAI API 發送請求。

function generate_ai_image_and_upload($prompt) {
    if ( !defined('OPENAI_API_KEY') ) {
        return new WP_Error('api_key_missing', 'OpenAI API Key is not defined.');
    }

    $api_key = OPENAI_API_KEY;
    $api_url = 'https://api.openai.com/v1/images/generations';

    $body = array(
        'model'    => 'dall-e-3', // 指定使用 DALL-E 3 模型
        'prompt'   => sanitize_text_field($prompt), // 清理一下使用者輸入的提示詞
        'n'        => 1, // 只生成一張圖片
        'size'     => '1024x1024', // 圖片尺寸
        'quality'  => 'standard', // 圖片品質 standard 或 hd
        'response_format' => 'url', // 希望回傳圖片的 URL
    );

    $args = array(
        'method'    => 'POST',
        'headers'   => array(
            'Content-Type'  => 'application/json',
            'Authorization' => 'Bearer ' . $api_key,
        ),
        'body'      => json_encode($body),
        'timeout'   => 60, // API 可能需要一點時間，將超時時間設長一點
    );

    // 使用 WordPress 內建的 HTTP API 發送請求
    $response = wp_remote_post($api_url, $args);

    if ( is_wp_error($response) ) {
        return $response; // 如果請求失敗，直接回傳錯誤
    }

    $response_body = json_decode(wp_remote_retrieve_body($response), true);

    // 檢查回傳的資料中是否有圖片 URL
    if ( isset($response_body['data'][0]['url']) ) {
        $image_url = $response_body['data'][0]['url'];
        // 下一步：將圖片存到媒體庫
        return upload_image_from_url($image_url, $prompt);
    } else {
        // 如果 API 回傳錯誤訊息，也把它記錄下來
        $error_message = isset($response_body['error']['message']) ? $response_body['error']['message'] : 'Unknown API error.';
        return new WP_Error('api_error', $error_message);
    }
}

這段程式碼的核心是 `wp_remote_post`，這是 WordPress 提供的標準函式，用來安全地發送 POST 請求。我們把模型、提示詞、尺寸等參數包成 JSON 格式，連同我們的 API Key 一起送出去。

步驟三：將生成圖片自動存入媒體庫

OpenAI API 會回傳一個暫存的圖片 URL，我們需要做的就是把這個 URL 的圖片下載下來，並存進 WordPress 的媒體庫。這一步超級關鍵，因為這樣圖片才能像我們手動上傳的一樣被管理和使用。

我們繼續在 `functions.php` 中加入下一個函式 `upload_image_from_url`：

function upload_image_from_url($image_url, $prompt) {
    // 引入 WordPress 處理檔案所需的核心檔案
    require_once(ABSPATH . 'wp-admin/includes/media.php');
    require_once(ABSPATH . 'wp-admin/includes/file.php');
    require_once(ABSPATH . 'wp-admin/includes/image.php');

    // 使用 WordPress 的 media_sideload_image 函式來下載並儲存圖片
    // 這個函式會幫我們處理掉所有繁瑣的細節
    $attachment_id = media_sideload_image($image_url, 0, strip_tags($prompt), 'id');

    if ( is_wp_error($attachment_id) ) {
        return $attachment_id;
    } else {
        // 成功！回傳媒體庫中這張圖片的 ID
        // 我們甚至可以順便幫圖片加上 Alt text
        update_post_meta($attachment_id, '_wp_attachment_image_alt', sanitize_text_field($prompt));
        return $attachment_id;
    }
}

看到 `media_sideload_image` 這個函式了嗎？它就是 WordPress 的內建神器！你給它一個 URL，它就會自動幫你把圖片下載、命名、儲存到 `wp-content/uploads` 資料夾，並在資料庫中建立對應的媒體項目。我們還順手用了 `update_post_meta`，把生成圖片的提示詞直接當作圖片的替代文字 (Alt Text)，對 SEO 超級加分！

不只是生成！AI 圖片的後續處理與優化

把 AI 整合進來只是第一步，身為追求卓越的工程師，我們要想得更遠。圖片生成了，然後呢？

自動化 SEO 描述與中繼資料

剛剛我們已經自動把提示詞設為 Alt Text，你甚至可以更進一步，呼叫 GPT-4 API，請它根據提示詞生成更詳細的圖片標題、說明和描述，讓你的圖片 SEO 更完整。

圖片效能優化不能忘

AI 生成的圖片通常是 PNG 或 JPG 格式，而且尺寸不小。千萬別忘了網站效能！圖片存入媒體庫後，應該要觸發自動化的優化流程，例如：

• 自動轉換為 WebP 格式： 使用 WebP Express 或類似外掛，將新上傳的圖片自動轉換成檔案更小、載入更快的 WebP 格式。
• 確保 Lazy Loading 啟用： 確保你的網站有啟用延遲載入 (Lazy Loading)，這對充滿圖片的頁面至關重要。

版權與道德議題：工程師也該懂的法律邊界

最後，也是最重要的一點。雖然 AI 生成的圖片號稱「獨一無二」，但其訓練資料來源於網路上大量的現有圖像，這也引發了複雜的版權爭議。在商業專案中使用 AI 生成圖時，請務必：

• 詳閱服務條款： 了解你所使用的 AI 平台（如 OpenAI）對於生成圖像的商業使用權限規定。
• 避免使用名人或品牌名稱： 在提示詞中應避免直接使用受版權保護的人物、角色或品牌，以免侵權。
• 保持透明： 如果網站內容大量使用 AI 生成圖，考慮在某處註明，增加透明度。

技術本身是中立的，但使用它的人必須負起責任。這點囉嗦，但非常重要。

總結：AI 是神隊友，還是劊子手？

從外掛的便利到 API 的靈活，我們今天深入探討了將 AI 繪圖能力整合進 WordPress 的各種可能性。AI 不再是遙不可及的技術，它已經可以成為我們日常工作流程中強大的助手，將我們從繁瑣的找圖地獄中解放出來，讓我們能更專注於內容與創意的發想。

AI 是一個強大的工具，一個能放大我們創造力的神隊友。關鍵在於我們如何駕馭它，將它無縫地融入我們的工作流程中，並思考技術背後的效能、SEO 與法律議題。希望今天的分享，能為你的 WordPress 網站打開一扇通往無限創意的大門。

推薦閱讀

• 你的 WordPress 網站是「真 AI」還是「裝 AI」？資深工程師手把手教你串接 OpenAI API，打造會思考的智慧大腦！
• 圖片載入慢到讓人想砸電腦？WordPress 圖片終極優化聖經：從 Lazy Load 到 WebP 全攻略
• API 亂糟糟，專案火葬場？資深工程師的 WordPress REST API 設計聖經 (REST + JSON)

需要更深入的 AI 整合方案嗎？

今天的教學只是一個開始，AI 的應用潛力無窮。無論是想打造更智慧的內容推薦系統、自動化的客戶服務 Chatbot，或是需要將 AI 深度整合到你的商業邏輯中，我們浪花科技的團隊都擁有豐富的實戰經驗。如果你有任何想法或專案需求，歡迎與我們聯繫，讓我們一起探索 AI 為你的事業帶來的無限可能！