iT邦幫忙

2021 iThome 鐵人賽

DAY 7
0
自我挑戰組

WordPress 區塊編輯器與區塊套件組合外掛【新手村】系列 第 7

07 | WordPress 空白間隔區塊 Spacer Block

https://ithelp.ithome.com.tw/upload/images/20210921/20116357ARZBGjUUX1.jpg
為了明確分隔文章中不同的段落,我們一們會在每個「段落」之間加上適當的留白空間,在 WordPress 編輯器裡是使用度非常高的區塊。


在段落輸入「/空白間隔」,點擊區塊即可

https://ithelp.ithome.com.tw/upload/images/20210921/20116357Ag6F6W98Qf.jpg


另外也可以點擊 [+],輸入「空白間隔」

https://ithelp.ithome.com.tw/upload/images/20210921/20116357U807w0WaOq.jpg


空白間隔區塊的標準狀態

https://ithelp.ithome.com.tw/upload/images/20210921/20116357V8pGvHaeq4.jpg


按著「白點」可以往上往下拉動,控制留白的高度

https://ithelp.ithome.com.tw/upload/images/20210921/20116357csfCdfnRTk.jpg


轉換為「群組」區塊

https://ithelp.ithome.com.tw/upload/images/20210921/201163574JW6IxXoVf.jpg


「群組」區塊可以調整文字和背景色彩

https://ithelp.ithome.com.tw/upload/images/20210921/20116357dezB6X7udV.jpg


空白間隔區塊 | 設定

https://ithelp.ithome.com.tw/upload/images/20210921/20116357R7tmabcGRu.jpg


HTML 錨點和附加的 CSS 類別

https://ithelp.ithome.com.tw/upload/images/20210921/20116357OcQE9FTKkA.jpg


廷伸閱讀:

什麼是區塊編輯器?
什麼是 WordPress 空白間隔區塊?


上一篇
06 | WordPress 段落區塊 Paragraph Block
下一篇
08 | WordPress 分隔符號區塊 Separator Block
系列文
WordPress 區塊編輯器與區塊套件組合外掛【新手村】30

尚未有邦友留言

立即登入留言