WordPress塊主題簡介

[ad_1]

如果您使用 WordPress,您可能已經熟悉 主題. 這些設計元素構成了您網站外觀和一般樣式的基礎。 從 WordPress 5.9 開始,您還可以利用 WordPress 塊主題。 但是,您可能想知道這個新功能是如何工作的。

使用 WordPress 塊主題,您的網站的整個設計都是由塊組成的。 此布局包括您網站上的內容和非內容區域,例如頁眉和頁腳。 因此,使用塊主題可以讓您在不接觸定製器或主題文件的情況下編輯站點的外觀。

😎 在今天的指南中,我們將探索 什麼是 WordPress 塊主題 給你看一些 關鍵例子. 然後我們會解釋 如何使用和編輯塊主題 以滿足您的設計需求。 讓我們開始吧!

#WordPress 塊的介紹 #themes 🧱 🧱 🧱

點擊推文

什麼是 WordPress 塊主題?

不出所料,WordPress 塊主題是由塊組成的主題。 頁面的每個部分都是可調整和可移動的,包括頁眉、頁腳、菜單、徽標和標題等非內容元素。

塊主題是 WordPress 全站點編輯 (FSE) 的一部分。 WordPress 5.9 將這個概念引入了核心軟體。

使用 FSE,您可以訪問新的站點編輯器,使您能夠構建塊布局並對其進行編輯以滿足您的需求。 此外,您可以使用全局樣式對您的主題和整體網站外觀進行全面的設計更改。

👉 總體而言,塊主題和 FSE 可以加快您的設計過程並幫助您在粒度級別上自定義您的網站。 您可以設計您想要的網站,而無需深入了解您的主題文件或玩弄 自定義 CSS.

WordPress 區塊主題的三個示例

您可以通過以下方式找到 WordPress 塊主題 使用 WordPress.org 上的完整站點編輯過濾器

WordPress 塊主題。

由於塊主題仍然相對較新,因此選擇數量有限。 為了幫助您做出更明智的決定,以下是三個最佳選擇的快速概覽!

1. 二十二二

二十二十二是默認的 WordPress 塊主題。 它與 5.9 版一起發布,由 WordPress.org 團隊開發:

二十二十二個 WordPress 塊主題。

2222 圍繞鳥類主題設計,旨在象徵不同網站的多樣性、多功能性和獨特性。 此外,由於主題是為與 FSE 一起發布而開發的,因此針對 塊模式 和模板。

👉 總體而言,二十二十二是適用於不同類型網站的多功能選項。 無論你是 運行博客, 文件夾或電子商務商店,此主題可以幫助您創建一個簡單且可自定義的網站。 最重要的是,它是完全免費的。

2. 區塊庫

如果您正在尋找極簡主義的 WordPress 塊主題,您可以考慮使用 Blockbase。 這個主題來自 WordPress.com 和插件背後的公司 Automattic,例如 噴氣背包

Blockbase 主題

Blockbase 的設計非常簡單。 此設置使您能夠在熟悉 FSE 功能的同時從空白開始構建您的網站。 Blockbase 帶有完全可定製的模板,您可以對其進行調整以滿足您的設計需求。

👉 此外,Blockbase 被定義為「通用主題」。 這意味著您可以使用完整站點編輯器或經典定製器對其進行編輯。 因此,Blockbase 可以成為在經典主題和塊主題之間轉換的絕佳選擇。

3. 托夫

Tove 是另一個超級易於使用的免費 WordPress 塊主題。 雖然這個主題是專門為 咖啡館和餐館,您可以對其進行調整以適應不同的業務類型:

Tove WordPress 塊主題。

Tove 提供了 40 多種塊模式,包括多種頁眉和頁腳變體。 因此,您可以在儘可能短的時間內將帖子和頁面放在一起。 它還具有友好和休閑的設計,可幫助您更好地與客戶建立聯繫。

👉 此外,Tove 是一個非常輕量級的主題。 它不使用任何 JavaScript,並且默認情況下不會在您網站的前端載入圖像。 因此,它可以幫助您優化頁面載入時間並改善您的 核心網路生命力.

如何在站點編輯器中編輯 WordPress 塊主題

有幾種不同的方法可以編輯塊主題並調整其設置。 以下是最常見的三種情況。

  1. 使用全局樣式
  2. 編輯模板
  3. 調整模板部分

1.使用全局樣式

在 FSE 之前,您通常會使用 WordPress 定製器. 根據您的主題,您可能只能訪問幾個或幾個設計設置。 此外,您可以使用自定義 CSS 來進一步自定義您的主題。

但是,使用 WordPress 塊主題,您可以從站點編輯器應用全局樣式設置。 在這裡,您可以輕鬆調整主題的外觀並在整個網站上應用所有更改。 您還可以將這些調整隔離到特定頁面。

要開始使用全局樣式,請導航到 WordPress 儀錶板中的外觀 → 編輯器。 您現在將看到新的站點編輯器,默認情況下它將在您的主頁上打開:

塊主題的 WordPress 站點編輯器。

然後,從右上角的菜單欄中選擇樣式圖標。 您現在應該會看到一個新的設置菜單,您可以在其中自定義主題的排版、調色板和布局:

將全局樣式與 WordPress 塊主題一起使用。

請注意,您還可以調整特定塊的樣式設置。 這些自定義將應用於您網站上的所有相同元素。 例如,您可以編輯按鈕、導航或社交圖標塊。

當您對更改感到滿意時,請繼續保存它們。 您可以隨時返回以編輯主題的全局樣式設置。

2.編輯模板

WordPress 塊主題還帶有內置模板。 這些是特定頁面的自定義布局,例如您的存檔或 404頁. 根據您選擇的塊主題,您可能有權訪問其他頁面。

要從站點編輯器訪問和編輯這些模板,請單擊左上角的 WordPress 圖標。 然後,您可以選擇模板以查看塊主題的可用布局:

WordPress 塊主題的模板。

單擊這些模板之一進行編輯。 在我們的示例中,我們將為我們的網站調整 404 頁面:

WordPress 塊主題的 404 頁面。

請注意,此模板由多個塊組成。 如果您選擇其中一個元素,您可以使用塊設置來自定義其外觀:

為 WordPress 塊主題編輯 404 頁面模板。

請注意,您可以向模板添加新塊並保存設置以應用自定義。 此外,您可以通過返回模板菜單並單擊添加新來創建新模板:

添加具有 WordPress 塊主題的新模板。

您只需將塊添加到新頁面並配置其設置以選擇其顯示位置。 但是,某些主題可能會限制您可以創建的新模板的種類。 如上圖所示,二十二十二隻允許您製作首頁模板。

3.調整模板部分

除了模板,您還可以通過調整模板部分來編輯您的 WordPress 塊主題。 這些是在整個模板中使用的較小元素。 在大多數情況下,您的模板部分將是您的主題的頁眉和頁腳區域。

要編輯主題的模板部分,請打開站點編輯器並單擊 WordPress 圖標。 現在,選擇模板部件並選擇要調整的元素。 在我們的示例中,我們將編輯主題的標題:

在 WordPress 塊主題中編輯模板部分。

您現在可以在右側面板中控制模板部件的設置,包括其對齊方式、方向、顏色和邊框。 您所做的任何更改都將應用於整個網站的標題部分。

與模板一樣,您也可以設計新的模板部件。 只需導航回 Template Parts 菜單並在右上角選擇 Add New:

添加具有 WordPress 塊主題的新模板部分。

例如,您可以為您的主題設計一個新的頁眉、頁腳或通用模板部分。 完成後請確保保存更改。

轉到頂部

立即開始使用 WordPress 塊主題

WordPress 塊主題徹底改變了您設計和自定義網站的方式。 無需依賴 CSS、插件或內置設置,您只需使用站點編輯器將全局樣式應用於您的主題並創建單獨的模板 使用塊.

#WordPress 塊的介紹 #themes 🧱 🧱 🧱

點擊推文

ℹ️ 如果您不熟悉阻止主題,您可以考慮使用二十二十二。 此默認塊主題易於使用,並充分利用了完整站點編輯 (FSE)。 或者,您可以瀏覽 WordPress 主題存儲庫以獲取其他塊主題選項。

如果您不確定塊主題的概念,您還可以找到更傳統的 WordPress 主題,它們仍然可以讓您對您的網站進行大量控制。 例如, 我們的 Neve 主題 是一個輕量級的多用途主題,還可以使用定製器輕鬆定製網站設計的所有部分。 這包括有用的調整,例如拖放頁眉和頁腳構建器。

您對使用 WordPress 塊主題有任何疑問嗎? 在下面的評論部分讓我們知道!

相關文章