指南/建立內容/媒體/設計橫幅樣式

設計橫幅樣式

封面區塊提供多種選項來設定橫幅樣式。在本指南中,你將學習如何新增覆蓋層、調整長寬比、套用邊框和陰影,以及微調橫幅風格圖片和影片的焦點。

影片教學

新增或調整覆蓋層

覆蓋層會在橫幅圖片或影片上方加上一層半透明的色彩,讓文字和其他內容更容易閱讀。若要新增或調整覆蓋層設定,請依照以下步驟操作:

  1. 點選封面區塊以選取它。
  2. 區塊設定側邊欄中,點選樣式圖示。它的外觀看起來像一個黑白圓圈。
  3. 在「色彩」區段中,點選覆蓋層色彩來變更覆蓋層顏色
  4. 調整覆蓋層不透明度滑桿,控制覆蓋層色彩的透明度。不透明度為 0 表示圖片完全可見。不透明度為 100 表示覆蓋層會完全遮住圖片。依你的設計而定,覆蓋層不透明度設為 25 到 75 之間通常會有不錯的效果。
The color and overlay opacity sections of the block settings sidebar for the Cover block.

調整長寬比

你可以透過調整長寬比來控制橫幅的形狀。若要調整封面區塊的長寬比,請依照以下步驟操作:

  1. 點選封面區塊以選取它。
  2. 區塊設定側邊欄中,點選樣式圖示。它的外觀看起來像一個黑白圓圈。
  3. 找到長寬比設定。
  4. 從下拉式選單中選取一個預設長寬比
The "Aspect Ratio" drop-down menu expanded to display the options.

新增邊框和陰影

若要為封面區塊新增邊框或陰影,請依照以下步驟操作:

  1. 點選封面區塊以選取它。
  2. 區塊設定側邊欄中,點選樣式圖示。它的外觀看起來像一個黑白圓圈。
  3. 找到邊框與陰影區段。
  4. 使用可用的控制項調整邊框的寬度、顏色和圓角。
  5. 你也可以點選 ⋮ 圖示,啟用陰影設定來加入投影效果。

進一步了解邊框與陰影設定

啟用固定背景

固定背景(視差效果)會在訪客捲動畫面時讓橫幅圖片固定在原位。以下是範例:

請依照以下步驟建立固定的背景圖片:

  1. 新增一個封面區塊
  2. 區塊設定側邊欄中,點選樣式圖示。它的外觀看起來像一個黑白圓圈。
  3. 開啟「固定背景」。

如果你已將影片上傳到封面區塊,就不會看到這個選項。

啟用重複背景

重複背景 選項會在封面區塊中重複同一張圖片,形成圖樣。若要在封面區塊中重複背景,請依照以下步驟操作:

  1. 點選封面區塊以選取。
  2. 區塊設定側邊欄中,點選樣式圖示。樣式圖示看起來像一個黑白圓形。
  3. 開啟「重複背景」。

如果你在封面區塊中上傳的是影片,就不會看到這個選項。

設定焦點

焦點決定當橫幅大小調整時,圖片或影片的哪個部分會維持可見。當你的封面圖片在手機等小螢幕上檢視、無法完整顯示時,這個功能特別實用。在較小的螢幕上,圖片會以你選擇的焦點為中心,確保最重要的部分能夠顯示出來。

若要調整焦點,請依照以下步驟操作:

  1. 點選封面區塊以選取。
  2. 區塊設定側邊欄中,點選樣式圖示。樣式圖示看起來像一個黑白圓形。
  3. 找到焦點選取器
  4. 拖曳標記來調整焦點區域。

如果你上傳的封面媒體是影片,也可以設定海報圖片作為影片縮圖。

套用波浪樣式

若要在封面區塊的頂部或底部套用波浪樣式,請依照以下步驟操作:

  1. 點選封面區塊以選取。
  2. 區塊設定側邊欄中,點選樣式圖示。樣式圖示看起來像一個黑白圓形。
  3. 點選「底部波浪」或「頂部波浪」選項來套用波浪樣式。
  4. 點選預設即可移除波浪樣式。
Copied to clipboard!