別再手動找圖!WordPress 終極 AI 繪圖整合實戰,打造全自動內容生產線

2025/08/15 | WP 開發技巧

別再手動找圖!WordPress 終極 AI 繪圖整合實戰,打造全自動內容生產線

嗨,我是浪花科技的資深工程師 Eric。不知道你是否跟我一樣,每次寫文章或設計頁面,最頭痛的環節之一就是「找圖」。不是找不到合適的,就是擔心圖庫的版權問題,搞得一個頭兩個大。有時候,一個概念很抽象,根本沒有現成的圖片可以用,真的是讓人想砸鍵盤。

但這幾年 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 網站打開一扇通往無限創意的大門。

推薦閱讀

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

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

常見問題 (FAQ)

Q1: 我可以使用 AI 生成的圖片在我的商業網站上嗎?會有版權問題嗎?

這是一個很好的問題,也是目前較具爭議的領域。一般來說,像 OpenAI 的 DALL-E 3,其服務條款允許用戶將生成的圖片用於商業用途,你擁有對該圖片的權利。然而,你必須確保你的「提示詞 (Prompt)」沒有侵犯他人的版權或商標(例如,不要生成「米老鼠在開特斯拉」)。建議在大量商用前,務必詳閱您所選 AI 服務的最新使用條款,並避免生成任何可能引起爭議的內容。

Q2: 我應該選擇 AI 繪圖外掛還是自己串接 API?

這完全取決於你的技術能力和需求。如果你不熟悉程式碼,只想快速在文章中加入 AI 圖片,那麼功能完整、介面友善的外掛是你的好選擇。但如果你追求極致的客製化、希望將 AI 生成流程與網站其他功能(如電子商務、會員系統)深度整合,並且在乎長期成本與網站效能,那麼花點時間學習自己串接 API 絕對是更值得的投資。

Q3: 串接 AI 繪圖 API 會不會拖慢我的網站後台速度?

呼叫外部 API 的確需要時間,特別是圖片生成這種運算密集的任務,通常需要幾秒到數十秒不等。這會在你「點擊生成按鈕」時造成等待,但它不會影響網站前台訪客的瀏覽速度。在我們的範例程式碼中,我們將 API 請求的 `timeout` 設為 60 秒,就是為了給 API 足夠的時間處理。這是在後台執行的非同步任務,所以並不會對你的網站整體效能造成持續性的負擔。

 
立即諮詢,索取免費1年網站保固