指南/建立內容/設計/將樣式新增至群組

將樣式新增至群組

不妨運用 「群組」區塊,將設計樣式新增至內容群組。在本指引中,你將了解如何自訂 「群組」區塊外觀的 顏色、邊框和視覺元素。

影片教學

將預設樣式套用至群組

預設樣式是眾多 區塊佈景主題內建的功能。若要套用預設樣式,請依照下列步驟操作:

  1. 按一下 編輯畫面頂端的 「清單檢視」。
  2. 選取 「群組」區塊
  3. 區塊設定側邊欄中,按一下 「樣式」 分頁 (圖示看起來像黑白圓圈)。
  4. 按一下樣式,加以套用到 「群組」區塊
The Styles section of the Group block sidebar settings.

即使沒有預設樣式,你仍掌握完整控制權,可將樣式套用至 「群組」區塊 (詳述如下)。

變更群組的顏色

你可以變更 「群組」區塊的預設顏色,包括背景顏色、文字顏色等等。若要變更 「群組」區塊中使用的顏色,請依照下列步驟操作:

  1. 按一下 編輯畫面頂端的 「清單檢視」。
  2. 選取 「群組」區塊
  3. 區塊設定側邊欄中,找到 「顏色」 區段。
The "Color" section of the Group block's settings sidebar.
  1. 按一下要變更顏色的元素名稱,然後選取新的顏色。
  2. 按一下 「顏色」選項 () 圖示,即可啟用變更預設標題和按鈕顏色的選項。
  3. 按一下「儲存」「發表」即可儲存變更。

深入了解 如何變更顏色

新增背景圖片

背景圖片可為你的內容增加視覺刺激和背景資訊。若要將背景圖片新增至 「群組」區塊,請依照下列步驟操作:

  1. 按一下 編輯畫面頂端的 「清單檢視」。
  2. 選取 「群組」區塊
  3. 區塊設定側邊欄中,找到「背景圖片」區段。
  4. 按一下「新增背景圖片」,即可從網站的 媒體庫選取圖片, 或上傳新的圖片。
The "Background image" section of the Group block's settings sidebar.

若要移除背景圖片,請按一下「背景圖片」區段內的 「背景圖片選項」 (⋮)圖示,然後選取「重設」連結。

新增邊框或陰影

邊框和陰影能讓畫面更有層次,有助以視覺方式分隔內容區段。若要將這些元素新增至 「群組」區塊,請依照下列步驟操作:

  1. 按一下 編輯畫面頂端的 「清單檢視」。
  2. 選取 「群組」區塊
  3. 區塊設定側邊欄中,找到 「邊框和陰影」 區段。
  4. 調整以下內容,自訂邊框效果:
    • 寬度:邊框顯示的粗細程度。
    • 樣式:實線、長虛線或短虛線樣式。
    • 顏色:從預設顏色中選擇,或建立自訂顏色。
    • 半徑:為「群組」區塊 新增圓角
  5. 按一下 「邊框和陰影選項」(⋮) 選單,系統會顯示 「陰影」 選項。請從預設陰影設計中選取。

深入了解 邊框和陰影設定

重複使用樣式

為整個網站套用一致的設計,有助節省時間並使視覺效果更和諧。若要為所有「群組」區塊 設定預設樣式,請依照下列步驟操作:

  1. 前往 「外觀」→「編輯器」→「樣式」
  2. 找到 「區塊」 區段內的 「群組」區塊, 設定偏好的背景、邊框及其他樣式選項。
  3. 按一下 「儲存」, 將這些預設值套用到所有 「群組」區塊

備註: 你仍可透過區塊設定側邊欄, 自訂個別的 「群組」區塊。

深入了解 如何設定網站樣式

Copied to clipboard!