塊模式有可能使在WordPress中發(fā)布內(nèi)容比以往任何時候都更容易、更靈活。

例如，假設(shè)您總是發(fā)現(xiàn)自己在您的帖子中添加了相同的兩個塊。也許是兩個并排的按鈕。如果你以前做過這樣的事情，那么你就知道怎樣才能做到這一點:

添加一個包含兩列的列塊

接下來，在左列中添加一個按鈕塊

然后。向右列添加一個按鈕塊

顯示帶有兩列的輪廓，每列都有一個表示button作為標(biāo)簽的藍(lán)色圓角按鈕。

這就是塊模式被設(shè)計來解決的問題。

塊模式允許您將塊組合成一個組，以便在需要的時候重用，而不是放入多個塊來創(chuàng)建一個元素。WordPress甚至提供了幾種開箱即用的塊模式。

塊菜單作為內(nèi)容編輯器左側(cè)的邊欄打開，Patterns選項卡處于活動狀態(tài)。在模式菜單上方有一個灰色的搜索框。菜單下面是前兩個模式的預(yù)覽，包括兩個按鈕、三個按鈕和列。

以我們的按鈕為例，我們可以將這些塊組合在一起，并將它們保存為一個塊以供以后使用。但在這之前，讓我們先畫出另一個重要的區(qū)別。

塊模式與可重用塊非常相似。

塊編輯器已經(jīng)允許我們完成塊模式對可重用塊的處理:將一些塊作為一個組放入編輯器中，單擊小菜單圖標(biāo)，然后選擇“添加到可重用塊”選項。

太酷了!現(xiàn)在給它一個名字，當(dāng)我們需要兩個緊挨著的按鈕時，我們可以使用它。

那么，當(dāng)可重用塊還可以保存一組塊時，為什么要使用塊模式呢?

一個原因是，當(dāng)你對一個可重用的塊做了一個改變時，這些改變將自動應(yīng)用到任何塊被使用的地方，無論是在同一個崗位上，還是在另一個崗位上。可以將一個可重用塊轉(zhuǎn)換為一個常規(guī)塊，這樣更改只適用于該實例，但這會破壞分組塊的布局，并需要修改一堆內(nèi)容。

另一方面，塊模式是一開始就可以編輯的。它們只是提供了塊的布局，你可以在其中創(chuàng)建和定制你的內(nèi)容。

相關(guān):查看要與事件日歷一起使用的這些塊模式。

如何注冊塊模式

WordPress引入了一個新的register_block_pattern()函數(shù)，就像它的名字一樣，它注冊了一個塊模式，以便你將來可以使用它。它的所有文檔都可以在WordPress.org上找到，所以我們不會在這里詳細(xì)說明。重要的是了解它所需要的論證。這是兩個必需的參數(shù):

標(biāo)題:您將在模式菜單中看到的模式名稱。

內(nèi)容:模式代碼。

描述:一個簡短的描述模式的簡介。

categories:將模式與相同類別中的其他模式進(jìn)行分組。

關(guān)鍵字:告訴WordPress如果在塊菜單中搜索某些單詞應(yīng)該返回作為搜索結(jié)果的模式。這對于使模式更容易被發(fā)現(xiàn)非常方便。例如，在搜索“three”或任何其他單詞組合時，可以找到一個包含一行三張卡片的模式，稱為“cards”。

viewportWidth:這給了你一點額外的控制模式在塊插入器中的外觀，比如將其設(shè)置為全寬項。

首先，讓我們定義一個模式類別。

這是完全可選的，并且只有在您想在一個全新的類別下注冊一個模式時才真正必要。

如果你可以使用其中任何一種，那太棒了!如果沒有，那就創(chuàng)建一個!無論哪種方式，如果你不想分類一個模式，它會自動進(jìn)入一個“未分類”的類別，就像未分類的文章一樣。

正如您所看到的，它實際上只需要一個標(biāo)簽參數(shù)。my-block-patterns的部分只是你插件或主題的命名空間…無論你注冊塊模式的地方。

接下來，在WordPress中創(chuàng)建模式。

現(xiàn)在，我們可以在register_block_pattern()函數(shù)中直接為模式編寫代碼。但這將是對耐心的考驗。在塊編輯器中勾畫模式的草圖，然后將代碼復(fù)制到函數(shù)中，這樣做要容易得多。

首先，創(chuàng)建一個組。然后，在那個組中放下一些積木。接下來，選擇組，打開塊選項菜單，選擇“復(fù)制”選項。

顯示包含兩個黑色按鈕的選定組，在組內(nèi)容上展開選項菜單，選擇復(fù)制選項。

復(fù)制塊復(fù)制塊的HTML和標(biāo)記。這就是我們需要的內(nèi)容參數(shù)寄存器函數(shù)。

但首先……

我們需要對復(fù)制的代碼進(jìn)行轉(zhuǎn)義。

這是正確的。我們不能簡單地把它粘貼進(jìn)去。幸運的是，有一個在線工具可以幫我們擺脫代碼。粘貼到那里，計時“Escape”按鈕，然后復(fù)制它輸出的代碼。

顯示用于轉(zhuǎn)義代碼的在線工具。這里有一個用于粘貼代碼的紋理，需要在包含生成代碼的另一個紋理之上轉(zhuǎn)義。

先拿著這個。我們馬上就需要它。

注冊模式。

我們有一些模式的代碼。我們有一個記錄模式的函數(shù)。現(xiàn)在，讓我們把它們放在一起來創(chuàng)建一個圖案。

開始使用模式!

現(xiàn)在我們可以回到編輯器。打開塊插入器，搜索模式，并從結(jié)果中選擇它。

在塊插入程序中顯示兩個按鈕示例模式，該模式在發(fā)布內(nèi)容的左側(cè)打開。

開始在事件日歷中使用塊模式。

如果我們沒有帶一些模式，這篇文章是不完整的。因此，我們創(chuàng)建了一個小擴展，您可以安裝添加一些模式，以使用與事件日歷。