區塊內容完成後,切到設定視窗的「排版」頁籤調整間距、圖片比例與對齊。若目前編輯的是 Vibe 畫布,還能從「版面區塊」上方設定整張畫布與頁首及頁尾之間的空白。

設定 Vibe 畫布上下間距#

- 上下有保留空白(60px):維持標準頁面呼吸感。
- 上下無保留空白:讓畫布內容貼齊頁首與頁尾,適合滿版設計。
- 自訂上下間距:可輸入
30px、5%或2rem這類數值,上下會使用同一個間距。
選好後按「套用」才會儲存;按「取消」會保留原本設定。這組數值也會和 Vibe 畫布的另一個編輯入口同步,不需要重複設定。
調整區塊間距#
間隔區塊可用高度欄位控制空白;其他區塊則依版型提供上下留白或內容間距。調整時先小幅修改,再用右側預覽確認,不要一次加入過大的空白。
調整圖文左右欄比例#

電腦版可選擇 3:7、4:6、5:5、6:4 或 7:3。比例一律依畫面上的「左欄:右欄」解讀,即使把版型切成右圖左文,也不用反過來換算。白卡版型的圖片會填滿圖片欄;透明滿版則可另外設定圖片比例與垂直對齊。
設定圖片比例#
- 16:9:適合橫幅,服務介紹與影片感版面。
- 4:3:適合卡片,作品與一般內容配圖。
- 原始比例:保留圖片本身比例,適合不希望固定裁切的素材。
設定圖文垂直對齊#
- 置上對齊:圖片頂端與文字欄頂端對齊。
- 垂直置中:圖片置於文字欄中間。
- 置下對齊:圖片底端與文字欄底端對齊。
- 填滿空間:讓圖片欄與文字欄等高,圖片以裁切方式填滿。
分別設定電腦版與手機版文字對齊#

電腦版文字預設置左,手機版文字預設置中。你也可以依內容改成置左、置中或置右;調整其中一個裝置時,不會覆蓋另一個裝置的選擇。完成後請切換兩種預覽,確認標題、說明與按鈕的閱讀順序。
多欄卡片內容對齊#
多欄式區塊可選卡片內容靠左或置中。靠左適合文字較多,閱讀導向的卡片;置中適合短標題,圖示與方案特色。若同一列卡片都有按鈕,系統會維持卡片等高與按鈕對齊。
調整圖片輪播的圓角與箭頭#

圖片輪播的「設定」頁籤可調整圖片圓角,範圍為 0~200 px;填入 0 會顯示直角。若希望畫面更簡潔,可將「左右切換箭頭」改為隱藏,底部的分頁圓點仍會保留。
完成後檢查電腦版與手機版#
固定圖片比例與填滿效果在桌機,手機可能有不同呈現。儲存後切換電腦版與手機版預覽,特別檢查人臉,產品主體與文字是否被裁掉。
延伸閱讀#
常見問題
每個區塊都有相同的排版欄位嗎?
不一定。系統會依區塊能力顯示可用欄位;所有原生區塊都有進場動畫設定,有圖片的區塊才會顯示圖片比例,圖文類區塊才會顯示垂直對齊。
選原始比例會不會裁切圖片?
原始比例會盡量沿用圖片本身比例;固定 16:9 或 4:3 時,版面會以指定比例呈現,必要時可能使用置中裁切。
填滿空間適合什麼情況?
適合希望圖片與旁邊文字欄等高的圖文版型。圖片會以填滿方式裁切;手機改成上下排列時會恢復合理比例。
圖片輪播可以隱藏左右切換箭頭嗎?
可以。在圖片輪播的設定頁籤將「左右切換箭頭」改為隱藏即可;底部的分頁圓點不受影響。
圖文區塊可以分開設定電腦版與手機版的文字對齊嗎?
可以。電腦版與手機版各有獨立的文字對齊設定,調整其中一個裝置時,不會覆蓋另一個裝置的選擇。