結論
安裝並啟動WordPress.org後,您可以立即開始在區塊編輯器中使用它。自訂斷點是可選的,但如果您調整它們以符合您網站的設計,則可以獲得更準確的響應式顯示。
安裝方法
從 WordPress 管理畫面安裝(建議)
- 在WordPress管理畫面上開啟外掛程式>新增
- 在搜尋欄位中輸入“ZenBlocks”
- 當出現ZenBlocks時,點選立即安裝
- 安裝完成後,點選啟動
重點: 由於它是從官方WordPress.org目錄分發的,因此它是一個安全插件,已經通過了安全審查。
從 ZIP 檔案安裝
- 從[WordPress.org的ZenBlocks頁面]下載ZIP檔(https://wordpress.org/plugins/zenblocks/)
- 在WordPress管理介面,開啟外掛>新增>上傳外掛
- 選擇並上傳下載的 ZIP 文件
- 點選啟用外掛
確認啟用
啟用後,ZenBlocks Elements 類別將出現在區塊編輯器的插入面板中。
- 開啟任何貼文或頁面的編輯畫面
- 點擊左上角的******按鈕打開區塊插入面板
- 搜尋“ZenBlocks”或從類別清單中搜尋 ZenBlocks 元素
- Button Basic 如果顯示該區塊,則安裝成功。
設定螢幕概覽
您可以從 設定 > ZenBlocks 存取插件的常規設定。
| 專案 | 描述 |
|---|---|
| 斷點設定 | 更改每個裝置的螢幕寬度閾值 |
| CSS 快取清除 | 手動清除前端樣式緩存 |
| 許可證管理 | 輸入許可證密鑰並查看Pro版本的狀態 |
自訂斷點
ZenBlocks可讓您自訂四個斷點以進行響應式設計。
預設值
| 裝置 | 顯示名稱 | 螢幕寬度 |
|---|---|---|
| ZBToken021 | 桌面 | 1141 像素或以上 |
| ZBToken022 | 中螢幕 | 841 像素 ~ 1140 像素 |
| ZBToken023 | 平板電腦 | 541 像素 ~ 840 像素 |
| ZBToken024 | 智慧型手機 | 540 像素或以下 |
如何改變
- 開啟 設定 > ZenBlocks
- 更改斷點設定部分中的值
- 點選儲存
注意: 更改斷點將為所有 ZenBlocks 區塊重新產生響應式 CSS。如果樣式在現有頁面上損壞,請清除 CSS 快取。
下一步
設定完成後,嘗試使用[建立您的第一個按鈕](../first-button/)來使用該區塊。