WLW Plugins: Code Formatter

問題與答案 (FAQ)

Q&A 類別 A: 概念理解類

A-Q1: 什麼是 Windows Live Writer（WLW）？

• A簡: WLW 是微軟推出的離線部落格編輯器，支援外掛擴充，能在本機撰寫、預覽與發佈文章。
• A詳: Windows Live Writer 是微軟推出的桌面部落格編輯工具，強調所見即所得的編輯體驗，並提供外掛（Plugins）架構擴充功能，如插入程式碼、相片、影片等。使用者可離線撰寫與預覽，完成後一鍵發佈至各大部落格平台。本文的 Code Formatter 外掛即是在 WLW 內將原始程式碼轉為具語法高亮的 HTML，以減少手動切換原始碼模式與貼入格式化內容的負擔。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q2, A-Q5, B-Q1

A-Q2: 什麼是 WLW Code Formatter 插件？

• A簡: 一款在 WLW 中將程式碼轉為語法高亮 HTML 的外掛，基於 c# code format 程式庫。
• A詳: WLW Code Formatter 是作者將 c# code format 程式庫包裝為 Windows Live Writer 外掛的作品。它在編輯器中接收原始程式碼與語言選擇，呼叫格式化程式庫生成乾淨的 HTML（以 CSS 控制樣式），並直接插入文章。它解決了手動上網轉換、切換原始碼模式貼入內容的繁瑣流程，同時避免中文亂碼，提升撰寫含程式碼文章的效率與一致性。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q4, A-Q6, B-Q1

A-Q3: 什麼是語法醒目提示（Syntax Highlighting）？

• A簡: 依語言語法為程式碼標示顏色與樣式，提升可讀性與理解效率。
• A詳: 語法醒目提示是將程式碼依語言語法元素（關鍵字、字串、註解、數字等）加上不同顏色或字型，使結構清晰、錯誤易察。它廣泛應用於 IDE、編輯器與網頁顯示。本文外掛透過 c# code format 將語法元素轉為帶有 CSS 類別的 HTML，瀏覽器再套用樣式，達成一致且乾淨的顯示效果。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q8, B-Q2, B-Q5

A-Q4: 什麼是 c# code format 程式庫？

• A簡: 一個以 C# 撰寫、將程式碼轉為 HTML 並以 CSS 樣式呈現的開源庫。
• A詳: c# code format 是 Manoli 提供的 C# 撰寫的程式碼格式化與高亮程式庫。它將輸入的程式碼語法分析後，輸出語意化的 HTML 結構（如 span 與 class），再由外部 CSS 控制顏色與樣式。優點包括純 C# 實作、輸出 HTML 乾淨、支援 Unicode、搭配既有 CSS 易於整合，是本文外掛選用的核心引擎。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: B-Q2, B-Q5, C-Q2

A-Q5: 為什麼需要在 WLW 中格式化程式碼？

• A簡: 降低手動轉換與貼入負擔，確保顯示一致、可讀性高且支援中文。
• A詳: 以往需開啟外部網站轉換、複製 HTML、在 WLW 切原始碼貼上，流程冗長、易出錯。內建外掛能直接在編輯器中完成語法高亮，輸出一致、乾淨的 HTML，並透過 CSS 控制樣式，使版面管理集中。此外，選用支援 Unicode 的庫可避免中文字元亂碼，使撰寫含中文註解或說明的程式碼文章更穩定可靠。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q6, A-Q9, B-Q1

A-Q6: 使用外部網站轉換與使用插件的差異？

• A簡: 外部轉換步驟多且分散，插件一鍵處理並直接插入，效率更高。
• A詳: 外部網站轉換需離開編輯器、貼上原始碼、轉換、再回 WLW 切原始碼貼入，步驟繁瑣且上下文切換多。插件將流程整合於 WLW 內，輸入程式碼、選語言、一鍵插入完成，並保持輸出一致性。插件也能配合部落格佈景 CSS，減少每篇文章重複調整樣式的成本，整體維護性優於外部流程。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q1, C-Q3, D-Q5

A-Q7: 為何選擇 c# code format 而非其他庫？

• A簡: 純 C#、輸出乾淨、需 CSS、支援 Unicode，顯示穩定且整合容易。
• A詳: 作者比較多套庫後選擇 c# code format，原因包括：純 C# 撰寫易於整合 WLW；輸出 HTML 乾淨不大量內嵌色碼；透過 CSS 控制樣式便於全站一致；支援 Unicode，避免中文亂碼；且其網站版已熟悉輸出格式，遷移成本低。相較之下，內嵌色碼的庫雖即時，但使 HTML 難讀難維護，長期不利。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q8, A-Q9, B-Q5

A-Q8: CSS 驅動的高亮與內嵌色碼差異？

• A簡: CSS 驅動分離樣式與內容；內嵌色碼使 HTML 冗長且難維護。
• A詳: CSS 驅動的作法是輸出語意化 HTML（以 class 標示語法元素），再由外部 CSS 控制顏色與字型，優點是結構清晰、全站一致、易於換主題。內嵌色碼則將 style 直接寫入每個字元或 span，導致標記冗長、閱讀困難、變更成本高。本文外掛選擇前者，並建議在部落格佈景加入對應 CSS。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: B-Q5, C-Q2, D-Q5

A-Q9: 什麼是 Unicode？為何避免中文亂碼？

• A簡: Unicode 是萬國碼標準，能統一編碼文字，避免中文顯示錯誤。
• A詳: Unicode 提供一個覆蓋多語種的通用編碼，常與 UTF-8 編碼型式搭配於網頁。若格式化器或輸出 HTML 未正確處理編碼，中文註解常會亂碼。c# code format 與外掛以 Unicode/UTF-8 流程處理輸入與輸出，並確保 WLW 與部落格頁面宣告一致（如 meta charset=utf-8），即可穩定顯示中文。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q6, C-Q6, D-Q1

A-Q10: 使用插件的核心價值是什麼？

• A簡: 降低手工操作、提升一致性、避免亂碼、產出可維護的乾淨 HTML。
• A詳: 核心價值包含四點：流程簡化（免切原始碼與跨工具貼上）；一致性（統一的輸出結構與色彩規則）；可靠性（採用支援 Unicode 的庫避免中文亂碼）；可維護性（CSS 分離與全站統一調整）。這些價值使含程式碼的文章產製速度更快、外觀一致且易於後續維護與主題調整。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q5, A-Q8, B-Q1

A-Q11: 為何要把 CSS 加入部落格佈景？

• A簡: 讓格式化後的 HTML 正確著色，並維持全站風格一致。
• A詳: c# code format 將語法元素標上 class，顏色來自外部 CSS。若部落格佈景未包含該 CSS，高亮將無法呈現或樣式錯亂。把 CSS 加入佈景（如 Community Server 的自訂主題）可一次性套用於所有文章，使顏色一致、維護集中；調整主題時也僅需改 CSS，不需修改舊文 HTML。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: C-Q2, D-Q2, D-Q10

A-Q12: 什麼是 Community Server 自訂主題？

• A簡: 一種部落格平台佈景機制，可在管理介面加入自訂 CSS。
• A詳: Community Server 是早期常見的社群與部落格平台，提供主題（佈景）與自訂樣式功能。管理者可在後台直接新增自訂 CSS，無需修改伺服器檔案。本文作者將 c# code format 附帶的 CSS 貼入自訂主題，即可讓全站文章自動套用程式碼高亮樣式，達到快速部署與易維護的效果。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: C-Q2, C-Q7, D-Q2

A-Q13: 何謂「乾淨的 HTML」在程式碼高亮中？

• A簡: 指語意清晰、少內嵌樣式、以 CSS 控制樣式的 HTML 結構。
• A詳: 乾淨的 HTML 在此指僅保留必要的標記（如 pre、code、span 與 class），不在每個標籤內嵌 style 或顏色值。如此可讀性高、檔案小、維護性佳；顏色調整集中於 CSS。c# code format 採此策略，與使用內嵌色碼的工具相比，更適合長期維護與主題切換，避免 HTML 膨脹與可讀性降低。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q8, B-Q5, D-Q5

A-Q14: WinForms ComboBox 的 Value 與 Display 是什麼？

• A簡: Display 顯示給使用者的文字；Value 是程式內部使用的值。
• A詳: 在 WinForms ComboBox 中，顯示層（Display）與資料值（Value）可分離。使用者看到的是 DisplayMember 對應的屬性文字，而程式取得的則是 ValueMember 對應的值。本文外掛語言選單即用 Value 如「HTML」，Display 為「HTML / XML / ASP.NET」，兼顧易讀與邏輯映射。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q15, B-Q4, C-Q4

A-Q15: ValueMember、DisplayMember 有何作用？

• A簡: 指定 ComboBox 綁定物件的顯示欄位與值欄位，用於 UI/邏輯分離。
• A詳: 設定 comboBox.DisplayMember 與 ValueMember 可讓 Items 放入任意物件（如 KeyValuePair），UI 顯示物件的某屬性（Value），而程式取得另一屬性（Key）。這種分離使介面可讀、邏輯清晰，避免以索引或字串硬編碼判斷，便於擴充與維護。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q14, B-Q4, C-Q4

A-Q16: KeyValuePair 為何適合存放選項？

• A簡: 同時承載鍵與值，便於設定 Display/Value 分離的選單項目。
• A詳: KeyValuePair<string,string> 能以 Key 存放內部識別（如語言代碼），以 Value 存放顯示文字（如完整語言名稱）。配合 ComboBox 的 ValueMember/DisplayMember，能快速以少量程式碼建立穩健的選單資料來源，直觀又不需額外類別定義，適合小型外掛中的固定選單需求。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q15, B-Q4, C-Q4

A-Q17: 語言選項（HTML/CS/VB/MSH/SQL）涵義？

• A簡: 對應常見語言：HTML/XML、C#、VB.NET、PowerShell、T‑SQL。
• A詳: 外掛內建的語言鍵值對應為：「HTML」代表 HTML/XML/ASP.NET；「CS」為 C#；「VB」為 Visual Basic .NET；「MSH」為 PowerShell；「SQL」為 T‑SQL。透過此映射，外掛能呼叫格式化庫的對應處理器，產出正確的語法高亮 HTML。可依需求擴充或調整預設語言。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q8, C-Q9, D-Q6

A-Q18: 預覽畫面與編輯畫面的不同價值？

• A簡: 編輯專注內容輸入；預覽呈現最終樣式，驗證 CSS 與排版。
• A詳: 編輯畫面提供舒適輸入與基本樣式；預覽畫面則套用部落格佈景與 CSS，接近發佈後效果。對程式碼高亮情境，預覽可檢查 CSS 是否載入、樣式是否被佈景覆蓋、段落與縮排是否正確。兩者搭配能在發佈前發現問題，減少來回修正成本。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q7, D-Q2, D-Q8

A-Q19: 為何設計器難以直接達成自訂 Value/Display？

• A簡: 設計器偏向靜態文字項目，物件綁定與屬性對應需寫程式。
• A詳: WinForms 設計器可快速建立文字型選單，但當需要物件型 Items、並以不同屬性對應顯示與值時，設計器支援有限，常需在程式中設定 DisplayMember/ValueMember 並加入物件項目。本文作者最終以數行程式達成，取代嘗試在設計器中硬湊設定的時間成本。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q15, C-Q4, B-Q4

A-Q20: 為何最後以少量程式碼初始化 ComboBox？

• A簡: 程式方式可精準控制鍵值對應與預設選取，實作快速可控。
• A詳: 用程式動態建立 KeyValuePair 清單，設定 DisplayMember/ValueMember，並指定 SelectedIndex，可一次性滿足「顯示友善、值穩定、預設合理」需求。相較在設計器找不到對應設定、或使用繞遠路的作法，直接寫少量程式更直覺、可讀、易維護。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: C-Q4, C-Q9, B-Q9

Q&A 類別 B: 技術原理類

B-Q1: WLW 插件如何插入格式化後的程式碼？

• A簡: 取得輸入與語言，呼叫庫生成 HTML，插入編輯器並依賴外部 CSS。
• A詳: 技術原理說明：外掛於對話框接收原始碼與語言選擇，呼叫 c# code format 進行語法分析與 HTML 產出。關鍵步驟或流程：1) 擷取輸入文字；2) 依語言鍵值選擇對應格式器；3) 產出含 class 的 HTML；4) 將結果插入 WLW 編輯區。核心組件介紹：UI（WinForms 對話框）、格式化引擎（c# code format）、WLW 外掛介面（插入內容）。樣式依賴部落格端的 CSS 呈現。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q2, B-Q5, C-Q3

B-Q2: c# code format 的運作機制與流程是什麼？

• A簡: 以語法分析將程式碼標記類別，輸出語意化 HTML，再由 CSS 著色。
• A詳: 技術原理說明：庫會掃描輸入字串，依關鍵字、字串、註解、識別符等分詞並建立語法標記。關鍵步驟或流程：1) Tokenize；2) 判斷語法類型；3) 用 span 與 class 包裝；4) 組裝於 pre/code 容器。核心組件介紹：各語言格式器、Token 定義、輸出器（HTML writer）。最終由外部 CSS 決定顏色與字型，保持 HTML 乾淨。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q4, A-Q8, B-Q5

B-Q3: 插件 UI 由哪些關鍵組件構成？

• A簡: WinForms 對話框、語言 ComboBox、程式碼輸入框、確認與取消按鈕。
• A詳: 技術原理說明：以 WinForms 建置輕量 UI。關鍵步驟或流程：1) 初始化 ComboBox（Value/Display 綁定）；2) 提供多行 TextBox 或 RichTextBox 接收程式碼；3) OK 觸發格式化並回傳 HTML；4) Cancel 關閉不動作。核心組件介紹：ComboBox（語言選擇）、TextBox（輸入內容）、Buttons（觸發流程）、驗證邏輯（避免空輸入）。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q14, A-Q15, C-Q3

B-Q4: DisplayMember/ValueMember 綁定的內部機制是什麼？

• A簡: Items 放入物件，透過成員名稱映射顯示欄位與值欄位。
• A詳: 技術原理說明：ComboBox 讀取 Items 中物件，反射或屬性存取指定名稱的屬性作為顯示與值。關鍵步驟或流程：1) 設定 DisplayMember=”Value”、ValueMember=”Key”；2) 加入 KeyValuePair 項；3) 選取項目時 SelectedValue 取得 Key。核心組件介紹：ComboBox 資料繫結、KeyValuePair<T1,T2>、SelectedValue/SelectedItem 屬性。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q15, C-Q4, D-Q3

B-Q5: CSS 如何與輸出的 HTML 協同工作？

• A簡: HTML 僅標示 class，實際顏色與字型由外部 CSS 全站統一控制。
• A詳: 技術原理說明：格式化器輸出 pre/code/span 並附語法類別（如 kwd、str、com）。關鍵步驟或流程：1) 於佈景載入對應 CSS；2) 預覽與前台渲染時套用類別樣式；3) 變更配色只需改 CSS。核心組件介紹：HTML class 命名、全站 CSS、佈景載入機制。此分離確保 HTML 精簡且易於更換主題與色系。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q8, C-Q2, D-Q2

B-Q6: 插件如何處理 Unicode 與中文顯示？

• A簡: 以 UTF-8 流程處理輸入輸出，避免轉碼丟失並維持字元正確。
• A詳: 技術原理說明：外掛使用 .NET 字串（UTF-16）接收內容，輸出 HTML 不改變字元，並假設 WLW 與部落格採 UTF-8。關鍵步驟或流程：1) 保留原始字元；2) 僅轉義必要符號（<, >, &）；3) 確認頁面 meta charset=utf-8。核心組件介紹：.NET 字串處理、HTML 編碼器、部落格編碼設定。此流程避免中文亂碼。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q9, C-Q6, D-Q1

B-Q7: WLW 預覽如何套用樣式以顯示高亮？

• A簡: 預覽使用佈景與 CSS 渲染，需確保對應 CSS 已被載入。
• A詳: 技術原理說明：WLW 預覽會模擬前台，載入主題的 CSS。關鍵步驟或流程：1) 在部落格端加入格式化 CSS；2) WLW 同步主題時取得樣式；3) 預覽套用類別樣式顯示顏色。核心組件介紹：WLW 預覽渲染器、部落格主題 CSS、類別命名對應。若預覽無樣式，多半是 CSS 未載入或命名衝突所致。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q11, D-Q2, D-Q8

B-Q8: 語言鍵值如何映射到格式化器？

• A簡: 以鍵值（如 CS、VB、HTML）對應不同語言處理器呼叫。
• A詳: 技術原理說明：外掛為每種語言定義鍵（Key）與顯示（Value），選擇後以 Key 決定使用的格式器。關鍵步驟或流程：1) 建立鍵值表；2) 使用 SelectedValue 取得 Key；3) switch 或映射表呼叫對應格式化方法。核心組件介紹：ComboBox、映射表、c# code format 語言處理器。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q17, C-Q9, D-Q6

B-Q9: 預設語言與 SelectedIndex 的設計考量？

• A簡: 指定 SelectedIndex 或依慣用語言選取，提高使用效率與一致性。
• A詳: 技術原理說明：初始化時設定 SelectedIndex（如 1 為 C#）或依偏好搜尋鍵值設定。關鍵步驟或流程：1) 完成 Items 綁定；2) 設定 SelectedIndex 或 SelectedValue；3) 提交時以選定 Key 執行格式化。核心組件介紹：SelectedIndex、SelectedValue、載入順序。預設合理值可減少點擊與誤用。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q20, C-Q9, D-Q6

B-Q10: 插件模組邊界與依賴關係如何設計？

• A簡: 分為 UI、格式化引擎與 WLW 插入層，彼此低耦合、清晰分工。
• A詳: 技術原理說明：三層架構最佳化維護性。關鍵步驟或流程：1) UI 收集輸入與語言；2) 引擎處理語法與 HTML；3) 插入層將結果寫入 WLW 編輯器。核心組件介紹：UI（WinForms）、引擎（c# code format）、Host API（WLW 外掛介面）。CSS 位於部落格端，不與外掛耦合，支援樣式獨立演進。
• 難度: 中級
• 學習階段: 進階
• 關聯概念: B-Q1, B-Q5, C-Q3

Q&A 類別 C: 実作應用類（10題）

C-Q1: 如何安裝 WLW Code Formatter 插件？

• A簡: 下載外掛，將 DLL 複製到 WLW 外掛資料夾，重啟 WLW 即可。
• A詳: 具體實作步驟：1) 下載壓縮檔；2) 解壓出外掛 DLL；3) 複製到 Windows Live Writer 的 Plugins 資料夾（如使用者設定路徑下的 Plugins）；4) 重啟 WLW，於插入功能檢視外掛。關鍵程式碼片段或設定：無需程式碼。注意事項與最佳實踐：確認 DLL 版本相容；若無法載入，以系統事件或 WLW 外掛清單確認；建議備份舊版本以便回退。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q1, D-Q4

C-Q2: 如何在 Community Server 加入 c# code format 的 CSS？

• A簡: 於後台自訂主題新增 CSS，貼上庫提供的樣式並儲存套用。
• A詳: 具體實作步驟：1) 登入部落格後台；2) 開啟主題/外觀設定；3) 找到「自訂 CSS」或「自訂樣式」區域；4) 貼上 c# code format 提供的 CSS 類別（如 .kwd、.str、.com 等）；5) 儲存並重新整理。關鍵程式碼片段或設定：例如 .kwd{color:#00f;} .str{color:#a31515;}。注意事項與最佳實踐：避免與現有類別衝突；命名一律沿用庫的預設，方便升級與維護。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q11, B-Q5, D-Q2

C-Q3: 如何使用插件貼上並格式化一段 C# 程式？

• A簡: 貼上原始碼，選 C# 語言，按 OK 插入，高亮由佈景 CSS 呈現。
• A詳: 具體實作步驟：1) 複製原始 C# 程式碼；2) 於 WLW 開啟外掛；3) 貼到輸入框；4) 語言選「C#」；5) 預覽確認；6) 按 OK 插入文章。關鍵程式碼片段或設定：無需手寫程式碼。注意事項與最佳實踐：先確保部落格已載入對應 CSS；保留縮排與空白；發佈前於預覽檢查長行換行與行高是否合適。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q1, B-Q7, D-Q7

C-Q4: 如何用程式設定 ComboBox 的顯示與值？

• A簡: 設 DisplayMember/ValueMember，加入 KeyValuePair，指定 SelectedIndex。
• A詳: 具體實作步驟：1) 設 comboBox.DisplayMember=”Value”；2) 設 comboBox.ValueMember=”Key”；3) 加入項目：Items.Add(new KeyValuePair<string,string>(“HTML”,”HTML / XML / ASP.NET”))；4) 設定 comboBox.SelectedIndex=1。關鍵程式碼片段或設定：如上四行。注意事項與最佳實踐：確保泛型型別一致；以鍵值驅動邏輯；避免硬編碼索引，亦可用 SelectedValue 指定預設。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q15, B-Q4, B-Q9

C-Q5: 如何自訂程式碼高亮的顏色主題？

• A簡: 修改或覆寫 CSS 類別色彩與字型，即可全站變更樣式。
• A詳: 具體實作步驟：1) 找出庫使用的 CSS 類別；2) 在佈景的自訂 CSS 覆寫顏色；3) 儲存並預覽；4) 覆核可讀性。關鍵程式碼片段或設定：例如 .kwd{color:#007acc;font-weight:bold;} .com{color:#6a9955;font-style:italic;}。注意事項與最佳實踐：確保對比足夠、避免過度粗體；用變數化或註解標出自訂區塊，方便維護。
• 難度: 中級
• 學習階段: 進階
• 關聯概念: B-Q5, D-Q8, D-Q10

C-Q6: 如何確保中文與特殊字元正常顯示？

• A簡: 全流程統一 UTF-8，轉義特殊符號，確認頁面與 WLW 設定。
• A詳: 具體實作步驟：1) 確認部落格頁面 meta charset=utf-8；2) WLW 設定使用 UTF-8 發佈；3) 外掛保持原字元，僅轉義 <、>、&；4) 預覽檢查中文註解。關鍵程式碼片段或設定：HTML 中使用 <、>、&。注意事項與最佳實踐：避免混用多種編碼；RSS 亦須為 UTF-8；必要時於頁首再次宣告編碼。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q9, B-Q6, D-Q1

C-Q7: 如何不改伺服器檔案也能加 CSS？

• A簡: 利用部落格平台後台的自訂 CSS 功能，直接貼入並套用。
• A詳: 具體實作步驟：1) 登入後台；2) 找到自訂樣式或額外 CSS 欄位；3) 貼上 c# code format CSS；4) 儲存並測試。關鍵程式碼片段或設定：不需修改主題檔案，只在後台新增。注意事項與最佳實踐：保留原 CSS 備份；以註解標示新增區塊；測試多篇含程式碼文章以確認兼容性。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q12, C-Q2, D-Q2

C-Q8: 如何從原始程式庫建置外掛？

• A簡: 下載庫原始碼，新建 WLW 外掛專案，參考庫，實作插入流程。
• A詳: 具體實作步驟：1) 下載 c# code format 原始碼；2) 建立 .NET 專案（WLW 外掛樣板或 Class Library）；3) 參考該庫；4) 建 UI（語言選單、輸入框）；5) 呼叫格式器輸出 HTML；6) 以 WLW API 插入內容；7) 編譯產生 DLL。關鍵程式碼片段或設定：語言鍵值映射與插入點。注意事項與最佳實踐：分離 UI/引擎/Host；記錄相依版本；撰寫最小錯誤處理。
• 難度: 高級
• 學習階段: 進階
• 關聯概念: B-Q1, B-Q10, C-Q1

C-Q9: 如何將預設語言設定為 C#？

• A簡: 載入後指定 SelectedValue 為 “CS”，或設定 SelectedIndex 對應項。
• A詳: 具體實作步驟：1) 完成 Items 加入；2) 以 comboBox.SelectedValue=”CS” 指定；或 3) 若順序固定，以 comboBox.SelectedIndex=1。關鍵程式碼片段或設定：SelectedValue 優於硬編碼索引。注意事項與最佳實踐：確保鍵值存在；初始化順序正確；避免在資料繫結尚未完成前設定導致失效。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: B-Q9, A-Q17, D-Q6

C-Q10: 如何更新外掛而不影響既有文章顯示？

• A簡: 保持輸出 HTML 與 CSS 類別相容，先行併行測試再替換。
• A詳: 具體實作步驟：1) 於測試環境安裝新版本；2) 確認輸出 HTML 結構與 class 名稱不變；3) 若新增類別，補齊 CSS；4) 逐步佈署至正式環境。關鍵程式碼片段或設定：無。注意事項與最佳實踐：不可更動既有 class 命名；若需改版，提供兼容層或 CSS 別名；備份舊 DLL 以便回復。
• 難度: 中級
• 學習階段: 進階
• 關聯概念: B-Q5, D-Q10, C-Q1

Q&A 類別 D: 問題解決類（10題）

D-Q1: 貼上後中文亂碼怎麼辦？

• A簡: 檢查頁面與 WLW 皆為 UTF-8、外掛輸出有正確轉義與未改編碼。
• A詳: 問題症狀描述：中文註解成問號或亂碼。可能原因分析：頁面未設 UTF-8、WLW 發佈編碼不一致、轉義錯誤。解決步驟：1) 確認部落格 meta charset=utf-8；2) WLW 設為 UTF-8；3) 外掛僅轉義 < > &；4) 重新預覽與發佈。預防措施：全站統一 UTF-8；避免手改 HTML 編碼宣告；RSS 亦使用 UTF-8。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: A-Q9, B-Q6, C-Q6

D-Q2: 預覽有高亮，發佈後沒有樣式怎麼辦？

• A簡: 檢查佈景是否包含格式化 CSS、是否被其他樣式覆蓋或未載入。
• A詳: 問題症狀描述：本機預覽正常，線上無著色。可能原因分析：正式佈景未含 CSS、CDN/快取未更新、選擇器優先級被覆蓋。解決步驟：1) 確認線上佈景含對應 CSS；2) 清快取；3) 提高選擇器權重或加上更具體選擇器。預防措施：佈署流程涵蓋 CSS；建立檢查清單；使用版本化資源避免快取舊檔。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: B-Q5, C-Q2, D-Q8

D-Q3: 選單顯示「型別名稱」而非文字怎麼辦？

• A簡: 未設定 DisplayMember/ValueMember，請正確指定並使用 KeyValuePair。
• A詳: 問題症狀描述：ComboBox 項目顯示「System.Collections.Generic…」。可能原因分析：Items 加入物件但未設定 DisplayMember。解決步驟：1) 設 DisplayMember=”Value”；2) 設 ValueMember=”Key”；3) 重新加入 KeyValuePair 項；4) 測試 SelectedValue。預防措施：初始化即設定成員；封裝建立選單的輔助方法避免遺漏。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q4, C-Q4, A-Q15

D-Q4: 外掛按鈕不見或無法載入怎麼辦？

• A簡: 檢查 DLL 路徑與版本相容性，重啟 WLW，查看外掛清單與日誌。
• A詳: 問題症狀描述：外掛不顯示或無法啟用。可能原因分析：DLL 不在 Plugins 目錄、版本不相容、權限不足。解決步驟：1) 確認 DLL 置於正確資料夾；2) 以相容的 .NET 與 WLW 版本；3) 重啟 WLW；4) 檢視外掛管理或事件記錄。預防措施：保留版本相容矩陣；升級時先測試；確保讀取權限。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: C-Q1, B-Q10

D-Q5: 格式化後的 HTML 太冗長怎麼辦？

• A簡: 避免使用內嵌色碼工具，改用 CSS 驅動輸出，保持 HTML 精簡。
• A詳: 問題症狀描述：HTML 充滿 style 屬性或顏色碼。可能原因分析：使用的格式器內嵌樣式。解決步驟：1) 改用 c# code format 等輸出 class 的庫；2) 將樣式移至 CSS；3) 清理舊文可視需要重新格式化。預防措施：建立統一工具鏈；在導入前確認輸出策略；寫作指南明訂禁用內嵌色碼。
• 難度: 初級
• 學習階段: 核心
• 關聯概念: A-Q8, A-Q13, B-Q5

D-Q6: 遇到不支援的語言該怎麼處理？

• A簡: 使用最接近的格式器或暫以純文字呈現，並標註語言待擴充。
• A詳: 問題症狀描述：語言不在選單或高亮錯誤。可能原因分析：外掛或庫未實作該語言。解決步驟：1) 選用接近語法者（如 C 類）或「HTML」；2) 以 pre/code 不加色呈現；3) 規劃擴充映射表與 CSS。預防措施：盤點常用語言；先行測試支援度；以鍵值可擴充設計保留增補空間。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q17, B-Q8, C-Q9

D-Q7: SQL 或 PowerShell 貼上後縮排錯亂怎麼辦？

• A簡: 確保使用 pre 保留空白，調整 CSS 的 white-space 與字型設定。
• A詳: 問題症狀描述：縮排丟失或對齊不一。可能原因分析：HTML 未用 pre/code；CSS 未設 white-space: pre 或 mono 字型。解決步驟：1) 確認輸出以 pre/code 包裹；2) CSS 設 pre{white-space:pre;}；3) 使用等寬字型；4) 檢查貼上時空白未被壓縮。預防措施：外掛強制輸出 pre；佈景固定等寬字型與行高。
• 難度: 初級
• 學習階段: 基礎
• 關聯概念: B-Q2, B-Q5, C-Q3

D-Q8: 佈景主題覆蓋或干擾程式碼樣式怎麼辦？

• A簡: 提升 CSS 選擇器優先度或局部命名空間，避免樣式被覆蓋。
• A詳: 問題症狀描述：顏色或字型被主題改變。可能原因分析：主題 CSS 優先級較高或通用選擇器干擾。解決步驟：1) 以更具體選擇器如 .post pre .kwd；2) 必要時加 !important（謹慎）；3) 為程式碼區塊加外層類別命名空間。預防措施：在主題整合期測試衝突；遵循命名慣例減少碰撞。
• 難度: 中級
• 學習階段: 進階
• 關聯概念: B-Q5, C-Q5, D-Q2

D-Q9: RSS 閱讀器顯示沒有高亮怎麼辦？

• A簡: RSS 通常不載 CSS，可內嵌少量必要樣式或保留純文字。
• A詳: 問題症狀描述：RSS 中程式碼無色或亂版。可能原因分析：RSS 閱讀器不加載站點 CSS。解決步驟：1) 在內容中內嵌少量關鍵樣式（權衡體積）；2) 提供「到網站閱讀」連結；3) 確保 pre 保留縮排。預防措施：規劃 RSS 友善樣式；控制內嵌 CSS 體積；避免過度依賴顏色傳達語意。
• 難度: 中級
• 學習階段: 核心
• 關聯概念: A-Q11, B-Q5, D-Q7

D-Q10: 換佈景後舊文章高亮失效怎麼辦？

• A簡: 維持 class 命名相容，補齊新主題 CSS，避免破壞舊文。
• A詳: 問題症狀描述：套新主題後顏色消失。可能原因分析：新主題未含格式化 CSS 或 class 命名不匹配。解決步驟：1) 將 c# code format 的 CSS 併入新主題；2) 檢視 class 名稱是否一致；3) 提供兼容別名。預防措施：制定樣式相容策略；升級外掛時不變更輸出結構；佈署前以舊文回歸測試。
• 難度: 初級
• 學習階段: 進階
• 關聯概念: C-Q10, B-Q5, A-Q11

學習路徑索引

• 初學者：建議先學習哪 15 題
  • A-Q1: 什麼是 Windows Live Writer（WLW）？
  • A-Q2: 什麼是 WLW Code Formatter 插件？
  • A-Q3: 什麼是語法醒目提示（Syntax Highlighting）？
  • A-Q5: 為什麼需要在 WLW 中格式化程式碼？
  • A-Q6: 使用外部網站轉換與使用插件的差異？
  • A-Q8: CSS 驅動的高亮與內嵌色碼差異？
  • A-Q9: 什麼是 Unicode？為何避免中文亂碼？
  • A-Q11: 為何要把 CSS 加入部落格佈景？
  • A-Q14: WinForms ComboBox 的 Value 與 Display 是什麼？
  • A-Q15: ValueMember、DisplayMember 有何作用？
  • A-Q16: KeyValuePair 為何適合存放選項？
  • A-Q17: 語言選項（HTML/CS/VB/MSH/SQL）涵義？
  • B-Q1: WLW 插件如何插入格式化後的程式碼？
  • C-Q1: 如何安裝 WLW Code Formatter 插件？
  • C-Q3: 如何使用插件貼上並格式化一段 C# 程式？
• 中級者：建議學習哪 20 題
  • A-Q4: 什麼是 c# code format 程式庫？
  • A-Q7: 為何選擇 c# code format 而非其他庫？
  • A-Q10: 使用插件的核心價值是什麼？
  • A-Q12: 什麼是 Community Server 自訂主題？
  • A-Q13: 何謂「乾淨的 HTML」在程式碼高亮中？
  • A-Q18: 預覽畫面與編輯畫面的不同價值？
  • A-Q19: 為何設計器難以直接達成自訂 Value/Display？
  • A-Q20: 為何最後以少量程式碼初始化 ComboBox？
  • B-Q2: c# code format 的運作機制與流程是什麼？
  • B-Q3: 插件 UI 由哪些關鍵組件構成？
  • B-Q4: DisplayMember/ValueMember 綁定的內部機制是什麼？
  • B-Q5: CSS 如何與輸出的 HTML 協同工作？
  • B-Q6: 插件如何處理 Unicode 與中文顯示？
  • B-Q7: WLW 預覽如何套用樣式以顯示高亮？
  • B-Q8: 語言鍵值如何映射到格式化器？
  • C-Q2: 如何在 Community Server 加入 c# code format 的 CSS？
  • C-Q4: 如何用程式設定 ComboBox 的顯示與值？
  • C-Q6: 如何確保中文與特殊字元正常顯示？
  • D-Q2: 預覽有高亮，發佈後沒有樣式怎麼辦？
  • D-Q5: 格式化後的 HTML 太冗長怎麼辦？
• 高級者：建議關注哪 15 題
  • B-Q9: 預設語言與 SelectedIndex 的設計考量？
  • B-Q10: 插件模組邊界與依賴關係如何設計？
  • C-Q5: 如何自訂程式碼高亮的顏色主題？
  • C-Q7: 如何不改伺服器檔案也能加 CSS？
  • C-Q8: 如何從原始程式庫建置外掛？
  • C-Q9: 如何將預設語言設定為 C#？
  • C-Q10: 如何更新外掛而不影響既有文章顯示？
  • D-Q1: 貼上後中文亂碼怎麼辦？
  • D-Q3: 選單顯示「型別名稱」而非文字怎麼辦？
  • D-Q4: 外掛按鈕不見或無法載入怎麼辦？
  • D-Q6: 遇到不支援的語言該怎麼處理？
  • D-Q7: SQL 或 PowerShell 貼上後縮排錯亂怎麼辦？
  • D-Q8: 佈景主題覆蓋或干擾程式碼樣式怎麼辦？
  • D-Q9: RSS 閱讀器顯示沒有高亮怎麼辦？
  • D-Q10: 換佈景後舊文章高亮失效怎麼辦？