0829 桃園小聚 · 9 個單元 · 56 張

從停權到 Discord。

點任一單元直接跳過去,或按 從封面開始。

0829 桃園小聚

從停權到
Discord。

一個 13 年的 Blogger 被無預警停權,
我們花一個下午把它搬進 WordPress。

OBERON LAI  ·  想點創意科技 CODOTX
Oberon Lai 大頭照
OL
avatar.jpg
講者介紹

Oberon Lai

想點創意科技 Codotx 創辦人
軟體工程師 · AI 開發顧問

2013 投入 WordPress 開發,從佈景主題到客製化網站

2021 創立想點創意科技,推出 OrderNotify for WooCommerce

2026 推出 OrderChatz AI 客服方案,開設 AI 開發顧問服務

先講結論的前提

一夜之間,全部鎖住。

13
年的累積
10,044
篇文章
0
篇還能編輯
今天要講什麼

三段路。

01
停權
申訴無門
02
重建
復刻 · 搬家 · 上線
03
交付
在 Discord 改網站
01
CHAPTER 01

停權那天

早上一封信,13 年的東西全部看不到。

系統已移除你的網誌
(Just a Girl. <br>Just Me.)
收件匣
Blogger <no-reply@blogger.com>
寄給 我 ▾
上午 1:40(11 小時前)

你好:

日前你的網誌遭人檢舉。經審查後,我們判定這個網誌違反社群規範,並已停用相關網址,讀者將無法看到這個網誌:https://www.justgirl.me

你的內容違反了我們的「惡意軟體和類似惡意內容」政策。

如果認為這項處置有誤,可以提出申訴,但必須在接下來的 90 天內提出。

收到信的當下
後台
登得進去。
帳號沒事,看起來一切正常。
文章
10,044 篇,一篇都打不開。
不能編輯、不能瀏覽、不能匯出。
前台
只剩一張禁止畫面。
讀者連得上網址,看到的是「網誌已遭移除」。
https://www.justgirl.me
很抱歉,你要找的網誌已遭移除。
Blogger · 網址已停用

13 年的讀者,
當天全部斷線。

搜尋結果還在,點進來就是這一頁。

按下申訴之後

我們已收到你的申訴。
通常 10 個工作天內會通知結果,
但部分案件可能耗時更長。

官方罐頭訊息,沒有窗口、沒有進度、沒有人可以問。

除了等,
什麼都不能做。

因為沒有人知道,資料到底救不救得回來。

02
CHAPTER 02

決定搬家

與其等一個不知道會不會來的回覆。

於是我跟業主說

不等了,
直接搬。

平台是別人的,內容才是自己的。
搬到 WordPress,之後誰都關不掉。

還好,
業主有備份。

這件事能不能救,從停權那天之前就決定了。

他一直在做的兩件事
每 週

固定匯出 XML 備份

Blogger 後台的完整備份檔,一週一份,存在自己的電腦裡。

每 天

文章原稿留在 iPad

寫作在 iPad 上完成再貼上去,所以最新的內容不只存在 Blogger。

於是問題變得很單純
01
還原 10,000 篇備份。
交給 AI 讀 XML,直接匯進 WordPress。
02
這週的新文章,手動補上。
幾篇而已,從 iPad 貼回來就好。
03
CHAPTER 03

先把樣子
復刻回來

搬家的第一步,我從設計面開始。

第一個難題

網站已經
打不開了,
怎麼照著做?

Web Archive 上的網站快照
images/wayback-snapshot.jpg
WEB ARCHIVE 快照畫面
解法

去 Web Archive
把它撈回來。

找到還活著的快照,
把每一種版型都截圖下來。

好消息是,頁面沒幾種
首頁
文章列表
分類列表
文章內頁

四種版型截好,整個站的設計就盤點完了。

我用的 AI 設計工具

Claude Design

截圖丟進去,它認得出這個網站長什麼樣子。

01

從截圖擷取
設計元素

顏色、字型、按鈕樣式一次抓出來,
整理成一套設計系統再開始設計。

Claude Design 擷取出的設計系統
images/claude-design-system.jpg
擷取出的色票 / 字型 / 元件
02

生出來的元件,
可以自己手改。

只是要改幾個字,還要回頭叫 AI 改,
反而更慢。

03

同一個區塊,
一次給你五版

舊架構撐不住新需求的地方,
讓它多做幾版,我挑。

首頁的五個版本
images/claude-design-variants.jpg
首頁 / 主選單的五個版本
除此之外

響應式自動化

手機、平板、桌機的間距與字級,照設計規範自動推算,不用手調斷點。

無障礙即時檢測

對比度、字級是否符合 WCAG,設計當下就檢查,並直接給修正建議。

設計即程式碼

元件可以直接輸出成 CSS / Tailwind / React,設計稿與成品不會走鐘。

04
CHAPTER 04

蓋一個新家

佈景主題與本機開發環境。

不挑現成的佈景主題

用自己整理過的
那一套來長。

everything-wp

github.com/oberonlai/everything-wp

而且是區塊佈景主題

因為之後
要讓業主自己改。

版型交出去以後,
他在後台就能動內容,不用回來找我。

本機環境我用

ValetPress

開機的時候 PHP、Nginx、MySQL 就已經在背景跑了,不用每次重啟。

不必每個站都養一個容器,硬碟空間省很多。

oberonlai.blog/valetpress-setup

一行指令

10 秒,
一個乾淨的站。

在 wp-content/themes 開一個空資料夾,然後
Claude Design 右上角的 Share → 輸出提示詞

用這份設計,
做成 WordPress 區塊佈景主題。

貼進 Claude Code,剩下的就是等它跑完。

05
CHAPTER 05

一萬篇
搬進來

還有兩個一定會踩到的坑。

視覺細修完之後

請它讀 8 個 XML,
自己搬進去。

8
個備份檔
10,044
篇文章
1:1
網址・分類・標籤照舊
01

那個 ?m=1

Blogger 拿它當手機版參數;
WordPress 拿它當彙整月份篩選

直接帶進來,會變成一整片 404。

舊網址(Google 上還有幾萬筆)
/2019/05/post.html?m=1

↓ 301

新網址
/2019/05/post.html

請 AI 針對這個參數另外做一條轉址規則。

02

HTML 區塊
要補註解標記

Blogger 的內容是純 HTML,
少了區塊編輯器的註解,
後台就打不開那篇文章。

<!-- wp:html -->
<div class="post">…</div>
<!-- /wp:html -->

轉換的時候就要一起處理,一萬篇不會想再跑第二次。

推上線之前,在本機先看過
01
每一種版型都開一遍。
02
文章總數對得起來。
03
舊網址點下去要到得了新文章。
06
CHAPTER 06

推上線

主機、自動部署,還有一個伏筆。

遠端主機我選

InstaWP

本來是給開發者用的 WordPress 服務,
後來也開始賣主機。

方案很便宜
測 試 用

$2 / 月

不綁正式網址,純測試站就夠用。

正 式 用

$5 / 月

可以綁自己的網址,主機額度也比較多。

01

它有 CLI,
AI 可以自己開站。

底層已經針對 WordPress 做過相容,
Agent 直接用指令開測試站、同步網站。

02

後台可以直接
開一個 MCP。

拿到一條網址,就能接上各家模型的桌面應用程式。

這條網址等一下會再出現
本機做完之後,剩下的都自動
git push
提交這次更新
GitHub Actions
測試通過才往下
自動部署測試站
InstaWP · SSH
agent-browser
實際開網頁驗收

更新完不是說「應該好了」,是真的去點一遍。

效能

CDN 是 Bunny,
最近的機房在新加坡。

台灣連過去,體感還可以。

TW SG
07
CHAPTER 07

在 Discord
改網站

交付之後,業主才是每天要用的人。

網站做完之後才是問題

業主習慣的是
Blogger 的後台。

WordPress 後台對他來說,選單太多、名詞太多。

那就
不要進後台。

改成他每天都在用的那個聊天視窗。

CODOTX 客戶專區
#公告
#justgirlMCP
#其他客戶
#閒聊
# justgirl
業主
Just a Girl
首頁最上面那句話,幫我改成「今天也要好好過」。
K
Kiro BOT
好,我看一下首頁。
instawp 讀取首頁區塊 → 找到標題
K
Kiro BOT
✔ 已更新,你重新整理看看。
社群夥伴阿竣寫的開源工具

kiro-discord-bot

Discord
業主打字的地方
Kiro CLI
亞馬遜的 AI 服務
MCP
真的去改網站

github.com/nczz/kiro-discord-bot

Discord 的好處

權限可以
切到「頻道」。

還記得 InstaWP 那條 MCP 網址嗎?
把它只掛在這個客戶的頻道上。

這個網站,只有他碰得到。

#公告 #justgirl #其他 MCP
08
CHAPTER 08

收尾

整件事,就這五步。

整個搬家過程
Claude Design
復刻既有頁面
區塊佈景主題
本機做完
AI 匯入備份
10,044 篇
InstaWP
自動部署上線
MCP × Discord
交給業主自己改

全部加起來,一個下午。

然後,
隔天早上——

Your blog titled "Just a Girl. <br>Just Me." has been reinstated
收件匣
Blogger <no-reply@blogger.com>
寄給 我 ▾
2026年8月5日 下午 9:37

Hello,

We have re-evaluated your blog against Blogger Community Guidelines. Upon review, the blog has been reinstated. You may access the blog at https://www.justgirl.me.

Sincerely,
The Blogger Team

平台可以把網站還你,
但不會把主控權還你。

下一次還會不會來,不是你能決定的。

今天提到的三個連結
everything-wp
區塊佈景主題的骨架
ValetPress
本機開發環境
kiro-discord-bot
Discord × Kiro × MCP
一對一教學

想學
AI 開發嗎?

我提供一對一客製化教學。

LINE 官方帳號
@codotx
OBERON LAI · 想點創意科技 CODOTX | 0829 桃園小聚