WordPress區塊提供了一種自定義網站內容和外觀的新方法。這些區塊允許WordPress使用者新增和編輯內容元素，如段落、影象和小部件。
當前WordPress版本中有超過90個預設區塊可用。它們涵蓋文字、媒體、小部件、主題元素和嵌入。
除此之外，與經典編輯器相比，Gutenberg區塊編輯器具有拖放功能和更好的內容視覺預覽。
因此，與舊編輯器相比，這種新的基於區塊的編輯方法提供了更友好的使用者體驗和更多種類的自定義選項。如果您想擴充套件基於區塊的編輯器的功能，安裝WordPress區塊外掛將新增更多內容區塊選項。
本文將解釋您需要了解的有關區塊的所有資訊以及如何使用新的WordPress區塊編輯器。我們還將列出10個外掛來擴充套件區塊集合並提供更多自定義可能性。
什麼是WordPress區塊？
區塊是用於在WordPress文章或頁面中建立和編輯元素的元件。WordPress編輯器中提供了各種區塊型別，用於新增文字、媒體檔案和佈局元素，讓您更靈活地構建內容。
- 什麼是WordPress區塊？
- 為什麼使用WordPress區塊？
- 區塊編輯器中有哪些型別的WordPress區塊可用？
- 如何使用WordPress區塊來自定義您的網站
- 10個最佳WordPress區塊外掛
為什麼使用WordPress區塊？
舊的WordPress編輯器是一個專注於文字編輯的TinyMCE編輯器。該介面類似於文字編輯器軟體，沒有提供頁面或文章預覽的視覺元素。
相比之下，內容區塊允許您更改頁面佈局並無縫插入各種視覺和互動式元素 – 使用舊的經典編輯器無法完成的任務。
區塊在許多方面也提高了易用性。例如，嵌入外部媒體（如YouTube視訊）現在就像將特定區塊新增到內容並貼上視訊URL一樣簡單。
使用以前的編輯器，這樣的內容定製可能需要額外的HTML程式碼。
可重複使用的區塊功能可讓您儲存預先自定義的區塊以供將來使用，因此您不必從頭開始重新建立內容。
另一種選擇是使用區塊樣板——可用於不同目的的預構建區塊佈局。
使用基於區塊的WordPress主題也是使用區塊編輯器及其全域性樣式介面自定義模板的好方法。只需重新排列內容區塊，就可以更輕鬆地更改模板甚至整個站點的佈局。
總體而言，新的WordPress編輯器為內容編輯提供了更好的使用者體驗。它也是一個更加使用者友好的平臺，供新使用者學習WordPress。
區塊編輯器中有哪些型別的WordPress區塊可用？
最新的WordPress版本中有90多個區塊可用，分為六類——文字、媒體、設計、小工具、主題和嵌入。
讓我們看看WordPress區塊編輯器中的所有塊及其主要自定義選項。
文字區塊
文字區塊可讓您向內容新增標題、段落和其他文字元素。一些可用的主要文字區塊是：
- 段落
- 標題
- 列表
- 引用
- 引文
- 經典
- 預格式化
- 程式碼
- 表格
- 詩篇
一些文字區塊還提供不同的方式來顯示文字。例如，pullquote區塊有助於將注意力吸引到文字摘錄，而table區塊可以更容易地呈現和比較任何資訊。
程式碼和預格式化等其他區塊允許您突出顯示程式碼片段。
媒體區塊
媒體區塊讓您可以將各種檔案上傳到媒體庫並將它們嵌入到內容中。有七個媒體區塊：
- 圖片
- 畫廊
- 音訊
- 封面
- 檔案
- 媒體和文字
- 視訊
圖片和畫廊區塊是最常見的媒體區塊之一。
當影象區塊顯示單個影象時，相簿區塊允許您建立影象叢集。也就是說，相簿中的影象被視為具有自己的替代文字欄位的獨立區塊。
檔案區塊可以接受任何檔案型別並將它們嵌入到站點中。此區塊的一個顯著功能是PDF檢視器，它允許您嵌入PDF檔案，訪問者可以直接在網站上閱讀或下載。
設計區塊
使用WordPress區塊編輯器，可以使用設計區塊輕鬆自定義內容佈局。雖然這種區塊型別不會新增內容，但它有助於確定內容對網站訪問者的顯示方式。
有八個可用的設計模組：
- 多個按鈕
- 欄目
- 組
- 行
- 更多
- 分頁符
- 分隔符
- 空格
欄目、組和行也是WordPress容器區塊型別，這意味著它們可以在其中託管單個區塊。
例如，使用欄目區塊建立側邊欄。您可以將頁面寬度劃分為 70:30 的比例，將內容新增到較大的一側，並將WordPress小工具和其他元素插入到較小的一側。
使用行區塊，在同一水平位置新增多個區塊。例如，使用它將元素新增到頁首和頁尾。
小工具區塊
小工具現在以區塊的形式出現，您可以在頁面的任何位置插入，包括頁尾和側邊欄。
Gutenberg區塊編輯器中可用的12個小部件區塊是：
- 檔案
- 日曆
- 類別
- 自定義HTML
- 最新評論
- 最新文章
- 頁面列表
- RSS
- 搜尋
- 短程式碼
- 社會圖示
- 標籤雲
主題區塊
大多數主題區塊都是動態的，會引入內容資訊，例如釋出內容、查詢迴圈和釋出評論，並將它們顯示在網站上。其中一些對於顯示站點標識也是必不可少的，包括站點徽標、站點標題和站點標語。
共有23個主題區塊。與網站和主題設計相關的區塊通常是：
- 導航
- 網站標誌
- 網站標題
- 網站標語
- 標題
- 頁尾
- 模板部分
- 登入/登出
還有一些區塊可以從部落格文章中獲取內容資訊：
- 文章標題
- 後摘錄
- 釋出特色圖片
- 釋出內容
- 文章作者
- 釋出日期
- 文章類別
- 釋出標籤
- 下一篇文章
- 上一篇
嵌入區塊
新的區塊編輯器可讓您通過複製和貼上URL輕鬆嵌入外部內容。例如，有一個用於嵌入YouTube視訊的專用區塊。
新編輯器提供的一些嵌入區塊是：
- YouTube
- 視訊
- Spotify
- SoundCloud
如果找不到所需的平臺，請使用嵌入區塊並貼上URL以嵌入媒體。
如何使用WordPress區塊來自定義您的網站
Gutenberg區塊編輯器是用於建立文章和頁面的預設WordPress編輯器。在WordPress 5.9中使用基於區塊的主題時，區塊編輯器也可用於完整的站點編輯。
新增新的部落格文章或頁面時，編輯器將預設提供一個段落區塊，以便您可以立即開始寫作。當您按Enter時，段落區塊也是預設的新區塊，使編寫過程無縫。
或者，通過單擊內容區域中的加號( + ) 按鈕新增新區塊。將出現一個小彈出視窗，其中包含六個最近使用的區塊和一個搜尋欄。使用搜尋欄查詢特定區塊並單擊它以將其插入到內容中。
另一種選擇是通過單擊螢幕左上角的加號( + ) 按鈕開啟區塊插入器。
左側將出現一個新面板，其中包含所有可用區塊 – 您可以使用搜尋欄找到所需的選項。然後，單擊該區塊以將其新增到內容中。
要重新排列區塊，WordPress區塊編輯器具有拖放功能。選擇任何區塊，單擊其工具欄上的拖動圖示，然後將其放在所需的位置。
或者，使用區塊工具欄上的向上和向下箭頭。
所有WordPress內容區塊都有不同的設定工具。要配置其中任何一個，請選擇一個區塊，然後單擊螢幕右上角的“設定”按鈕開啟區塊設定面板。
設定面板將出現在右側。例如，段落區塊具有自定義顏色、排版和其他設計元素的選項。
10個最佳WordPress區塊外掛
安裝WordPress外掛是向WordPress編輯器新增不同區塊選項的好方法。
有幾個WordPress外掛可用於使用附加的內容區塊、自定義工具甚至佈局模板來擴充套件區塊庫。
但是，每個區塊外掛都提供一組不同的區塊。因此，為了幫助您找到最佳選擇，我們將列出前10個WordPress區塊外掛。
1.Genesis Blocks
Genesis Blocks外掛向WordPress區塊編輯器新增了14個新區塊。它可能看起來不多，但它的一組區塊可以幫助將商業網站提升到一個新的水平。
定價區塊是主要的新增功能之一。該區塊有助於建立定價表，而無需使用表區塊從頭開始構建它。它允許您新增最多四個定價列，並帶有CTA按鈕。
call-to-action區塊可讓您將號召性用語部分新增到站點。它支援影象背景和全形佈局，使其從其他內容中脫穎而出。
該外掛的高階版本Genesis Pro增加了兩個區塊和區塊級使用者許可權，這樣只有選定的使用者才能訪問某些區塊。總而言之，這個外掛適用於尋找簡單附加區塊的部落格和小型企業網站。
2.Getwid
Getwid是具有最廣泛附加Gutenberg區塊的免費區塊外掛。它提供了38個獨特的區塊和超過35個預製模板，可幫助您建立漂亮的網頁設計，而無需安裝太多外掛。
影象滑塊、影象框和影象堆疊庫等區塊提供了在內容上呈現影象的新方法。Getwid還附帶了擴充套件現有嵌入選項的Instagram和Google Maps區塊。
預製模板類似於WordPress區塊樣板。但是，Getwid使用模板庫區塊而不是模式插入器來選擇模板並將其插入到內容中。
您可以禁用未使用的區塊以保持編輯器的速度和簡單性。轉到儀表盤->設定-> Getwid並開啟“區塊”選項卡以選擇要禁用的區塊。
3.Ultimate Addons for Gutenberg
Ultimate Addons for Gutenberg (UAG) 是最引人注目的WordPress區塊外掛之一。除了33個不同的區塊，UAG還提供81個整頁模板、284個區塊樣板和56個線框。
post grid、post masonry和post carousel等區塊以各種格式顯示您的文章。價目表區塊非常適合列出餐廳的選單或其他產品價格。也可以使用區塊的設計工具為每個專案插入影象。
UAG帶有幾個模式區塊，用於how-to、review和FAQ內容。這些區塊不僅有助於更快地設定內容，還可以提高內容在搜尋引擎上的排名。
該外掛的模板、模式和線框可用於文章和頁面，幷包括作品集和推薦等選項。單擊編輯器頂部的UAG模板按鈕以查詢所有可用選項。
4.Premium Blocks for Gutenberg
Premium Blocks for Gutenberg是一個免費外掛，它新增了14個對網站效能和速度影響最小的新區塊。
該外掛提供的獨特區塊之一是Dual Heading，它將標題分成兩部分，您可以單獨自定義。Fancy Text區塊可讓您在文字的各個部分之間新增動畫。
該外掛提供有限的附加區塊，專注於每個區塊的設定選項，以幫助您調整、編輯和設計內容。
例如，您可以修改每個區塊的響應能力和容器樣式，而幾個區塊還帶有獨特的設計工具。
有一個選項可以啟用或禁用區塊，以儘量減少外掛的影響。前往Dashboard -> Premium Blocks for Gutenberg -> Block Settings，然後選擇要啟用和停用的區塊。
5. PublishPress Blocks
PublishPress Blocks，以前稱為Advanced Gutenberg，帶有22個高階區塊，您可以通過 WordPress 管理儀表盤對其進行自定義。
獨特的區塊之一是Login/Register Form，在區塊編輯器中提供了一個預製的登入介面。PublishPress Blocks還提供時事通訊和聯絡表格區塊用於潛在客戶生成。
此外掛具有區塊訪問功能，可以為每個使用者角色啟用或停用特定區塊。導航到Blocks -> Settings以啟用該功能並通過外掛設定頁面上的Block Access面板對其進行管理。
區塊設定部分允許您修改每個PublishPress區塊的全域性樣式。每個區塊都有自己的設定，但它們主要包括顏色、邊框選項和其他設計選項。
如果你想為你的WordPress網站使用自定義CSS，這個外掛還有一個自定義樣式面板來新增CSS類。
6.Stackable
Stackable是最通用的區塊外掛之一。它的免費版本增加了35個區塊、100個預建區塊佈局、8個UI套件和37個線框，而Stackable高階版通過403個預建區塊佈局和33個UI套件增加了設計選項。
預先構建的區塊佈局和UI工具包可用於文章和頁面。通過單擊編輯器螢幕頂部的設計庫按鈕查詢所有可用選項。
Stackable提供了廣泛的區塊自定義工具，每個區塊的區塊、樣式和高階設定。
區塊設定包含一些基本的佈局配置，如邊框、對齊和間距，而高階設定允許您配置區塊的響應能力和HTML標籤。還可以使用高階版本新增運動效果。
7.Ultimate Blocks
Ultimate Blocks專注於博主和營銷人員。它增加了22個區塊，例如Review、Social Share和Call to Action以增加網站的參與度。該外掛還包括評論和How to區塊上的資料結構化標記以改進SEO。
區塊管理器功能允許您啟用和禁用區塊。通過導航到Dashboard -> Ultimate Blocks -> Ultimate Blocks開啟區塊管理器。
Ultimate Blocks擁有一個擁有400多名成員的活躍社羣。如果您在使用外掛時遇到困難，請檢視現有討論或在論壇上釋出您的問題。
Dashboard -> Ultimate Blocks -> Contact Us上也提供了聯絡表格。
8. Kadence Blocks
Kadence Blocks提供的工具可以讓您在部落格文章或頁面中輕鬆建立複雜的佈局。免費版為編輯器增加了15個區塊，而Kandace Blocks Pro帶有12個高階區塊，包括產品輪播和視訊彈出視窗。
Kadence還提供預構建的部分和入門模板。通過單擊文章或頁面編輯器頂部的設計庫按鈕開啟Kadence設計庫。
此外，可以通過單擊設定圖示旁邊的Kadence Blocks徽標來設定區塊的全域性樣式。它允許您更改每個區塊的調色盤和全域性樣式。
9.Otter Blocks
Otter Blocks是一個輕量級的免費外掛，它向編輯器新增了29個新區塊，包括Google地圖和新增到購物車的區塊。
有一個選項可以將部分區塊設定為新頁面的預設區塊。或者，開啟模板庫以從51個預建部分中進行選擇，以快速建立內容。
通過單擊標題右上角的Otter Blocks徽標並選擇Global Defaults來調整預設區塊設定。您將能夠更改每個區塊的預設顏色、版式和間距。
該外掛還具有適用於Otter區塊和預設WordPress區塊的動畫和自定義CSS功能。例如，使用預設段落區塊編寫數字時，您可以為其新增計數動畫。
自定義CSS功能也不同於預設CSS類，因為它允許您直接在編輯器中編寫CSS程式碼。
10. CoBlocks
CoBlocks是一個免費外掛，可為Gutenberg區塊編輯器新增靈活的頁面構建體驗。它帶有31個新區塊，包括用於建立餐廳選單的食物和飲料區塊型別和用於強調重要文字的突出顯示區塊。
該外掛還提供了新的嵌入可能性。OpenTable允許您為您的餐廳網站嵌入預訂小工具，並且使用Gist區塊，您可以顯示來自GitHub Gist的程式碼片段。
CoBlocks的另一個獨特功能是某些區塊（如Row ）的拖動調整大小功能。您可以通過單擊並拖動行區塊或使用行設定上的自定義裝訂線來調整行區塊內列的寬度。
小結
結合WordPress 5.9上推出的新功能和基於區塊的主題，區塊現在是完整站點編輯和改善使用者體驗的基礎。
WordPress區塊通過讓您在不使用額外程式碼或外掛的情況下構建有吸引力的佈局和視覺設計，使內容定製變得更加容易。
與之前的編輯器相比，它還有其他幾個好處。例如，可重複使用的區塊讓您可以儲存預先設計的區塊以供將來使用，從而簡化頁面和後期建立過程。區塊工具欄中提供的拖放功能允許您快速重新排列內容。
目前，WordPress有超過90個預設區塊，分為六類。雖然它們足以建立一個基本的WordPress網站或部落格，但WordPress區塊外掛可以擴充套件區塊庫並提供更多定製工具來滿足您的設計需求。
評論留言