WordPress 塊編輯器：您需要知道的一切（2022 年）
已發表: 2022-04-23
WordPress 發布了新的 Block 編輯器，現在已經取代了舊的經典編輯器。 這個編輯器以完全不同的方式工作，是 WordPress 的發展方向。
如果您是WordPress 塊編輯器的新手，並且正在尋找資源來了解它的工作原理，那麼您來對地方了！
在這篇文章中，我將帶您了解這個新的 WordPress 塊編輯器。
此外，我將向您展示它是如何工作的，以及如何放棄經典編輯器，轉而使用這款更好、更高效的編輯器。
那麼，讓我們開始吧。
- 什麼是 WordPress 塊編輯器？
- 塊編輯器與經典編輯器：有什麼區別？
- 塊編輯器界面的快速介紹
- 塊介紹
- 將舊帖子轉換為塊
- 插入新塊
- 複製、移動和刪除塊
- 創建可重用塊
- 向塊編輯器添加更多塊
什麼是 WordPress 塊編輯器？
WordPress 塊編輯器是基於塊的 WordPress 新的默認編輯器。 塊是可用於添加段落、圖像、視頻、按鈕、列表等的內容元素。
而 Gutenberg 是新的 WordPress 塊編輯器的項目名稱。 該項目以發明活字機械印刷機的約翰內斯·古騰堡命名。
WordPress 表示，新編輯器的最大目標之一是讓用戶只需單擊幾下即可構建豐富的帖子和漂亮的佈局。
借助新的塊界面，WordPress 用戶現在可以創建漂亮的頁面和帖子，而無需任何頁面構建器插件。
為了更好地理解這個塊，我們需要看看它與經典編輯器有多麼不同。
塊編輯器與經典編輯器：有什麼區別？
新的塊編輯器與經典編輯器有很大不同。
讓我們看看如何：
這是 WordPress 經典編輯器的外觀：
而且，這是 WordPress 的新塊編輯器：
它們在表面上看起來非常不同。 但是，如果您深入了解每個編輯器，這些差異會更大。
經典編輯器和塊編輯器最大的區別在於：
經典編輯器是具有各種格式選項的簡單文本編輯器。 您可以像在任何其他文本編輯器中添加一樣添加圖像、簡碼、視頻等。
另一方面，塊編輯器使用塊，其中每個元素或實體都表示為塊。 因此，您添加到內容中的任何圖像、圖庫、視頻或簡碼都是塊的形式。
這就是為什麼它也被稱為塊編輯器。
塊編輯器帶有許多可以添加到您的內容中的預定義塊。 此外，您可以使用 Gutenberg 塊插件添加許多新塊。
所以，現在您知道經典編輯器和塊編輯器之間的區別了。
問題是：
古騰堡的塊編輯器比經典編輯器好在哪裡？
與經典編輯器相比，使用塊編輯器有很多優點。
最大的一點是它比經典編輯器好用。 您還可以編輯單個塊，從而更好地控制頁面的設計和佈局。
閱讀：古騰堡（塊編輯器）與。 經典編輯器：選擇哪一個？
塊編輯器界面的快速介紹
讓我們深入了解一下 Gutenberg 塊編輯器界面。 每當您在 Gutenberg 中創建帖子或頁面時，編輯器的外觀如下：
以下是古騰堡編輯器界面元素的簡要介紹：
- 您的博客文章/頁面的標題。
- 您的帖子/頁面的內容區域。
- 允許您添加新塊。
- 撤消/重做按鈕。
- 訪問帖子設置，您可以在其中添加類別、更改特色圖片、設置發布日期等。
- 單個選定塊的設置。 每個塊可能有不同的塊設置。
- 實時預覽或發布/更新帖子。
現在，您已經熟悉了塊編輯器的界面，讓我們來看看 Gutenberg 附帶的塊。
塊介紹
自本指南開始以來，您一直在閱讀新的編輯器與塊一起使用。 但是，這些塊是什麼？ 而且，它們是如何工作的？
以下是古騰堡根據不同類別提供的不同類型的塊：
- 段落塊
- 標題塊
- 圖像塊
- 畫廊塊
- 列表塊
- 報價塊
- 音頻塊
- 蓋塊
- 文件塊
- 視頻塊
- 自定義 HTML 塊
- 表塊
- 代碼塊
- 經典街區
- 預格式化塊
- 引文塊
- 詩塊
- 列塊
- 按鈕塊
- 媒體和文本塊
- 分頁塊
- 分隔塊
- 間隔塊
- 簡碼塊
- 最新的帖子
- YouTube 嵌入塊
通用塊
這些是處理帖子時經常使用的塊。 通用塊包括最基本的元素塊。
段落塊
段落塊可讓您在塊編輯器中編寫文本。 這是一個簡單的框，您可以在其中為您的帖子編寫內容。
該塊帶有標準格式選項，允許您更改段落的字體大小、對齊方式、背景、文本顏色等。
標題塊
標題塊可讓您向內容添加標題。 您可以從六種尺寸（H1 到 H6）中選擇標題類型。
您可以更改標題的對齊方式、格式化它們，甚至插入鏈接。
圖像塊
圖像塊允許您將圖像添加到編輯器。 您可以從計算機、WordPress 媒體庫或 URL 插入圖像。
您可以在圖像塊中添加標題、更改圖像大小、添加 ALT 文本等。
畫廊塊
您可以使用 Gallery 塊創建漂亮的畫廊。 使用此塊，您可以將多個圖像添加到同一個塊。
您可以選擇畫廊的列數，為圖像添加標題，甚至鏈接畫廊的圖像。
列表塊
列表塊允許您創建項目符號或編號列表。
此塊還帶有標準格式選項，可讓您創建子項、添加錨鏈接和格式化列表文本。
報價塊
引用塊可讓您在內容中添加漂亮的引用。
您可以將引用與作者姓名一起添加，並像任何其他塊一樣對其進行格式化。
音頻塊
音頻塊可讓您將音頻文件上傳到您的內容。 該塊顯示一個漂亮的音頻播放器。
您可以自定義音頻播放器以自動和/或循環播放音頻。
蓋塊
封面塊可用於添加帶有文本覆蓋的圖像或視頻。
您可以更改疊加層的背景顏色和不透明度。
文件塊
您可以使用文件塊添加不同類型的文件。
文件塊可讓您顯示按鈕、選擇在新選項卡中打開文件等。
視頻塊
視頻塊可讓您將視頻上傳到您的內容。
您可以自動播放視頻、將其靜音、上傳視頻縮略圖等。
格式化塊
格式化塊包括代碼塊、自定義 HTML 塊和其他類似塊。
讓我們瀏覽一下古騰堡中可用的每個格式化塊。
自定義 HTML 塊
自定義 HTML 塊可讓您快速將自定義 HTML 添加到您的帖子並進行預覽。
表塊
現在，您無需使用任何插件即可在 WordPress 中創建表格。
表格塊可讓您輕鬆創建表格。 您可以選擇行數和列數並選擇佈局。
代碼塊
您可以使用代碼塊顯示漂亮的代碼片段。
代碼塊不是代碼可執行的塊。 它只是為了向您的讀者顯示代碼。
經典街區
您可以使用經典塊添加一個小型經典編輯器。
經典塊具有經典編輯器的所有格式選項。
預格式化塊
預格式化的塊可讓您在鍵入時在前端顯示文本。
它以等寬字體顯示文本。
引文塊
您可以使用 pullquote 塊強調內容的任何文本。
您可以通過更改主顏色和文本顏色來自定義塊的顏色。
詩塊
詩塊用於寫詩或歌詞等詩句。
經文顯示在一個新行中，您可以根據需要編寫任意數量的經文。
佈局元素塊
佈局元素塊可讓您精美地自定義帖子的佈局。
以下是 Gutenberg 中的佈局元素塊：
列塊
您可以使用列塊將列添加到您的內容中。 不再需要為列使用任何短代碼插件！
可以自定義列塊，您可以更改列的背景顏色。
按鈕塊
您可以使用按鈕塊將漂亮的按鈕添加到您的帖子中。
按鈕塊有許多設置，可讓您自定義按鈕的邊框和顏色。
媒體和文本塊
媒體和文本塊可用於並排顯示文本和媒體。
此塊具有文本和媒體的標準格式選項。
分頁塊
分頁符塊可讓您向內容添加簡單的分頁符。
分隔塊
分隔符塊是一個簡單的塊，可讓您在帖子中添加分隔符。
間隔塊
這個塊增加了塊之間的空間。
小部件元素塊
小部件元素塊可讓您將小部件添加到您的帖子中。 這些小部件塊包括簡碼、檔案、類別、搜索、標籤雲等。
簡碼塊
簡碼塊可讓您向內容添加簡碼。
與將簡碼直接粘貼到內容中的經典編輯器不同，簡碼塊可讓您輕鬆插入簡碼。
最新的帖子
最新帖子塊可讓您在帖子中顯示在您的博客上發布的最新帖子。
有一些設置可讓您選擇帖子的類別、選擇要顯示的項目數、訂購帖子和顯示發布日期。
嵌入元素
嵌入元素可讓您將其他來源的內容嵌入到您的帖子中。
一些嵌入元素塊包括 YouTube 嵌入、Spotify、SlideShare 等。
YouTube 嵌入塊
YouTube 嵌入塊可讓您將任何 YouTube 視頻嵌入到您的內容中。
所以，這些是古騰堡附帶的塊。
將舊帖子轉換為塊
如果您現在對塊編輯器的興趣已經達到頂峰，那麼是時候看看如何將舊的經典編輯器帖子轉換為塊了。
該過程非常簡單，只需單擊幾下即可。
以下是您的操作方法：
轉到 WordPress 儀表板中的帖子 > 所有帖子。
在要轉換為塊的帖子上單擊“編輯”。
現在，如果您在 WordPress 上安裝了 Gutenberg，則帖子將使用新的塊編輯器界面加載。
但是，您的所有內容都將位於我們在上一節中討論的“經典塊”內。
經典塊只是一個具有經典編輯器所有功能的 TinyMCE 編輯器。
請務必注意，僅僅因為您的帖子已加載到新的塊編輯器中並不意味著它已轉換為塊。
要將經典塊轉換為單個塊，請單擊“轉換為塊”選項。
您的整個帖子將被轉換為單獨的塊。
而且，就是這樣！
將舊帖子轉換為塊就這麼簡單。
但是，使用塊編輯器界面創建新帖子怎麼樣？
讓我們來看看。
插入新塊
在前面的部分中，我們了解了 Gutenberg 塊編輯器界面。 這是一個簡單直接的界面，可讓您輕鬆創建帖子。
要將任何內容添加到您的帖子中，您需要插入一個塊。
以下是您可以在 Gutenberg 的帖子中插入塊的不同方法。
有三種插入塊的方法，它們都相當簡單。
第一個是簡單地點擊帖子編輯器上的“+”號。
您還可以通過單擊頂部工具欄上的“+”號來添加新塊。
最後一個非常棒。 只需輸入 / 然後輸入塊的名稱，然後在編輯器中插入塊。
這種方法最好的部分是您不必輸入塊的全名。 該塊會在您鍵入時自動為您提供建議。
複製、移動和刪除塊
塊編輯器最好的部分是一切都在一個塊中。 因此，如果您想複製文本、圖像或表格，您不必復制整個內容。
只需選擇塊並選擇您想用它做什麼。 您可以復制塊，只需拖動即可移動它們或刪除它們。
這是你如何做到的。
複製塊
複製塊非常容易。
要復制一個塊，請選擇該塊並單擊其設置（三個垂直點）。 在設置中，有一個複制塊的選項。
單擊它，您的塊將被複製。
您還可以通過選擇塊並使用快捷鍵 Ctrl+Shift+D 來複製塊。
移動塊
您可以通過拖動塊或簡單地單擊向上和向下按鈕來移動塊。
將鼠標懸停在您的塊上，在左側，您會看到兩個向上和向下按鈕以及中間的一個按鈕。
單擊向上/向下按鈕將向上/向下移動塊。 或者您可以單擊中心按鈕將塊拖動到您想要的任何位置。
刪除塊
要刪除塊，請單擊塊設置並選擇刪除塊選項。
您也可以使用快捷鍵 Shift+Alt+Z 刪除塊。
創建可重用塊
塊編輯器的一大特色是可重用塊的概念。 可重用塊基本上是可以保存並用於其他帖子的塊。
這是一個非常有用的功能，因為您現在可以保存塊並重複使用它們。
要創建可重複使用的塊，請單擊塊設置並選擇“添加到可重複使用的塊”選項。
然後，為要保存的塊命名，然後單擊保存按鈕。
這會將您的模塊保存在 Gutenberg 模塊庫中。
現在，每當您想在其他帖子中使用可重複使用的塊時，您都可以像插入任何其他塊一樣插入它。
您還可以在塊管理器頁面上管理可重複使用的塊。 在此頁面中，您可以編輯或刪除您的塊。 您還可以導入或導出塊。
向塊編輯器添加更多塊
塊編輯器中提供的默認塊非常棒，可以幫助您創建漂亮的帖子和頁面。
但是，如果你想更進一步呢？
值得慶幸的是，塊編輯器允許開發人員開發自己的塊。 這導致開發人員創建了一些非常棒的 Gutenberg 塊插件。
一個這樣的插件是 Ultimate Blocks。
這個塊插件是為那些想要為他們的博客文章增添趣味並使其更具吸引力的人而設計的。
該插件帶有超過 15 個塊。 一些值得注意的塊是：
- 內容過濾器
- 審查
- 目錄
- 呼籲採取行動
- 點擊推文
- 社交分享
- 倒數
Ultimate Blocks 非常易於使用且速度非常快。 使用此插件，您可以在帖子中添加一些獨特的塊並增加您的參與度和社交分享。
結論
因此，我們的 WordPress 塊編輯器指南到此結束。 我希望本指南能幫助您更好地學習和理解古騰堡。
如果您對這個編輯器完全陌生，那麼我給您的最佳建議就是嘗試一下。 你會習慣使用這個很棒的編輯器。
而且，如果您對這篇文章有任何疑問，請隨時在下面的評論部分中提問。
一個插件來替換它們。
Ultimate Blocks 是一個免費的 Gutenberg Blocks 插件，有 18 個以上的塊。