指南/建立內容/媒體/自訂橫幅版面配置

自訂橫幅版面配置

封面區塊是一種容器區塊,用來放置橫幅內容。你可以透過變更對齊方式、內容位置和其他設定來調整版面配置。本指南將說明如何自訂橫幅的版面配置。

影片教學

在這部影片中,你將學習如何使用封面區塊建立橫幅風格的區段。內容包括在圖片或影片背景上加入文字或其他區塊、調整版面配置和焦點位置、自訂覆蓋層,以及在行動裝置上預覽設計。

調整橫幅對齊方式

你可以在頁面、文章或範本中調整橫幅的對齊方式。若要對齊橫幅,請依照以下步驟操作:

  1. 點選封面區塊以選取它。
  2. 在出現的區塊工具列中,點選對齊按鈕。
The "Align" icon highlighted in the Cover block toolbar.
  1. 你可以選擇以下選項:

變更內容位置

你可以調整橫幅內文字、按鈕和其他內容的位置。若要調整內容在橫幅中的位置,請依照以下步驟操作:

  1. 點選封面區塊以選取它。
  2. 在出現的區塊工具列中,點選「變更內容位置」按鈕。
The "Change content position" icon highlighted in the Cover block toolbar.
  1. 選擇其中一個預設選項,即可將內容移到橫幅的頂部、中央或底部。

將圖片設為全高

若要讓圖片一律顯示為全高,你可以在區塊工具列中啟用「切換全高」選項。

  1. 點選封面區塊以選取它。
  2. 在出現的區塊工具列中,點選「全高」按鈕(圖示看起來像一個只顯示四個角的正方形):
The "full height" icon highlighted in the Cover block toolbar.

你可以再次點選該按鈕,移除全高設定。

變更內容寬度

你可以按照以下步驟,變更 封面區塊 內的內容排列方式:

  1. 點選 封面區塊
  2. 區塊設定側邊欄中,切換「內部區塊使用內容寬度」,以調整 封面區塊 內內容的顯示方式。
  3. 當「內部區塊使用內容寬度」開啟時,封面區塊內的區塊會遵循以下寬度設定:
    • 內容: 未設為寬幅或全寬的區塊,其內容區域的寬度。
    • 寬幅: 設為寬幅的區塊,其內容的寬度。

進一步了解如何變更區塊的寬度

調整內距與外距

你可以按照以下步驟,為 封面區塊 新增內距與外距:

  1. 點選 封面區塊
  2. 區塊設定側邊欄中,點選樣式圖示。它看起來像一個黑白圓形。
  3. 找到尺寸區段。
  4. 調整內距、外距區塊間距
The dimensions settings section of the sidebar with padding and block spacing options.

設定最小高度

若要確保橫幅大小一致,請按照以下步驟設定最小高度:

  1. 點選 封面區塊
  2. 區塊設定側邊欄中,點選樣式圖示。它看起來像一個黑白圓形。
  3. 找到「最小高度」設定。
  4. 輸入特定高度的單位值,以確保橫幅維持一致的大小。
Copied to clipboard!