WordPress 全站編輯是什么？多圖演示，深入講解！

WordPress 全站編輯功能現(xiàn)在已經(jīng)默認開啟了，當你安裝了全新的WordPress以后，你會發(fā)現(xiàn)，后臺的外觀部分已經(jīng)做了很多調(diào)整，甚至于你連小工具入口都找不到了，這是因為WordPress自帶的默認主題已經(jīng)是區(qū)塊主題，不再是傳統(tǒng)的經(jīng)典主題了。

那么對于 WordPress 全站編輯（現(xiàn)在也叫站點編輯），你了解多少呢？今天WordPress大學就轉(zhuǎn)載一篇來自 Smashing 的超詳細的教程，一起來看看吧！

---

全站編輯（Full-Site Editing）是 WordPress 5.9 版中添加的主要改進之一。它允許用戶通過圖形界面對其網(wǎng)站設(shè)計和布局進行全面更改，從而使 WordPress 更接近頁面構(gòu)建器的體驗。此外，它還提供了創(chuàng)建和自定義主題的新方法。

這些劇烈的變化不僅對 WordPress 用戶體驗而且對平臺生態(tài)圈的大部分都有很大的影響。出于這個原因，在這篇文章中，我打算深入探討WordPress 全站編輯（或簡稱FSE）。

下面，我將首先介紹什么是全站編輯，并提供有關(guān)如何使用它對您的網(wǎng)站進行更改的教程。我還將檢查它為主題開發(fā)提供的工具，并討論此功能的到來將如何影響開發(fā)人員、主題作者和現(xiàn)有的頁面構(gòu)建器插件。

讓我們開始吧。

說明：雖然 FSE 在 5.9 版中首次添加到 WordPress，但此后WordPress 6.0進一步增強了它。這篇文章包括最新的變化。

什么是 WordPress 全站編輯？

簡而言之，全站編輯意味著 WordPress 現(xiàn)在可以在基于塊的圖形用戶界面中創(chuàng)建和編輯頁面模板和元素，如頁眉和頁腳。

這是 Gutenberg 項目第二階段的一部分，也是從 WordPress 5.0 中引入WordPress 塊編輯器開始的開發(fā)的初步高潮。自最初發(fā)布以來，塊工作流已經(jīng)擴展到 WordPress 用戶界面的其他部分。例如，您現(xiàn)在還可以將其用于小部件管理。

全站編輯的主要目標之一是為用戶提供一個單一的工作流程來更改他們的 WordPress 網(wǎng)站。過去，您通常需要了解幾種不同的系統(tǒng)才能創(chuàng)建新菜單、撰寫頁面或發(fā)布內(nèi)容、填充側(cè)邊欄或調(diào)整配色方案。更復雜的更改需要您知道如何編輯頁面模板文件或編寫 CSS。使用全站編輯，您現(xiàn)在可以以幾乎相同的方式對所有內(nèi)容進行更改（即使大部分更改仍然發(fā)生在不同的菜單中）。

對于日常用戶來說，好處是減少了對前端開發(fā)人員的依賴。網(wǎng)站所有者現(xiàn)在可以自己做很多在過去需要技術(shù)印章或?qū)I(yè)幫助的事情，例如更改頁面模板。此外，這些更改現(xiàn)在可以立即在編輯器中看到，而不必在站點的前端和后端甚至代碼文件之間來回切換。

同時，全站編輯使主題開發(fā)人員和設(shè)計人員更容易創(chuàng)建標記并允許更快地制作模板。

主要特點

以下是全站編輯的主要組成部分：

• 頁面模板和模板部分
  核心吸引力是兩個新的編輯器界面，允許您自定義類似于普通內(nèi)容編輯器的頁面布局。您可以四處移動頁面元素，更改它們的設(shè)計（顏色、字體、對齊方式等），并隨意添加或刪除它們。對于頁眉和頁腳等單個模板部分也是如此。甚至可以單獨編輯它們。另外，您可以導出您的模板以將它們作為主題使用和分發(fā)。
• 全局樣式和theme.json
  WordPress 頁面構(gòu)建器插件中的一個常見功能，全站點編輯允許您在一個中心位置為整個站點定義全局樣式，例如顏色和版式。過去，您必須在不同位置更改樣式（例如，定制器和塊編輯器）。FSE 還引入了該theme.json文件，它充當不同 API 的紐帶，并包含基于塊的主題中的大部分樣式信息。
• 模板塊和塊模式
  Full-Site Editing 為 WordPress 和 WordPress 編輯器添加了新的塊類型。其中包括站點徽標等靜態(tài)塊，也包括導航塊、帖子標題和特色圖片等動態(tài)元素。這些根據(jù)其他地方的設(shè)置而改變。甚至還有一個完全成熟的查詢塊，它基本上是 WordPress PHP 循環(huán)。它使您可以在頁面的任何位置顯示帖子列表。每個塊還帶有自己的設(shè)計和配置選項。

聽起來很令人興奮？然后讓我們深入探討如何實際使用這個新的 WordPress 功能。

如何使用全站編輯來自定義 WordPress

下面，我將首先介紹如何以用戶身份利用全站編輯。稍后，我們還將研究是什么使它成為對開發(fā)人員和主題設(shè)計人員有用的功能。

使用 FSE 的先決條件

為了利用全站編輯，最重要的是你有一個至少運行 5.9 版本的 WordPress 網(wǎng)站。您也可以使用較低版本，但您需要安裝Gutenberg 插件并保持最新。

您需要的第二件事是塊主題。這是一個可以利用新功能的主題。稍后我們將討論這些主題與經(jīng)典主題有何不同。目前，一個不錯的選擇是Twenty-Twenty-Two，它也隨 WordPress 5.9 一起推出。我將在本全站編輯教程中使用它。有關(guān)其他選項，請參閱末尾的參考資料部分。

最后，如果您是第一次試用 WordPress 全站編輯，我建議您使用暫存站點或本地開發(fā)環(huán)境。那樣的話，你可以在沒有人知道的情況下犯下你想犯的所有錯誤。

用戶界面概述

當您登錄到您的測試站點時，您可以通過外觀 > 編輯器訪問全站點編輯（另請注意，缺少小部件和定制器選項）。

另一種方法是通過前端 WordPress 管理任務(wù)欄中的“編輯站點”鏈接。兩者都會讓您進入主編輯器界面。

讓我們?yōu)g覽一下此處可用的所有選項：

1. 左上角：讓我們從這里開始，因為它很容易被忽視。單擊 WordPress 徽標會打開一個菜單，用于編輯模板和模板部分。它還具有返回到 WordPress 儀表板的鏈接。
2. 頂部欄：對于以前使用過古騰堡編輯器的任何人來說，這應(yīng)該看起來很熟悉。它包含添加塊和塊模式的選項、在編輯和選擇塊之間切換以及撤消/重做按鈕。您也可以打開當前頁面的列表視圖，選擇不同的模板部件，然后直接跳轉(zhuǎn)到它們。
3. 右上角：包含用于保存更改和在不同屏幕尺寸上預覽設(shè)計的按鈕。齒輪圖標打開整個模板和各個塊的設(shè)置。此外，這是自定義全局樣式的選項。三點圖標包含編輯器的顯示選項、導出模板和模板部件的能力以及對歡迎指南的訪問。
4. 中心：中間是主編輯屏幕。您可以在此處更改頁面模板并使用塊。它也是您的設(shè)計外觀的準確表示，并包含一些用于向頁面添加塊和其他元素的控件。

其中大部分都是可切換的，因此您只能打開那些您真正需要和想要的選項。

全局樣式預設(shè)

如上所述，您可以通過單擊右上角的半黑半白圓圈來訪問此菜單。它提供兩種類型的樣式選項：針對整個網(wǎng)站和針對單個塊。此處具體可用的內(nèi)容取決于您的主題。

對于 Twenty Twenty-Two，您可以選擇排版、顏色和布局。我們將討論下面的內(nèi)容。現(xiàn)在，讓我們轉(zhuǎn)向全局樣式菜單中最激動人心的部分——預設(shè)顏色主題。單擊瀏覽樣式可以找到它們。

在此菜單中，開發(fā)人員可以為整個主題提供樣式預設(shè)。將鼠標懸停在其中一個選項上以查看其顏色和字體方案的預覽，然后單擊一下即可采用整個主題的外觀。

我真的很喜歡這個功能，因為它為用戶提供了同一主題的不同版本，他們可以輕松地將其用作自己創(chuàng)作的起點。這有點像主題與它們自己的子主題一起發(fā)布。您還可以通過單擊頂部的三個點并選擇Reset to defaults返回到以前的狀態(tài)。

全局樣式：排版

當您點擊Typography時，您會進入一個子菜單，您可以在其中選擇是否自定義一般文本或鏈接的樣式。

再單擊一次，您將轉(zhuǎn)到一個小節(jié)，您可以在其中進行實際更改。

如您所見，可以自定義字體系列、大小、行高和外觀，即字體粗細和傾斜度。這里的選項也取決于主題。例如，在Font family下，您只能選擇System Font和Source Serif Pro，因為這些是 Twenty Twenty-Two 附帶的唯一選項。

然而，這也是因為對（本地）網(wǎng)絡(luò)字體的完全支持僅在 WordPress 6.0 中可用，而這個主題在此之前就出現(xiàn)了。

同樣，大小下的數(shù)字表示主題作者設(shè)置的默認值。您還可以選擇單擊右上角的小圖標來設(shè)置自定義值。

行高應(yīng)該是不言自明的。外觀下拉菜單可讓您從列表中選擇字體變體。

如果您選擇這些選項中的任何一個，更改將自動在編輯屏幕上可見。

如果您不喜歡所做的修改，您可以隨時重置為默認值，如上所述。

全局顏色和布局

在Colors下，您可以更改不同元素的色調(diào)（呃！）。

這里有趣的是調(diào)色板選項，主題可以在其中提供自己的調(diào)色板，包括漸變。這不包括古騰堡提供的默認選項和用戶可以創(chuàng)建的自定義顏色。

除此之外，就像排版一樣，主題為可以更改顏色的元素提供了不同的選項。在二十二十二中，這是背景、文本和鏈接。

選擇其中任何一個后，您將進入一個屏幕，您可以在其中輕松地從可用選項中選擇顏色或漸變或創(chuàng)建您自己的顏色或漸變。當您這樣做時，您的選擇會自動轉(zhuǎn)換為您在編輯屏幕上看到的內(nèi)容。

甚至還有一個顏色選擇器，可讓您設(shè)置自定義色調(diào)或輸入 RGB、HSL 或 HEX 格式的顏色代碼。

最后，在這個主題中，布局選項只允許您在主頁周圍添加填充。

更改單個塊的樣式

樣式默認值不僅適用于整個網(wǎng)站，而且您還可以為各個塊設(shè)置它們。為此，您可以在底部的 Global Styles 中找到一個選項Blocks。

單擊它時，您會找到所有 WordPress 默認塊的列表。

依次單擊它們以找到類似的選項，以在每個塊的基礎(chǔ)上自定義它們的設(shè)計。例如，在下面，我將鏈接顏色全局設(shè)置為藍色，但將帖子標題塊（也是一個鏈接）的顏色設(shè)置為橙色。結(jié)果，橙色覆蓋了初始值，并且標題以該顏色出現(xiàn)。

如果你曾經(jīng)使用過 CSS，那么這個原則應(yīng)該非常熟悉。在樣式表的頂部設(shè)置一些站點范圍的標準，然后在層疊中用自定義覆蓋它們。這里也是一樣的。

移動區(qū)塊

更改布局的方式與在主 WordPress 塊編輯器中的方式相同。你在屏幕上看到的一切都是由塊組成的。有些可能組合成組或塊模式，但它們?nèi)匀皇菈K。

因此，您可以根據(jù)需要移動和自定義它們。例如，主頁的主要部分是查詢循環(huán)塊，其功能是提供最新的博客文章。然而，它也由不同的塊組成，即Post Title、Post Featured Image、Post Excerpt、Post Date、Spacer和Pagination。

如果你想改變它的外觀，你可以很容易地做到。例如，您可以單擊“文章特色圖片”塊，然后使用工具欄中的箭頭將其移動到帖子標題的下方或上方。

或者，將鼠標懸停在塊上，然后使用Drag按鈕（看起來像六個點）將其移動到另一個位置。如果您Save在此之后點擊，它將轉(zhuǎn)化為您網(wǎng)站上的設(shè)計。

使用塊選項

除了能夠四處移動它們之外，每個塊還具有自己的設(shè)置。就像在古騰堡內(nèi)容編輯器中一樣，您可以通過右上角的齒輪圖標訪問這些內(nèi)容。選擇塊后，您將在此處看到其自定義選項。

這個地方的可用內(nèi)容取決于您正在使用的塊。例如：

• 文章特色圖片：具有添加邊距、填充和配置圖像尺寸的選項。
• 分頁：控制其元素的對齊方式和方向、換行、顏色，以及是否顯示箭頭、人字形或不顯示任何指示符。
• 文章標題：除了設(shè)置顏色外，您還可以決定標題是鏈接、在新標簽頁中打開還是具有rel=屬性。您還可以控制顏色和排版（包括使用Title Case的能力）并添加邊距。

你明白了要點。請注意，通常隱藏了更多設(shè)置，您可以通過各部分中的加號或三點圖標訪問這些設(shè)置。

此外，當塊被選中時，塊頂部的工具欄中有設(shè)置。你不應(yīng)該忘記那些，因為它們可以是決定性的。例如，在文章標題塊的情況下，您可以在其中確定標題順序 (h1-h6)，這是SEO的一個重要因素。

添加和刪??除塊

當然，您不僅可以自定義可用塊，還可以添加自己的塊。這與在內(nèi)容編輯器中的工作方式相同，并帶有不同的選項：

1. 將鼠標懸停在模板中的空白處，直到出現(xiàn)加號按鈕，然后單擊它。然后從塊列表中搜索或選擇您想要的內(nèi)容。
2. 單擊現(xiàn)有塊并使用頂部欄中的選項按鈕選擇Insert before和Insert after。
3. 使用左上角的加號按鈕查看和搜索可用塊的完整列表，然后將它們拖放到您想要的位置。

在某些地方和現(xiàn)有塊中，您還會找到用于添加更多塊的圖標。此外，您還可以添加塊圖案，但我們將在下面進一步討論。

留下問題，這有什么用？

好吧，這意味著您可以輕松地將靜態(tài)和動態(tài)內(nèi)容添加到主頁。例如，查詢循環(huán)塊上方的標題和段落作為您博客的介紹。

當然，您也可以輕松刪除不需要的塊。只需選擇一個并點擊鍵盤上的Del或backspace按鈕，或通過塊選項將其刪除。

您還可以在頂部打開列表視圖（帶有三條交錯線的圖標）并從那里導航到塊或選擇立即刪除它們。

此選項還可以讓您全面了解當前正在編輯的站點的任何部分的塊結(jié)構(gòu)。

交換和編輯模板部件

模板部件是模板內(nèi)的整個部分，您可以將它們作為一個整體進行交換并單獨修改。在 Twenty Twenty-Twenty 的情況下，即頁眉和頁腳。您可以在右側(cè)的模板選項中或單擊頂部欄中的箭頭時看到它。

模板部分只是頁面上的塊組，因此您可以按上述方式編輯它們。但是，它們的特別之處在于，主題可以提供變體，讓您只需單擊一下即可更改整個部分。

例如，當您在示例中選擇標題時，它將在底部的設(shè)置欄中顯示一個替換選項。

單擊它時，您可以看到主題為該模板部分提供的變體，以及適合的塊模式。

Twenty Twenty-Twenty 有幾個默認選項可供選擇。單擊其中任何一個，全站編輯將自動用新選項替換整個標題。

頁腳也是如此，其中 Twenty Twenty-Two 也提供了一些。

自定義和創(chuàng)建模板部件

要單獨編輯模板部分，請單擊左上角的 WordPress 徽標以打開以下菜單。

在底部，您會找到一個名為Template Parts的菜單項。單擊它可查看您站點上所有可用模板部件的列表。

或者，您也可以選擇一個模板部件并從其選項中選擇對其進行編輯。

在“模板部件”菜單中，單擊右上角的“添加新部件”以創(chuàng)建其他部件。例如，如果您想制作另一個版本的頁腳，這將很有用。很酷的是，當您單擊它時，除了詢問名稱外，WordPress 會自動為您提供頁眉和頁腳模板，因此您不必從頭開始（除非您愿意）。

除此之外，您也可以單擊列表中的現(xiàn)有零件進行編輯。這與在主編輯器中的工作方式相同。模板部件的唯一不同之處在于您在左右兩側(cè)都有手柄，您可以使用它們來縮小和擴大尺寸，以便檢查其在較小屏幕（即移動設(shè)備）上的行為。

就像模板文件一樣，您在此處更改和保存的任何內(nèi)容都將轉(zhuǎn)換為使用該部分的所有頁面和模板。

最后，如果您在主屏幕上設(shè)置了一組塊，您也可以將它們變成模板部件。單擊主屏幕或列表視圖中的選項，然后選擇Make template part。

您需要給它起個名字并選擇它所屬的區(qū)域。當您保存它時，它可以作為模板部件使用。

編輯頁面模板 

在 WordPress 徽標菜單中，還有一個名為Templates的項目。毫不奇怪，它包含您網(wǎng)站上可用的所有頁面模板的列表，從 404 頁面到存檔和單頁到單篇文章。

頁面模板通常是控制不同類型內(nèi)容的基本布局的文件。如果更改模板，該類型的所有內(nèi)容也會更改。使用全站點編輯，您可以編輯現(xiàn)有模板并在用戶界面中創(chuàng)建自己的模板，而不是代碼編輯器。

但是請注意，F(xiàn)SE 僅允許您通過Add New創(chuàng)建標準頁面模板。很快就會有更多內(nèi)容。

在這里（以及模板部分）特別方便的是塊樣板。這些是預先設(shè)計的布局，由幾個塊組成，您可以將其添加到網(wǎng)站頁面以立即創(chuàng)建整個部分。示例包括時事通訊注冊表單、定價表和活動列表，但也包括簡單的東西，如樣式分隔線或帶有引述或標題的圖像。

樣板使您可以快速組合整個設(shè)計。它們也很容易使用！編輯模板時，只需單擊左上角的加號并轉(zhuǎn)到“樣板”選項卡。

通過頂部的下拉菜單過濾模式，例如，按特色樣板、頁腳、頁面或按鈕。如果您找到喜歡的內(nèi)容，只需將其拖放到頁面上即可。您還可以搜索特定內(nèi)容，例如頂部的“標題”，它甚至會顯示WordPress 塊目錄中的塊。

為了獲得更好的概覽，單擊Explore以訪問塊樣板資源管理器會有所幫助。

這會在較大的窗口中顯示塊樣板，并能夠在左側(cè)搜索和過濾它們。單擊您喜歡的樣板會自動將其添加到模板編輯器中，您可以在其中像往常一樣定位和自定義它。

順便說一下，您可以通過單擊“模板”菜單中的三點圖標并選擇清除您為各個模板所做的所有自定義。

添加新的塊模式

除了使用可用的之外，您還可以從樣板目錄添加外部塊樣板。

搜索和過濾您的需求。如果您找到喜歡的東西，只需使用Copy Pattern圖案頁面上的按鈕即可將其放在您的網(wǎng)站上。

之后，回到Full-Site Editing編輯器并粘貼它。然后該樣板將顯示在那里。

如果您喜歡它并且可能想再次使用它，請單擊選項欄中的三個點并選擇Add to Reusable blocks。

這樣，從現(xiàn)在開始，它將在Reusable下的塊菜單中可用。

使用獨立模板編輯器

還有第二種編輯和創(chuàng)建頁面模板的方法，它發(fā)生在普通的古騰堡內(nèi)容編輯器中。它提供的復雜性低于站點編輯器界面（例如，無法訪問其他模板），但工作方式相似。

只需創(chuàng)建一個新的帖子或頁面，然后在文檔設(shè)置側(cè)邊欄中，找到狀態(tài)和可見性下方的模板面板。

在這里，它列出了您當前的模板，并在下拉菜單中提供了其他選項。您可以通過“編輯”按鈕編輯已有的內(nèi)容，或通過選擇“新建”創(chuàng)建新模板。每個打開更有限的模板編輯體驗。

以與站點編輯器中相同的方式編輯和保存模板。您以這種方式創(chuàng)建的任何內(nèi)容也會顯示在全站編輯器的模板列表中。

可用于模板的塊

為了使 FSE 中的模板成為可能，開發(fā)人員添加了許多動態(tài)塊，這些塊可以根據(jù)以下內(nèi)容從數(shù)據(jù)庫中提取內(nèi)容：

• 站點標題、標語和徽標；
• 帖子標題、特色圖片、內(nèi)容、摘錄、作者、頭像、作者傳記、日期、標簽、類別、下一篇和上一篇文章，閱讀更多；
• 發(fā)表評論、單條評論、評論查詢循環(huán)、作者、日期、內(nèi)容、計數(shù)、評論形式、鏈接；
• 檔案標題和術(shù)語描述；
• 查詢循環(huán)、帖子列表、帖子模板、分頁；
• 模板部分。

這些也可以在普通的 WordPress 編輯器中使用。未來版本中還會有更多內(nèi)容，您可以通過 Gutenberg 插件盡早訪問它們。

預覽并保存更改

完成所需的所有更改后，您可以選擇通過單擊右上角的預覽以不同的屏幕尺寸預覽它們。

如果您滿意，單擊Save將使修改永久生效。WordPress 還將列出您的更改將影響哪些模板和模板部分。

這樣，如果您想將它們丟棄在一個地方而將它們放在別處，您可以這樣做。只需取消選中您不想保存更改的那些組件。再次單擊Save，您的選擇將轉(zhuǎn)化為您網(wǎng)站的前端。

面向開發(fā)人員和設(shè)計師的全站編輯

全站編輯對開發(fā)人員來說也是一個有用的工具。您可以使用該界面創(chuàng)建模板，然后將它們導出為文件以添加到主題中并作為主題發(fā)布。

塊主題架構(gòu)快速入門

要利用這一點，您需要注意 FSE-ready 塊主題與經(jīng)典 WordPress 主題具有不同的架構(gòu)。首先，全站編輯的模板和模板部分文件不再包含 PHP，而是帶有塊標記的 HTML 文件。

相反style.css，樣式主要由theme.json. 您可以在此處為塊編輯器和各個塊、樣式預設(shè)以及 CSS 默認值（前端和后端編輯器）設(shè)置樣式。事實上，theme.json它是如此強大，通過修改它，你可以改變整個網(wǎng)站的風格。

theme.json這也允許您在同一主題中的不同全局樣式集（即文件）之間切換。這是一個僅在 WordPress 6.0 中出現(xiàn)的功能。

主要依賴theme.json大大減少了其他地方的CSS。例如，二十二十二style.css只有 148 行長。相比之下，其前身 Twenty Twenty1 的樣式表中有將近 6,000 行。

此外，theme.json使用一種完全不同的標記。然而，您可以僅針對這個文件寫一整篇文章，因此您最好從文檔開始了解詳細信息。

塊主題的最低要求是在templates文件夾中有一個index.php、style.css和一個index.html文件。后者將主題標記為 WordPress 的塊主題。

如果你想添加模板部件，你將把它們放在一個parts文件夾中。有一個functions.php和theme.json文件是可選的。最后，您還可以包含一個用于全局樣式預設(shè)的styles文件夾。例如，這可以包括主題的不同配色方案。

除了更改的結(jié)構(gòu)外，在使用塊主題時，您還可以通過不同的方式創(chuàng)建模板文件。雖然您仍然可以手動完成，但也可以使用新的 WordPress 界面。

使用 FSE 或模板編輯器創(chuàng)建主題文件

如果您想使用頁面編輯器來創(chuàng)建模板，第一步就是按照本文第一部分中的描述簡單地設(shè)置您的模板。這里的一個重要選項是知道您可以使用模板部分塊的高級設(shè)置來更改它們的 HTML 元素類型。

滿意后，您可以一次下載所有主題文件。該選項在更多工具和選項菜單中可用，您可以通過單擊全站點編輯屏幕右上角的三個點來訪問該菜單。

在這里，找到導出選項。它會自動將所有模板和模板零件文件下載為 zip。只需解壓它們，您就可以將它們用于您的主題。

手動創(chuàng)建塊主題模板

當然，也可以手動創(chuàng)建模板文件。為此，您只需要熟悉塊標記。

大多數(shù)情況下，這些只是 HTML 注釋，其中包含前綴為wp:. 其中一些是獨立的。例如，以下是向模板添加網(wǎng)站標題欄的方法：

<!-- wp:site-title /-->

其他的，如段落，功能類似于括號：

<!-- wp:paragraph -->
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<!-- /wp:paragraph -->

您還可以通過slug. 調(diào)用，比如調(diào)用頁腳footer.html如下：

<!-- wp:template-part {"slug":"footer"} /-->

您甚至可以div通過tagName屬性自定義 HTML 標記（默認值：）：

<!-- wp:group {"tagName":"main"} -->

<!-- /wp:group -->

在這里，也可以使用上面的編輯器之一來創(chuàng)建塊，然后如果您不確定，只需將標記復制過來。另外，如果您保存文件然后將其添加到主題目錄中的相應(yīng)位置，它也會顯示在 FSE 編輯器中。

有關(guān)詳細信息，請參閱下面的資源列表。

WordPress 全站編輯對生態(tài)圈的影響

除了提供有關(guān)如何使用全站編輯的教程外，我還想談?wù)勊牡絹韺?WordPress 環(huán)境和在那里工作的人員意味著什么。

開發(fā)人員和設(shè)計師的工作機會

不出所料，一個重要的問題是這種功能是否會消除對專業(yè)開發(fā)人員和設(shè)計人員的需求。當用戶似乎可以自己做所有事情時，還需要它們嗎？

簡短的回答是“是的”。

無論是 WordPress 本身還是頁面構(gòu)建器或頁面構(gòu)建器插件，或任何其他使外行人更容易構(gòu)建自己的網(wǎng)站的技術(shù)的出現(xiàn)，都沒有消除對專業(yè)幫助的需求。這一次也不會發(fā)生。

雖然如今，用戶不需要為每一件小事（如更改顏色或字體）提供幫助，但仍有許多任務(wù)是非技術(shù)網(wǎng)站所有者無法使用可用工具完成的，而且他們需要有人來完成這些任務(wù)為他們。另外，如果您想要獨特的設(shè)計而不依賴成百上千的其他人可能也在使用的模板，您仍然需要設(shè)計師和/或開發(fā)人員。

另外，強大的力量也帶來了把事情搞砸的絕好機會（引用蜘蛛俠的話）。僅僅因為每個人都可以使用工具來制作一個設(shè)計良好的網(wǎng)站，但這并不意味著每個人都可以。設(shè)計不僅僅是技術(shù)能力。

更重要的是，并不是每個人都真的想做這項工作。他們寧愿雇用有技能的人，也不愿從頭開始學習。最后，一個成功的網(wǎng)站不僅僅是“僅僅”設(shè)計，例如 SEO、性能、安全性和維護。

所以，即使建站的障礙少了，也沒有必要認為設(shè)計師和開發(fā)人員是垂死的品種。相比之下，轉(zhuǎn)向新工具提供了大量圍繞它們構(gòu)建服務(wù)和產(chǎn)品的機會。

FSE 對主題市場和主題設(shè)計師意味著什么？

那么主題創(chuàng)作者呢？現(xiàn)在大家是不是都要換塊主題了？

在這里，首先要記住許多主題尚未切換到古騰堡塊編輯器，并且經(jīng)典編輯器上仍有許多用戶。后者也將繼續(xù)工作一段時間，因為至少在 2022 年底之前仍將支持該插件。

此外，上述所有功能都是可選的，而不是強制性的。因此，切換不必是立即的。您甚至可以構(gòu)建不是完整塊主題但能夠使用塊模板的混合主題。默認情況下存在此選項，除非您專門將其關(guān)閉。

然而，從長遠來看，將現(xiàn)有主題轉(zhuǎn)移到 FSE 功能可能是個好主意。這是 WordPress 用戶可能會越來越期待的東西，因為它為他們提供了更大的靈活性和能力來自行定制主題。

同時，如上所述，您還可以使用 Full-Site Editing 以更少的代碼創(chuàng)建主題，從而加快開發(fā)時間。此外，它還提供了新的經(jīng)濟機會。除了主題，主題作者現(xiàn)在可以提供塊和塊模式等擴展，開辟全新的商業(yè)模式和機會。

全站編輯與頁面生成器插件

現(xiàn)有的頁面構(gòu)建器插件可能是最大的問號之一。當 WordPress 可以做很多他們創(chuàng)建的目的時，Divi、Elementor 和 Co 之類的人會生存嗎？

首先，不太可能每個人都會立即放棄他們習慣使用的工具，因此頁面構(gòu)建器插件可能會保留一段時間。此外，其中許多功能目前比 Full-Site Editing 目前形式的功能更強大。保持現(xiàn)有狀態(tài)的另一個原因。

總的來說，這些類型的插件在過去幾年中已經(jīng)非常成熟，以至于它們有時會與主題打包在一起。因此，他們不太可能突然失去所有市場份額。盡管如此，隨著時間的推移，全站編輯可能會逐漸融入其中，尤其是對于將其作為 WordPress 的正常部分了解的新用戶而言。

就像其他人一樣，頁面構(gòu)建器插件必須不斷發(fā)展，以便它們提供 FSE 無法提供的東西以保持競爭力。一種方法是提供一種混合插件來擴展 WordPress 的本機頁面編輯器。Gutenberg 和 Classic Editor 已經(jīng)存在類似的東西。

全站編輯：更多資源

如果您想更深入地了解 WordPress 全站編輯的主題，我建議您從這些資源開始：

• 塊編輯器手冊
  塊編輯器手冊通常是開始任何與古騰堡編輯器和項目相關(guān)的好地方。不要錯過Theme Developer Handbook中關(guān)于塊主題、它們?nèi)绾喂ぷ饕约叭绾蝿?chuàng)建它們的入門讀物。
• Fullsiteediting.com
  由Carolina Nymark創(chuàng)建的 FSE 專用資源站點和免費在線課程。它包含有關(guān)全站編輯的每個部分的章節(jié)，從基礎(chǔ)知識到如何使用theme.json甚至是入門塊主題生成器。此外，它還有一個可用塊主題列表。
• WordPress 主題目錄：塊主題
  說到塊主題，官方 WordPress 目錄現(xiàn)在有一個與全站編輯兼容的主題標簽。這樣，您就可以輕松找到一些來試用該功能。一直在增加更多。

關(guān)于 WordPress 全站編輯的最終想法

全站編輯是 WordPress 發(fā)展過程中激動人心的新篇章。它使整個平臺的設(shè)計過程更簡單、更統(tǒng)一，為內(nèi)容創(chuàng)建者和用戶提供了自定義頁面的新機會。

同時，F(xiàn)SE 為開發(fā)者和主題設(shè)計者帶來了有趣的挑戰(zhàn)。它改變了主題的架構(gòu)并引入了新的標記和工作流程。然而，該功能還提供了新機會方面的回報，以及一種更快的原型設(shè)計和創(chuàng)建需要更少編碼的主題的方法。

以上，我們詳細介紹了 FSE 必須提供的所有內(nèi)容。我個人的印象是它是一個經(jīng)過深思熟慮的功能，它已經(jīng)可以做的事情給我留下了深刻的印象。我絕對建議將其添加到您的WordPress 技能組合中。

當然，還有改進的余地。例如，我找不到更改鏈接和其他元素的懸停或活動顏色的選項。此外，它不如現(xiàn)有的頁面構(gòu)建器插件強大，但我相信新功能將在未來縮小差距。然而，我真的很喜歡它的模塊化和以不同方式定制不同主題部分的能力。我肯定會考慮在未來更多地使用它。你呢？

您對 WordPress 全站編輯有何看法？您認為它將如何影響用戶、開發(fā)人員和整個 WordPress 領(lǐng)域？請在評論中分享您的意見！