水平分隔線或稱為分隔符號是基礎的 WordPress 文章和頁面組成元素，能夠協助你輕輕分割長篇的內容和版面。清晰和分明的內容結構，可以減少讀者的跳出率，更加可以提供良好的用戶體驗。在文章編輯器中新增「分隔符號」是新手可以輕易辦到的事情，一般 WordPress 用家還可以配上 區塊編輯器 裡的 空白間隔區塊 功能，讓整體的版面清新和舒服。

如何新增分隔符號 Separator Block (方法一)？

如何新增分隔符號 Separator Block (方法一)？
如何新增分隔符號 Separator Block (方法一)？

步驟一：

在新段落區塊中輸入 /分隔符號並按下 Enter 鍵，以快速新增分隔符號區塊。

步驟二：

點擊「分隔符號」區塊即可。

如何新增分隔符號 Separator Block (方法二)？

如何新增分隔符號 Separator Block (方法二)？
如何新增分隔符號 Separator Block (方法二)？

步驟一：

在右下方點擊 [+] 符號。

步驟二：

在彈出視窗裡的輸入欄位，輸入「分隔符號」字串。

步驟三：

發現「分隔符號」區塊，請按圖示即可。

分隔符號區塊標準外觀

分隔符號區塊標準外觀
分隔符號區塊標準外觀

相較其他區塊編輯器的區塊，分隔線算是比較單純的功用，如果發現看似沒有什麼可以調整實屬正常的現象。在 WordPress 裡每個區塊都有其區塊專用控制項，可讓你在編輯器中直接操作區塊。分隔符號區塊操作設計相當簡單，只有轉換區塊類型、變更標題對齊方式和更多選項控制項。

變更標題對齊方式 (Align Options)

變更標題對齊方式 (Align Options)
變更標題對齊方式 (Align Options)

由於分隔線是常用的網頁元素，在版面配置比較推薦水平填滿的狀態，比較符合我們一般認為的排版美學，當然這沒有絕對性。

步驟一：

點擊變更對齊方式 (Align Options) 的符號。

步驟二：

一般只有 2 至 3 種的寬度選擇，分別是「置中對齊」、「寬幅寬度」和「全幅寬度」等等，部分像 (中寬 Wide Width) 或 the (全寬 Full Width) 等需要依賴 WordPress 佈景主題是否有支援和相容。

分隔符號樣式

分隔符號樣式
分隔符號樣式

在本分頁中，有三個分隔符號樣式可供選取：短線段、長線段 (完整的內容寬度) 和點狀線段。進階分頁可讓你將 CSS 類別新增至區塊，以便編寫自訂 CSS，並視需要設定區塊樣式。當您從提供的三個樣式選取時，此欄位會預先填入以下 3 種已選樣式提供的 CSS 類別。

  • is-style-default (預設的 CSS 類別)
  • is-style-wide (長線段的 CSS 類別)
  • is-style-dots (點狀線段的 CSS 類別)

調整標題文字色彩和背景色彩

WordPress 分隔符號 | 分割不同的版面元素
WordPress 分隔符號 | 分割不同的版面元素

新版本的 WordPress 提供各種分隔符號色彩配置的選擇，已經發展相對成熟的模組，並不輸主流的 頁面編輯器 太多，但再組部和精準的控制就止步，但一般基礎需要是滿足的。

HTML 錨點和調整附加的 CSS 類別

HTML 錨點和調整附加的 CSS 類別
HTML 錨點和調整附加的 CSS 類別

標題區塊裡的「HTML 錨定」是一個建立頁面躍點的實用工具，如果將區塊切換至其 HTML 檢視，你會發現系統以 CSS ID 的形式將「HTML 錨點」輸入內容新增至標題標籤。你也會在區塊 HTML 中看到 CSS 類別。

進階面板讓你將 CSS 類別新增至區塊，以便編寫自訂 CSS，並視需要設定區塊樣式，建議具備 CSS 程式碼的基本知識後再使用此功能。

常見問題 FAQ

什麼是 WordPress 分隔符號區塊？

水平分隔線或稱為分隔符號是基礎的 WordPress 文章和頁面組成元素，能夠協助你輕輕分割長篇的內容和版面，清晰和分明的內容結構，可以減少讀者的跳出率。

如何改變分隔符號區塊的色彩？

新版本的 WordPress 提供各種分隔符號色彩配置的選擇，已經發展相對成熟的模組，並不輸主流的 頁面編輯器 太多，但再組部和精準的控制就止步，但一般基礎需要是滿足的。

參考資料和引用文獻：

學員人數：5,500+ 人（持續增加之中）

前往免費的學習社團
中文語系的 WordPress - Facebook 社團列表