Claude Code x 部落格架設(六):多人共同管理的 Astro WordPress 方案
AI 文章延伸
選擇平台後可直接帶入閱讀脈絡,快速整理重點、補齊盲點,並延伸到同站相關文章。
系列寫到第五篇,我們已經把部落格從零架起來、部署上線、設定好 SEO,甚至用 Skills 自動健檢。但有一個問題一直沒解決——寫文章還是得回到自己的電腦,打開終端機,改 Markdown,再推到 GitHub。
這個流程在一個人的時候沒問題,但下面這三個情境一出現,整件事就卡住了:
- 出差在外,手邊只有一台沒裝開發環境的筆電,客戶突然要你更新一篇文章
- 部落格內容變多,想把上稿的工作交給行銷同事,但他看到終端機就頭痛
- 部落格長成企業形象網站,老闆、業務、PM 都想進來貼公告或改文案
這三個情境的共通點是:內容創作的門檻被技術工具卡住。Astro 本身是開發者友善的靜態網站產生器,它假設每個使用者都會用終端機、會 git push、看得懂 Markdown 語法。但部落格的本質是「寫內容」,不是「寫程式」。當協作對象擴大到非工程師,或使用情境脫離了自己那台裝滿開發工具的電腦,Astro 缺一個「後台」——一個用瀏覽器就能打開、懂繁體中文排版、支援多人帳號、有圖片上傳介面的編輯器。
為了解決這件事,這次我們開發了一個 Astro 套件,叫做 astro-wp,把 WordPress 變成 Astro 部落格的後台編輯介面。寫文章回到熟悉的 WordPress 編輯器,文章來源混用本機 Markdown 和 WordPress,前端還是那個又快又安全的 Astro 靜態站。
為什麼是 WordPress,不是其他 headless CMS?
這個問題我們想了很久。Strapi、Sanity、Contentful、Payload⋯⋯可以選的 headless CMS 一大堆。最後選 WordPress 有三個原因:
1. 編輯器是世界上最多人會用的那一個
台灣至少有一半以上的內容編輯碰過 WordPress,學習成本趨近於零。你不需要開一次教學會議告訴同事「這個欄位怎麼填」。
2. 有 WordPress Playground
這是 WordPress 官方用 WebAssembly 做的新專案,讓 WordPress 可以直接跑在瀏覽器或 Node.js 裡,用 SQLite 取代 MySQL。沒有 Docker、沒有資料庫安裝、沒有 PHP 環境,安裝起來非常快速。
3. 沒有人頭月費、沒有廠商鎖死
Sanity、Contentful 這類雲端 headless CMS,編輯帳號多一個就多收一份錢,流量多了也得升級方案。WordPress 是免費開源軟體,你要開幾個編輯帳號就開幾個,內容也完全放在自己家裡。哪天想搬走、想改結構、想接自己的外掛,都沒有人攔你。對企業形象網站或長期經營的部落格來說,這份「自主權」比便宜的月費更重要。
astro-wp 做了什麼?
用一張圖解釋整個架構:
兩個來源的內容最後會合成同一個部落格。想像你的部落格是一本雜誌,原本文章都是你自己手寫進去的。現在多了一個編輯助理(WordPress),你手寫的稿子還是照樣放,助理打字的稿子也會被收進來,排版出來看起來是同一本雜誌,讀者根本分不出哪篇誰寫的。
整個過程的角色分工是這樣:
- WordPress 只負責「寫稿」——給你和同事一個熟悉的編輯介面、圖片上傳、排版工具
- Astro 負責「出版」——把所有文章(不管是 WordPress 寫的還是 Markdown 寫的)編排成最終的網頁
- 合併的動作 在網站重新生成的時候發生,一次把兩邊的內容都抓齊,產出一份完整的部落格
讀者打開網站看到的還是那個又快又安全的 Astro 靜態站,速度、SEO 通通沒犧牲。WordPress 藏在幕後,只是你們寫稿的工具間——而且這個工具間直接架在你自己的電腦上,不用租主機、不用付月費、不用每週盯著 WordPress 安全更新,也不怕哪天主機商漲價或倒閉。文章資料、圖片、分類設定全部留在自己的硬碟裡,備份跟搬家都是複製資料夾的事。
最麻煩的問題:同事怎麼連到你電腦上的 WordPress?
這是整個方案最關鍵的一步。WordPress 跑在你自己的電腦上,同事在台北分公司的電腦要怎麼打開?
想像你家裡的 Wi-Fi 只有家人能用,外面的朋友要用怎麼辦?你得拉一條線出來。Cloudflare 就是幫你拉這條線的服務商,而且免費。astro-wp 已經把這整段設定包好了,你只要跟 Claude Code 說「讓同事從外面連到我的 WordPress」,它會問你兩個問題:
你有自己的網域嗎?
- 有。 告訴它一個子網域,例如
wp.你的公司.com。它會幫你把這個網址跟你的筆電綁在一起,以後每次啟動都是同一個網址,同事存成書籤就能用。 - 沒有。 系統會給你一個長得像
隨機字串.trycloudflare.com的臨時網址。每次重新啟動網址會變,適合臨時給客戶看一下 demo,不適合給同事長期用。
同事那邊看到的就是一個正常的網站登入頁面,輸入帳號密碼進去就是完整的 WordPress 後台。他完全不需要知道這個網站實際上跑在誰的筆電上。你也不用去動家用路由器、不用設定防火牆、不用付 VPN 的錢。
如果你想用永久網址,網域大概一年 10 美金,相對於多人協作帶來的方便,這筆錢很值得。
實際安裝:還是讓 Claude Code 做
跟系列前幾篇一樣,你不需要自己敲指令。在部落格專案資料夾打開 Claude Code,跟它說:
幫我安裝 astro-wp,把 WordPress 當成 headless CMS
專案網址:https://github.com/oberonlai/astro-wp
它會去讀那個專案的 README,然後照著下面幾件事一路做完:
- 先看看你的部落格長什麼樣。 Claude Code 會先打開你的專案,確認文章資料夾叫什麼、分類規則是怎麼設計的。每個人的部落格架構都不太一樣,它得先摸清楚才不會弄壞你既有的內容
- 把 astro-wp 這套工具搬進你的專案。 這一步就是一個安裝指令,執行下去之後,該有的檔案、該連的管線、該裝的 WordPress 外掛會自動放到正確的位置。你不用自己搬任何一個檔案
- 告訴你的部落格「以後多一個內容來源」。 原本部落格只認你寫的 Markdown 檔案,這一步會讓它同時也認 WordPress 寫出來的文章,兩邊一起顯示在網站上
- 把列表頁、分類頁、文章頁改好。 首頁的文章列表、點分類的篩選頁、點單篇進去的內容頁,原本只會列出 Markdown 的文章,現在要讓 WordPress 的文章也出現。Claude Code 會幫你改好,讀者打開網站會看到兩邊的文章混在一起按時間排
- 啟動 WordPress 並幫你開好帳號。 跑最後一個指令,你電腦裡就會有一個 WordPress 跑起來,登入帳號、跟 Astro 對接用的連線密碼、必要的外掛,全部自動設定好。你打開瀏覽器就是完整的 WordPress 後台,可以直接開始寫文章
整個流程我們在一個乾淨的最新版 Astro 專案上實測過,Claude Code 大約 5 到 7 分鐘跑完,中間沒有需要人工介入的步驟。
安裝結束之後,記得另外開一個終端機視窗執行 npm run dev。這一步會同時啟動本機的 Astro 前端和 WordPress 後台,這兩個程式要跑起來,瀏覽器才能打開 http://127.0.0.1:8888/wp-admin 看到 WordPress 後台、打開 http://localhost:4321 看到你的部落格。平常要上稿、改內容的時候,這個視窗都得保持開著,闔上終端機就等於把整個服務關掉了。
開發時的即時預覽
一個細節值得講:你在 WordPress 按下「儲存」之後,部落格網站怎麼知道你剛剛改了內容?
astro-wp 用了一個很簡單的做法:讓你的部落格每三秒偷偷問一次「WordPress 那邊有沒有新東西?」一旦發現有,就自動重新整理頁面,把新內容抓進來。
要注意的是,這個預覽只有本機開發者看得到。遠端同事在 WordPress 後台存檔之後,自己那邊是看不到 Astro 前台的最新樣貌的——他們要看實際成果,得等文章正式發布上線。所以在多人協作的情境下,同事寫作時主要靠 WordPress 後台的編輯器預覽排版,正式成品要等發布後才會出現在網站上。
發布流程:文章在自己電腦上打包,再送上網路
系列前面幾篇有介紹過,平常 Astro 部落格的發布流程是這樣:你把文章推到 GitHub,Cloudflare 那邊自己會重新生成網站。這套流程在這裡行不通——因為 WordPress 跑在你自己的電腦上,Cloudflare 的伺服器在天邊,它連不進你家來抓文章。
astro-wp 換了一個做法:發布的動作改在你自己的電腦上完成,做完之後再把成品丟上網路。
實際的流程是這樣:
- 同事在遠端 WordPress 後台按下「發布」
- 訊息送回你的筆電
- 你的筆電自動把網站重新生成一份最新版本
- 再把這份最新的網站上傳到 Cloudflare,全世界的讀者就能看到
整個過程你不用盯著螢幕,只要事先把這個自動發布的服務啟動起來,讓它在背景待命就好。
這是這套方案最明顯的限制——必須有一台電腦開著。對個人部落格來說是缺點,但對小團隊來說影響不大,反正那台電腦就是你自己的工作機,開一整天本來就開著。
如果團隊規模稍大、不希望「網站活著與否」跟某一個人的筆電綁在一起,有幾個漸進的做法可以選:
- 找一台公司內部的備用電腦專門跑 WordPress。 放辦公室角落、接著電源、網路穩定就好,打開之後就讓它一直開著。成本只有電費,同事上班時間都能上稿,維護也簡單
- **如果真的需要 24 小時不間斷發布、同事分散各時區,**再把 WordPress 搬到雲端主機。astro-wp 的架構可以無痛切換,設定檔改一行網址就好
適合跟不適合的情境
講完了優點,也要誠實說限制。這個方案適合這些人:
- 已經用 Astro 做部落格,想讓非工程師同事進來上稿
- 希望內容管理有熟悉的 WordPress 介面,但不想維護 WordPress 主機
- 個人使用者需要在沒有開發環境的電腦上臨時改文章(用遠端 Tunnel 連回自己的筆電)
- 企業形象網站,讓行銷、業務、PM 各自管自己那塊內容
不適合的情境:
- 需要 24 小時自動發布,身邊沒有隨時開機的電腦
- 依賴少數很吃資料庫底層的 WordPress 外掛(大部分常用外掛都沒問題,真的遇到不相容的情況再評估替代方案就好)
- 單純一個人寫部落格,沒有協作需求——這種情境下直接寫 Markdown 反而最快
下一步
安裝完成之後,WordPress 後台和 Markdown 檔案並存。你可以:
- 繼續用 Claude Code 寫 Markdown 發表技術文
- 請同事用 WordPress 寫公關稿、新聞稿、產品說明
- 兩種來源最後都出現在同一個 Astro 前端,讀者看不出差別
之後如果想把 Astro 的頁面內容(像是首頁 banner、公司介紹、服務說明這些原本寫死在程式碼裡的文案)也搬進 WordPress 後台讓同事自己改,可以請 AI 幫你在 WordPress 建好對應的欄位、串接好相關的 API,讓 Astro 前端從 WordPress 撈資料顯示。
或是如果 WordPress 裝了一些外掛(例如文章瀏覽次數計數器、圖片輪播、熱門文章排行等 UI 相關的功能),想把這些外掛產生的內容顯示在 Astro 前台,同樣可以請 AI 協助處理橋接。等於你的靜態網站會逐步長出越來越多「可以給非工程師管理」的區塊,整個網站的內容自主權都握在內容團隊手上。
不過有一種情境要提醒一下:如果你想把購物系統(像是 WooCommerce)接上來,這部分會牽涉到金流、訂單、會員資料這些比較複雜的安全性問題,建議還是找專業團隊來處理會比較適合,不要單純靠 AI 自己兜。
到這裡,「Claude Code x 部落格架設」系列六篇就走完了:從概念、安裝、部署、SEO、健檢,到多人協作。整套工具鏈的門檻一層一層降下來,不懂程式也能把部落格跑起來,不用技術團隊也可以把後台的管理系統補上。
延伸思考
這個方案的優勢建立在幾個前提上,值得提醒自己:
- 假設工作機作息穩定。 個人開發者 + 單時區小團隊運作良好,但分散時區或需要深夜上稿的組織會立刻撞上「電腦沒開就進不來」的牆,這時該往雲端主機搬
- 假設編輯者「熟悉 WordPress」。 對習慣 Notion、Google Docs 這類文件工具的新一代編輯者,WordPress 的後台未必比較直覺。選 CMS 前先問一句「同事平常習慣用什麼工具」,比選最強大的編輯器更重要
換個角度看,這套「前台自己選技術、後台讓同事用熟悉工具」的分工有很多跨域類比:
- 鐘擺擺回來了。 近年 Basecamp 從 AWS 搬回自家機房,論點跟這套方案幾乎一樣:省成本、可控、資料自主。雲端不是唯一解,只是某個時期的主流解
- 像餐廳外場與廚房。 Astro 是客人看到的外場,WordPress 是廚房。客人不會走進廚房看設備,所以廚房用什麼工具都行,重點是出菜快又好
關鍵概念:Headless CMS 架構模式、內容自主權 vs 託管便利、本機 Headless CMS 部署流程
常見問題
已經有在跑的 Astro 部落格,能中途接上 astro-wp 嗎?
可以。安裝的時候它會先看你原本的部落格怎麼放文章、分類怎麼設,然後把 WordPress 當成「新增的寫稿管道」接進來,不會動到你原本寫好的文章。你手寫的 Markdown 繼續放著,同事從 WordPress 上稿的文章也會一起顯示在網站上,兩邊互不干擾。
這個 WordPress 跟一般的 WordPress 有什麼不一樣?
用起來幾乎一模一樣——後台介面、寫文章的方式、裝外掛、換主題,都跟你熟悉的 WordPress 沒兩樣。唯一的差別是它用一個更輕巧的資料庫,所以不用另外安裝資料庫軟體,打開就能跑。大部分常用外掛(像 Yoast SEO、ACF)實測都能用,只有極少數特別「吃資料庫」的外掛可能會怪怪的。
遠端同事要怎麼連到我電腦上的 WordPress?
跟 Claude Code 說「讓同事從外面連到我的 WordPress」,它會幫你處理。如果你有自己的網域,可以指定一個固定網址(例如 wp.你的公司.com)給同事長期用;如果沒有,也可以臨時產生一個隨機網址先給人看。同事那邊打開那個網址就是一個正常的 WordPress 登入頁面,根本不用知道這個網站其實跑在你的筆電裡。
如果我的電腦沒開,同事能正常上稿嗎?
不行。因為 WordPress 本身就跑在你的電腦上,電腦沒開的時候 WordPress 也等於關機,同事那邊打開網址只會看到連線失敗,沒辦法登入、也沒辦法寫稿。所以實際運作上,你的工作機就是整個 WordPress 後台的開關——你開機它就能用,你闔上它就關閉。對大多數小團隊來說這不是問題,因為你上班時同事也在上班;但如果你的團隊分散在不同時區,或同事常常半夜寫稿,那還是建議把 WordPress 搬到雲端主機 24 小時運作,設定檔改一個網址就能切換。
有想把 Astro 部落格變成多人協作的 CMS,或是在企業形象網站上遇到類似的情境?歡迎聯絡我們,或加入我們的 LINE 官方帳號聊聊你的專案。