把 AI 裝進 WordPress：打造會學習、懂互動的智慧官網全攻略

結論先講：什麼才算「AI 智慧官網」？

很多人以為「裝個 AI 外掛、加個聊天機器人」就等於擁有 AI 官網。這是個誤會。真正的智慧官網不是表面功能，而是把 AI 的語意理解能力深度整合進網站的核心邏輯——讓它能依訪客行為調整內容、用你自己的資料回答問題、並從沉睡的數據裡挖出決策洞察。

本文用工程師視角，回答三個你最關心的問題：智慧官網到底長什麼樣？該從哪三個場景切入？以及怎麼動手實作（含一段可直接用的 WordPress 短代碼程式碼）。最後也會誠實提醒導入 AI 容易踩的坑。

身為一個整天跟程式碼和伺服器打交道的工程師，我看過太多企業官網，砸了大錢做得美美的，結果功能跟一張數位傳單沒兩樣——只能被動展示資訊，使用者看過就忘。最近一堆客戶跑來問：「Eric，我們想做個 AI 網站，裝哪個外掛比較好？」每次聽到這個問題，我都有點哭笑不得。大佬們，AI 不是裝個外掛、加個聊天機器人就叫「智慧」了，那頂多算是給網站裝了隻鸚鵡，只會重複你教它的話。今天我就從架構思維出發，聊聊如何把 AI 真正融入你的 WordPress 網站。

重新定義「智慧官網」：它和「裝個 AI 外掛」差在哪？

首先要打破一個迷思：AI 網站 ≠ 聊天機器人。聊天機器人只是 AI 應用的一種，而且市面上很多機器人根本談不上「智慧」，只是一堆預設好的 if-else 判斷式。一個真正意義上的智慧官網，應該具備三大核心特質：

• 超個人化（Hyper-Personalization）：網站不再對所有人千篇一律，而是根據訪客的行為、偏好、過去的互動紀錄，動態調整呈現的內容與推薦。這就像一個頂尖的線下銷售，能一眼看出客戶的需求。
• 流程自動化（Process Automation）：把重複性、低價值的工作交給 AI，例如自動分類客戶問題、初步篩選潛在客戶、依用戶行為觸發特定行銷郵件，把人力解放出來做更有創造力的事。
• 數據洞察（Data Intelligence）：你的網站每天都在產生大量數據，但大多在沉睡。AI 能喚醒這些數據，挖掘出肉眼難以發現的模式，例如分析用戶流失的關鍵節點，輔助你做更精準的商業決策。

坦白說，市面上很多號稱「AI」的外掛，充其量只是某個 AI API 的一個 UI 介面，讓你方便按個按鈕生成文章或圖片。這不是不好，但離我們所說的「智慧大腦」還差得遠。我們要做的，是把 AI 的能力深度整合進網站的核心邏輯。

智慧官網的架構藍圖：三大核心 AI 應用場景

光說不練假把戲。一個智慧化的 WordPress 網站，可以從以下三個核心場景著手。這不是要你三個都做，而是根據業務需求，選擇最能創造價值的切入點。

場景一：打造超個人化的使用者體驗（AI Personalization）

想像一個電商網站：訪客 A 逛了筆電、機械鍵盤；訪客 B 看了美妝、保養品。傳統網站對他們倆的首頁長得一模一樣。但智慧官網會在首頁黃金版位，為訪客 A 推薦電競周邊，為訪客 B 展示熱銷色號。

技術實現思路

1. 數據追蹤：透過 JavaScript 追蹤使用者的點擊、瀏覽頁面、停留時間等行為，並將這些匿名化數據透過 REST API 傳回 WordPress 後端。
2. 用戶輪廓建立：將數據存入自訂資料表（Custom Table），為每個訪客（或會員）建立行為標籤或輪廓（Profile）。例如：{user_id: 123, interests: ['tech', 'gaming'], viewed_products: [101, 102]}。
3. AI 推薦引擎：當用戶再次訪問時，把他的輪廓資料交給 AI 模型——例如用 Embeddings API 將產品描述向量化，再找出與用戶興趣最相關的產品——取得個人化推薦清單。
4. 動態內容呈現：在前端用自訂的 Shortcode 或 Gutenberg 動態區塊，根據 AI 回傳的清單動態載入並顯示對應內容。

這種做法遠比單純的「猜你喜歡」外掛精準，因為它建立在真實的用戶行為數據之上，並透過 AI 的語意理解能力進行推薦。

場景二：建構 24/7 全自動的智慧客服（AI 知識庫問答）

前面說了，別再用 if-else 的假 AI 機器人。現在的語言模型，完全可以基於你網站現有的所有內容（文章、產品說明、FAQ），打造成一個專屬於你的知識庫問答專家。這套做法的學名叫 RAG（Retrieval-Augmented Generation，檢索增強生成）：先「檢索」出最相關的內部資料，再讓模型「依據這些資料」生成回答。

技術實現思路

1. 知識庫建立：撰寫一個 WP-CLI 指令或 PHP 腳本，掃描你網站中所有文章（post）、頁面（page）或自訂文章類型（cpt）的內容。
2. 內容向量化：把掃描到的每段內容，透過 Embeddings API 轉換成向量數據。簡單來說，就是把文字變成 AI 能理解的數學座標——語意越接近的文字，座標距離越近。
3. 向量儲存：將內容原文與其對應的向量數據，存進專門的向量資料庫（如 Pinecone、Weaviate）；對於中小型網站，甚至可以先存成一個 JSON 檔案。
4. 問答流程：當使用者在聊天視窗提問時，流程如下：
   • 將使用者的「問題」也轉換成向量。
   • 在向量資料庫中，搜尋與「問題向量」距離最近的幾段「內容向量」。
   • 把這幾段最相關的「原文內容」當作上下文（Context），連同使用者的「問題」一起傳給大型語言模型（LLM）。
   • 給 LLM 一個明確的指令（Prompt）：「請根據以下提供的上下文回答使用者的問題。如果上下文中沒有答案，請誠實告知使用者你不知道。」

這樣做出來的 Chatbot，回答內容都源自你自己的網站資料，準確率極高，也大幅降低了 AI「胡說八道」（所謂的幻覺，hallucination）的機率，能真正解決用戶的具體問題。

關鍵差別：一般機器人是「憑記憶亂猜」，RAG 機器人是「翻書再回答」。後者答錯的代價低很多，因為它的答案永遠錨定在你給定的資料來源上。

場景三：挖掘數據金礦的智慧分析（AI Data Analysis）

你的聯絡表單、商品評論區，其實都是未經琢磨的數據金礦。AI 可以幫你自動化地分析它們。

技術實現思路

1. 數據攔截：利用 WordPress 的 Hooks 機制，在數據寫入資料庫前進行攔截。例如用 wpcf7_before_send_mail 攔截 Contact Form 7 的提交內容，或用 comment_post 攔截新的留言。
2. AI 分析與標籤化：把攔截到的文字內容傳給 AI 模型並下達分析指令。例如：
   • 情緒分析：「請分析這段留言的情緒，回傳『正面』、『負面』或『中性』。」
   • 意圖分類：「請分析這封表單的內容，判斷客戶意圖是『售前諮詢』、『技術支援』還是『商務合作』。」
   • 關鍵字提取：「請從這段評論中，提取出使用者最關心的 3 個產品特點。」
3. 結果儲存：把 AI 分析後的結果（例如「負面」、「技術支援」），以 meta 形式（post_meta 或 comment_meta）儲存起來。
4. 後台儀表板：開發一個客製化的後台儀表板頁面，讀取這些 meta 數據並視覺化。你就能一目了然地看到，最近負面情緒評論是否增加，或哪一類諮詢佔比最高，從而快速反應。

技術實戰：動手寫一個 AI 內容摘要的 Shortcode

講了這麼多理論，手會癢是正常的。這裡給你一段可以直接用的程式碼，體驗把 AI 整合進 WordPress 的感覺。我們做一個很簡單的功能：在文章中插入一個 [ai_summary] 短代碼，它會自動呼叫 OpenAI API，生成這篇文章的摘要。

囉嗦一句：這段程式碼請加到你子佈景主題的 functions.php，或一個你自製的功能性外掛裡。直接改主題的 functions.php？拜託不要，主題一更新你的心血就全沒了。

/**
 * 呼叫 OpenAI API 來生成內容摘要
 * @param string $content 文章內容
 * @return string 摘要內容或錯誤訊息
 */
function get_openai_summary($content) {
    // 提醒：千萬不要把你的 API 金鑰直接寫在程式碼裡！最好是存在 wp-config.php 或資料庫中。
    $api_key = defined('OPENAI_API_KEY') ? OPENAI_API_KEY : '';
    if (empty($api_key)) {
        return 'OpenAI API 金鑰未設定。';
    }

    $api_url = 'https://api.openai.com/v1/chat/completions';

    // 移除 HTML 標籤和多餘空白，擷取前 3000 字元以控制成本
    $stripped_content = wp_strip_all_tags($content);
    $trimmed_content = mb_substr($stripped_content, 0, 3000);

    $body = [
        'model' => 'gpt-3.5-turbo',
        'messages' => [
            [
                'role' => 'system',
                'content' => '你是一個專業的內容編輯，請用繁體中文為以下文章生成一段 150 字以內的精簡摘要。'
            ],
            [
                'role' => 'user',
                'content' => $trimmed_content
            ]
        ],
        'max_tokens' => 250,
        'temperature' => 0.7
    ];

    $args = [
        'body' => json_encode($body),
        'headers' => [
            'Content-Type' => 'application/json',
            'Authorization' => 'Bearer ' . $api_key
        ],
        'timeout' => 30
    ];

    // 使用 WordPress 內建的 HTTP API，這才是專業的做法
    $response = wp_remote_post($api_url, $args);

    if (is_wp_error($response)) {
        return '呼叫 API 失敗：' . $response->get_error_message();
    }

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

    if (isset($response_body['choices'][0]['message']['content'])) {
        return $response_body['choices'][0]['message']['content'];
    }

    return '無法從 API 回應中獲取摘要。';
}

/**
 * 註冊 [ai_summary] 短代碼
 */
function ai_summary_shortcode_handler() {
    global $post;

    // 只在單一文章或頁面執行
    if (!is_singular() || empty($post->post_content)) {
        return '';
    }

    // 導入快取機制，避免每次瀏覽都重新呼叫 API，浪費錢又拖慢速度！
    $cache_key = 'ai_summary_' . $post->ID;
    $cached_summary = get_transient($cache_key);

    if (false !== $cached_summary) {
        // 有快取，直接回傳
        return '<div class="ai-summary-box"><strong>AI 摘要：</strong>' . esc_html($cached_summary) . '</div>';
    }

    // 沒有快取，呼叫 API
    $summary = get_openai_summary($post->post_content);

    // 將結果存入快取，有效期 24 小時 (24 * 60 * 60 秒)
    set_transient($cache_key, $summary, 24 * HOUR_IN_SECONDS);

    return '<div class="ai-summary-box"><strong>AI 摘要：</strong>' . esc_html($summary) . '</div>';
}
add_shortcode('ai_summary', 'ai_summary_shortcode_handler');

這段程式碼做了幾件很重要的事：

• 安全性：提醒你 API 金鑰不要寫死，最好定義在 wp-config.php 裡，像這樣：define('OPENAI_API_KEY', '你的金鑰');。
• 標準化：使用 WordPress 內建的 wp_remote_post() 函數發送 API 請求，而不是直接用 cURL，這樣更穩定也更符合 WordPress 的開發規範。
• 效能考量：最關鍵的一點！我用了 WordPress 的 Transients API（get_transient 和 set_transient）來做快取。第一次生成摘要後，結果會被暫存 24 小時；在這期間，任何訪客瀏覽同一篇文章都會直接從快取讀取，不會重複呼叫昂貴又耗時的 API。這才是工程師該有的細膩。

把這個範例延伸一下，你會發現它正是前面三大場景的縮影：呼叫 API → 處理回應 → 快取結果。無論是個人化推薦、知識庫問答還是數據分析，骨架都一樣，差別只在於你餵給模型什麼資料、下什麼指令。

避開 AI 導入的常見陷阱：工程師的真心提醒

在大家熱血沸騰準備大幹一場之前，我還是得潑幾桶冷水。導入 AI 不是沒有代價的，請務必注意以下幾點：

• 成本失控：API 呼叫是按量計費的。如果沒做好快取或用量限制，一篇熱門文章可能在短時間內燒掉大量額度。務必監控你的 API 用量，並在供應商後台設定預算警報。
• 效能瓶頸：外部 API 請求是網站效能的主要殺手之一。任何需要即時呼叫 AI 的功能，都要謹慎評估它對頁面載入時間的影響。非同步處理（Asynchronous）或快取是你的好朋友。
• 數據隱私：絕對、絕對不要將使用者的敏感個資（如姓名、Email、地址）傳送給第三方 AI 服務，除非你已仔細閱讀並理解其隱私條款，並獲得使用者同意。
• 過度依賴：AI 是輔助工具，不是萬靈丹。AI 生成的內容需要人工審核，AI 的分析結果需要結合你的業務知識來解讀。把它當成一個能力超強的實習生，而不是可以直接取代你的總監。

打造一個智慧化的 WordPress 官網，是一趟結合策略、創意與技術的旅程。它考驗的不只是程式能力，更是你對自身業務的理解深度。不要為了 AI 而 AI，而是要思考 AI 如何真正解決你的問題、優化你的流程、創造你的價值。

延伸閱讀

• 2026 台灣企業 AI Agent 導入指南：從 PoC 到 ROI 落地
• 突破 AI 亂講話災難！企業專屬 AI 大腦建置實戰：用 RAG 技術讓 LLM 讀懂內部機密文件
• AI 官網不是夢！WordPress 智慧化實戰：從內容個人化到營運自動化，打造你的『AI 驅動引擎』
• 客服不再崩潰！用 OpenAI Function Calling 打造能『查訂單』的 WordPress 智慧 Chatbot 實戰