Stax 主題塊

概述

自 WordPress 5.0 推出以來，WordPress 有了一個名為 Gutenberg 的新編輯器。 這現在是 WordPress 使用的默認編輯器。

下面是使用默認編輯器時新頁面的示例預覽：

此編輯器包含一組塊和模式，以幫助編輯您的頁面。

快速導航

在帖子和頁面中使用塊

• 如何添加塊
• 如何添加圖案

主題塊

• 導航
• 網站標誌
• 網站標題
• 網站標語
• 查詢循環
• 帖子列表
• 帖子標題
• 後摘錄
• 發布特色圖片
• 發佈內容
• 帖子作者
• 發布日期
• 帖子類別
• 帖子標籤
• 下一個和上一個塊
• 發表評論
• 登入/登出
• 術語說明
• 檔案標題

結論

在帖子和頁面中使用塊

可以通過單擊頁面或帖子中的塊插入器圖標找到塊和模式，如下所示：

一旦您確定了要添加的塊/模式，單擊它將在頁面/帖子中顯示它。

以下是一些截屏視頻，說明瞭如何向頁面/帖子添加塊和模式：

如何添加塊

如何添加圖案

主題塊

Stax 主題旨在完全支持古騰堡編輯器。 因此，您可以選擇使用 Gutenberg 來設計您的帖子和頁面。 該主題向編輯器添加了一組塊，以添加 WordPress 已經提供的內容。

這些塊包括：

在這個文檔片段中，我們將研究這些塊中的每一個以及如何在編輯器中使用它們。

導航

添加到頁面時，顯示如下圖所示：

在塊內，這使您能夠執行許多操作：

1. 選擇菜單

使您能夠從您網站中已創建的菜單中選擇一個菜單。

2.添加所有頁面

單擊時，它會將頁面列表塊或您網站內的所有頁面添加到導航中。

3.開始清空

選擇後，它會呈現一個沒有菜單項的導航，並提供嚮導航添加自定義鏈接的選項。

將子菜單添加到菜單導航項

為了嚮導航菜單項添加子菜單，您需要執行以下操作：

1. 選擇您希望添加子菜單的菜單項。 在我們的例子中，我們將點擊“main”。

2.點擊導航內的“添加子菜單”模塊

3. 完成後，您將看到一個子菜單下拉框

4.單擊框中的“加號”圖標，您將看到一個彈出窗口

在這裡，您可以搜索帖子類型、類別、標籤或任何其他受支持的菜單項，並將其添加為您的子菜單。 您還可以在此處設置自定義鏈接或創建草稿頁面。

在此插圖中，我們將搜索作為帖子類別的“kids”並添加它：

5. 完成後，您現在將看到子菜單顯示和靠近菜單項的下拉菜單圖標，如下圖所示：

您可以通過單擊下拉菜單中的“加號”圖標來添加更多子菜單項。

網站標誌

站點徽標塊使您可以添加代表您網站的徽標圖像。

將塊添加到頁面時，會有許多塊設置，其中之一是替換或重置塊內的默認站點徽標的選項。

此選項有助於將徽標添加到塊中。

該塊還包含如下所述的其他樣式和設置。

風格

默認值：呈現最初上傳的徽標

圓形：為徽標添加圓形邊框，從而顯示圓形徽標

設置

圖像寬度：幫助您根據寬度調整徽標的大小

將圖片鏈接到主頁：啟用後，徽標將鏈接到主頁

在新標籤中打開：啟用“將圖像鏈接到主頁”設置時，此設置可用。 一旦“在新選項卡中打開”選項也被啟用，單擊站點徽標將在新選項卡中打開主頁。

用作站點圖標：此設置將徽標呈現為站點內的站點圖標。

同樣重要的是要注意添加的站點徽標和應用於它的設置將在整個站點內觀察到。

網站標題

站點標題呈現您添加到外觀 > 自定義 > 標題 > 更改徽標 > 站點標題的標題。

該塊還使您能夠指定您偏好的站點標題。 這樣做，也會影響您的整個網站。

該塊確實提供了許多可以在其上應用的設置。 這些包括：

顏色

文本：使您能夠設置站點標題文本的顏色

背景：使您能夠設置網站標題的背景顏色

鏈接設置

將標題鏈接到主頁：啟用此選項後，單擊時站點標題將重定向到主頁。

在新選項卡中打開：僅當啟用“將標題鏈接到主頁”選項時才會顯示此選項。 此選項將有助於確保單擊站點標題後主頁在新選項卡中打開。

排版

大小默認值：幫助調整和設置站點標題字體大小

外觀：使您能夠為站點標題設置字體樣式

字母間距：您可以在此處設置一個有助於增加或減少站點標題上字符間距的值

字母大小寫：幫助確定網站標題的大小寫

網站標語

站點標語塊顯示您已添加到外觀 > 自定義 > 標題 > 更改徽標 > 標語部分的標語。

此塊還允許您設置站點標語或您偏好的站點描述。 這樣做，也會影響您的整個網站。

該塊還提供了許多可以應用於它的設置。 這些包括：

顏色

文本：使您能夠為網站標語/描述設置顏色

背景：有助於為網站標語/描述設置背景顏色

排版

排版設置包含許多選項，其中包括：

大小：有助於設置標語的文本大小

外觀：確定標語的字體樣式

字母間距：使您能夠在標語字符之間添加一些間距

字母大小寫：幫助設置網站標語的大寫

查詢循環

查詢循環塊有助於根據設置的查詢顯示來自特定帖子類型的帖子。

添加到頁面後，該塊使您可以選擇帖子類型以開始新的查詢設置，或選擇查詢循環設置以填充查詢，如下所示：

開始空白

選擇“開始空白”選項後，會為發布結果提供許多佈局顯示變體。 這些是：

標題和日期：選中後，呈現的帖子僅顯示帖子標題和日期

標題和摘錄：選擇後，帖子將僅包含帖子的標題和摘錄

標題、日期和摘錄：帖子中的顯示將包括標題、日期和摘錄

圖片、日期和標題：選擇後，帖子將包含特色圖片、日期和帖子標題

選擇上述任一變體後，您將看到一組選項來自定義您的查詢，如下所示：

顏色

文本：-使您能夠將顏色設置為日期並摘錄到查詢中的帖子

背景： - 在這裡您可以為查詢循環設置背景顏色

設置

從模板繼承查詢：啟用後，查詢設置為運行當前模板的全局查詢。

帖子類型：使您可以從網站中可用的帖子類型中選擇目標帖子類型。

排序方式：幫助指定用於在查詢循環中顯示帖子的特定排列。

粘性帖子：Stax 主題提供了設置粘性博客帖子的選項，稱為“貼在博客頂部”。 查詢循環中的 Sticky Posts 選項有助於確定這些帖子是否包含在其查詢結果中。 此選項還可以幫助僅在查詢結果中呈現粘性博客文章。

過濾器

類別：有助於根據指定的類別限制在查詢循環中呈現的帖子。

作者：根據所選作者限制查詢循環中返回的帖子。

關鍵字：將查詢循環中的查詢設置為由關鍵字過濾器確定。

先進的

HTML 元素：使您能夠為查詢循環中返回的帖子指定包裝器。

附加 CSS 類：此部分可用於添加可用於定位查詢循環塊的類。

選擇

選擇“選擇”選項後，基於帖子的默認查詢結果將呈現在查詢塊中。

與“開始空白”選項類似，左側呈現了一個帶有許多設置的面板，允許您根據自己的喜好自定義查詢。

在 Query 循環中，還有一些選項，如下所示：

這些選項將有助於調整：

• 頁面內查詢循環塊結果的對齊方式
• 查詢循環塊結果中的帖子顯示
• 如何呈現帖子（作為列表或網格）

還值得注意的是，您還可以自定義 Query Loop 塊中的內部塊。 此類塊包括：發布摘錄、發布特色圖片和發布日期。

帖子列表

這是一個類似於“查詢循環”塊的塊，但用於呈現最近的帖子，不包括粘性帖子。

帖子標題

“帖子標題”塊將標題呈現給添加塊的帖子或頁面。

它包含幾個設置，其中包括：

顏色

文本：使您能夠為帖子/頁面標題設置顏色

背景：有助於為帖子/頁面標題設置背景顏色

鏈接設置

當選擇“使標題成為鏈接”選項時，它允許您將資源鏈接到帖子/頁面標題。

在鏈接設置中，您還可以指定鏈接到文章/頁面標題的資源，以及是否在新選項卡中打開文章/頁面標題鏈接。

排版

此部分包含許多您可以使用的排版選項，它們是：

大小：定義帖子/頁面標題的字體大小

外觀：指定帖子/頁面標題的字體樣式

字母大小寫：定義文章/頁面標題的大小寫

字母間距：使您能夠在帖子標題字符之間設置一些間距

後摘錄

帖子摘錄塊有助於顯示添加塊的帖子的摘錄或作為其他主題塊（例如查詢塊）中的組件。

添加到帖子時，該塊會顯示許多可用於調整摘錄樣式的設置。 這些包括：

顏色

文本：使您能夠為帖子摘錄指定文本顏色

背景：允許您為帖子摘錄指定背景顏色或漸變

發布摘錄設置

當啟用“在新行上顯示鏈接”選項時，“閱讀更多”鏈接將呈現在新鏈接上。 另一方面，如果未啟用此選項，則鏈接將顯示在帖子摘錄的內聯。

排版

此設置確定摘錄的樣式。 此處提供了許多選項，包括：

大小默認值：幫助設置摘錄的字體大小

外觀：確定摘錄的字體樣式

字母大小寫：定義摘錄中使用的大小寫

Letter-spacing：允許您在文章摘錄字符之間設置一些間距

發布特色圖片

添加到帖子/頁面時的“發布特色圖像”塊有助於將特色圖像呈現到帖子/頁面。

該塊也是其他主題塊（例如查詢循環）的組件，並且在塊內也是可編輯的。

此塊中還提供了一些設置。 這些包括：

鏈接設置

當啟用“鏈接到帖子”設置時，單擊特色圖片將重定向到包含特色圖片的帖子/頁面 URL。

方面

此設置使您可以指定特色圖像的寬度和高度值。

指定值後，該塊提供了一些關於如何縮放特色圖像的額外選項。 這些包括：

• 封面：圖像將被剪裁以填充整個容器（由設置的高度和寬度值定義的空間），而不會對圖像造成任何失真。
• 填充：此處的圖像將被調整大小並拉伸以填充整個容器。 在這種情況下，圖像會出現明顯的失真。
• 包含：此處的圖像將調整大小以適合其容器的縱橫比，而不會對圖像進行任何剪裁或扭曲。

發佈內容

這是您的頁面/帖子中的默認編輯器塊，負責將內容顯示到帖子/頁面。

您不一定需要在您的帖子/頁面中使用它，因為它默認存在。

帖子作者

帖子作者塊將作者呈現到添加塊的帖子/頁面以及其他作者屬性，例如頭像和署名。

當添加到帖子/頁面時，該塊會顯示許多設置，其中包括：

顏色

文本：使您能夠設置作者姓名和署名的顏色。

背景：幫助定義帖子作者塊的背景顏色/漸變。

作者設置

作者：將作者姓名顯示到添加塊的帖子/頁面

顯示頭像：啟用後，作者頭像顯示在區塊內

頭像大小：幫助根據下拉列表中的預定義大小定義作者頭像的大小，如果啟用頭像顯示

顯示個人簡介：如果用戶有一組個人簡介，則顯示作者的個人簡介

排版

大小：為作者姓名、署名和簡歷信息定義統一的字體大小。

外觀：使您可以根據作者姓名、簡歷和署名信息調整字體樣式。

字母大小寫：確定作者姓名、簡歷和署名信息的大小寫。

字母間距：幫助您定義作者姓名、簡歷和署名信息中字符之間的間距。

發布日期

發布日期塊有助於顯示添加塊的帖子/頁面的發布日期/時間。

Post Date 塊還用作其他塊的組件，例如 Query Loop 塊。

發布日期塊中提供了許多設置。 這些包括：

顏色

文本：有助於將顏色設置為發布日期

背景：有助於將背景顏色/漸變設置為發布日期塊

格式設置

“格式設置”有助於定義呈現日期的格式。

在其中，您可以將塊設置為呈現帖子發布的時間、日期或日期和時間。

鏈接設置

啟用“鏈接到帖子”選項後，單擊日期將重定向到添加了“發布日期”塊的帖子/頁面。

排版

大小：確定日期/時間的字體大小

外觀：幫助設置日期/時間的字體樣式

字母大小寫：使您能夠設置所需的日期/時間大小寫

Letter-Spacing：幫助設置日期/時間的字符間距

帖子類別

帖子類別塊有助於呈現分配給帖子的類別，其中添加了塊。

此塊中存在許多設置。 這些包括：

顏色

文本：使您能夠為帖子類別指定顏色

背景：有助於將背景顏色/漸變設置為帖子類別塊

排版

大小：定義 Post Categories 塊中返回的類別的字體大小

外觀：幫助確定帖子類別的字體樣式

Letter-Spacing：確定類別文本字符之間的間距

字母大小寫：有助於設置帖子類別的所需大小寫

帖子標籤

添加到帖子時的帖子標籤塊顯示分配給添加塊的特定帖子的標籤。

該塊包含許多設置，其中包括：

顏色

文本：使您能夠指定顯示的標籤的顏色

背景：幫助正在為帖子標籤塊設置背景顏色或漸變

排版

大小：幫助設置顯示的帖子標籤的字體大小

外觀：幫助定義帖子標籤的字體樣式

字母大小寫：確定帖子標籤的大小寫

字母間距：幫助設置帖子標籤中字符的間距

先進的

分隔符：提供一個字段來設置用作標籤分隔符的字符或符號

附加 CSS 類：這是一個可選字段，您可以在其中添加自定義 CSS 類以用於定位帖子標籤塊。

下一個和上一個塊

“下一個”和“上一個”塊是兩個不同的塊，有助於導航帖子。

下一個：幫助顯示當前帖子之後的帖子。

上一篇：幫助顯示當前帖子之前的帖子。

這些塊包含類似的設置，它們是：

將標題顯示為鏈接

啟用後，帖子標題將顯示為塊內的鏈接。 以下是未啟用該選項和啟用該選項時的示例比較：

選項已啟用

選項已禁用

當選項“將標題顯示為鏈接”時，它還提供了一個附加設置“將標籤作為鏈接的一部分”，如下所示：

啟用“將標籤作為鏈接的一部分”啟用時，添加到塊的標籤也將成為帖子標題鏈接的一部分。 下面是一個示例說明：

排版

大小：使您能夠為下一個和上一個帖子導航塊定義內容的字體大小

外觀：有助於將字體樣式設置為下一個和上一個帖子導航塊的內容

字母間距：使您能夠設置下一個和上一個導航塊上字符之間的間距

字母大小寫：有助於指定下一個和上一個導航塊的內容的大小寫

發表評論

發布評論塊顯示添加塊的帖子或頁面中的評論。

該塊包含幾個設置。 這些包括：

顏色

文本：使您能夠指定評論的顏色

背景：有助於為帖子評論設置背景顏色或漸變

排版

大小：使您能夠指定註釋的字體大小

外觀：用於指定註釋的字體樣式

字母間距：有助於為註釋字符添加一些間距

字母大小寫：用於定義註釋的大小寫

登入/登出

如果訪客訪問添加塊的頁面或部分，則登錄/退出塊會呈現登錄鏈接或表單。 另一方面，如果登錄用戶訪問添加塊的頁面或部分，則會呈現註銷鏈接。

該塊提供了許多設置。 這些包括：

登入/登出設定

將登錄顯示為表單：啟用時，登錄顯示為表單，禁用時，登錄顯示為鏈接

重定向到當前 URL ：啟用後，成功登錄後，用戶將被重定向到當前 URL 或觸發登錄操作的 URL。

術語說明

術語描述塊在查看檔案時顯示檔案的描述，例如類別、標籤和自定義分類法。

例如，可以將此塊添加到您用於存檔的側邊欄。

塊中有幾個設置。 這些包括：

顏色

文本：幫助設置描述內容的顏色

背景：有助於將背景顏色或漸變設置為描述內容

排版

大小：使您能夠為描述內容設置所需的字體大小

檔案標題

存檔標題塊是顯示查詢對象標題的內置塊。

塊中有幾個可用的設置。 這些包括：

顏色

文本：允許您定義存檔標題的顏色

背景：使您可以為存檔標題設置背景顏色或漸變

排版

大小：幫助正在將字體大小設置為存檔標題

外觀：幫助確定存檔標題的字體樣式

字母間距：使您能夠為存檔標題中的字符設置一些間距

字母大小寫：幫助定義檔案標題的大小寫

結論

Stax 主題包含 20 多個集成主題塊。 這擴展到 WordPress 默認提供的默認塊的數量。 了解如何在您的網站中使用 Gutenberg 塊很重要，因為這是默認的 WordPress 編輯器，並且對經典編輯器的官方支持可能不會很長時間。