竄改猴 + blogger html 模式下，讓google blogger 的html 變成可即時預覽，經驗筆記
Tampermonkey UserScript · 免費開源
不用反覆切換頁面
邊寫邊看 Blogger HTML 即時成果
即時預覽視窗浮於編輯器旁，拖拉縮放隨意控制
不切換頁面，所見即所得。
0
頁面切換次數
1 秒
HTML 同步間隔
100%
免費開源
為什麼需要這個工具？
身為一個常在 Google Blogger 寫技術筆記的開發者，
我想要在編輯 HTML 時即時看到渲染結果，
以便我能快速調整排版，省去在「撰寫」與「預覽」之間反覆切換的時間。
我想要在編輯 HTML 時即時看到渲染結果，
以便我能快速調整排版，省去在「撰寫」與「預覽」之間反覆切換的時間。
- ✓ 在 Blogger 編輯器旁自動出現可拖拉的即時預覽視窗，不須離開編輯頁面
- ✓ HTML 內容有任何變動，預覽視窗在 1 秒內自動同步更新
- ✓ 預覽視窗可自由縮放、最小化，不干擾正常的 Blogger 編輯工作流程
你是否也有這些困擾？
反覆切換頁面超累
Blogger 預覽要另開分頁或切換模式，HTML 貼進去對不對只能一直來回確認，效率極差。
排版靠猜，發佈才踩坑
Blogger 主題 CSS 會悄悄蓋掉自訂樣式，沒有即時預覽根本不知道哪個 class 失效了。
AI 產完還要反覆微調
AI 生成的 Blogger HTML 需要多輪調整，沒有即時預覽就是在做無意義的盲目猜謎。
安裝前 vs 安裝後
三步驟馬上上手
1
安裝 Tampermonkey
在 Chrome 或 Firefox 安裝 Tampermonkey 擴充功能（免費），這是執行 UserScript 的基礎。
2
新增腳本並貼入程式碼
開啟 Tampermonkey → 新增腳本，將本文附上的完整程式碼貼入後儲存。
3
進入 Blogger 文章編輯頁
打開任意 Blogger 文章編輯頁面（URL 含 /post/edit/），即時預覽視窗會自動出現。
4
切換 HTML 模式開始預覽
在編輯器切換到 HTML 模式後貼入或修改內容，右側浮窗即時同步渲染，所見即所得。
立刻告別來回切換的痛苦
複製程式碼，貼入 Tampermonkey，一分鐘完成安裝。
留言
張貼留言