如何在網格佈局中顯示您的 WordPress 帖子?

已發表: 2022-05-07

您是否希望在網格佈局中顯示您的 wordpress 帖子? 好吧,您剛剛找到了正確的位置,因為在本指南中,我們將向您展示添加網格佈局的最簡單快捷的方法。

儘管現代主題具有大量功能和自定義選項,但仍有幾個主題不包含內置網格佈局。 但幸運的是,有一些方法可以讓您將 wordpress 網站的帖子佈局為網格。

在本教程指南中,我們將向您展示如何以網格佈局顯示您的 WordPress 帖子。 那麼,讓我們深入研究一下。

如何在網格佈局中顯示您的 WordPress 帖子?

基本上,您可以使用多種方法在網格佈局中顯示您網站的帖子。 在本指南中,我們將向您展示兩種不同的方法,例如使用 wordpress 內置功能和使用插件。

那麼,讓我們看看如何在網格佈局中顯示您的 WordPress 帖子

方法 1:在網格佈局中顯示 WordPress 帖子的內置功能

WordPress.com 有兩個不同的內置塊,可以幫助您在網格中顯示您的帖子。 這些是-

  • WordPress.com 博客帖子塊,以及
  • WordPress 查詢循環塊。

如果您有一個啟用插件的站點,那麼在繼續使用這些塊之前,請確保激活 WordPress.com 編輯工具包插件。 所以。 讓我們開始吧。

  1. WordPress.com 博客文章塊

這個簡單易用的塊是專門為那些在 wordpress.com 上託管他們的網站的人創建的。 要使用此功能,您只需創建一個新頁面並執行以下操作 -

  • 單擊編輯器中的插入器 (+) 按鈕。
  • 搜索博客帖子塊並單擊它。
  • 選擇博客文章博客後,您將在編輯器上看到以下工具欄。
  • 從這裡,單擊網格視圖選項。
  • 之後,轉到右側工具欄,選擇塊,您將獲得幾個自定義選項來優化您的網格功能。 例如,更改網格樣式、顯示、特色圖像、後期控制設置等等。
  1. WordPress 查詢循環塊

它是一個核心的 wordpress 功能,它更高級,你可能會發現它比上面的要復雜一些。 但是,使用此查詢循環塊,您可以為網站帖子的網格佈局創建一個完全自定義的模板。 那麼,讓我們從步驟開始——

  • 就像以前一樣,單擊編輯器中的 (+) 插入器圖標。
  • 從搜索欄中搜索“查詢循環”並單擊它。
  • 完成後,您將看到以下工具欄,然後從那裡選擇“網格視圖”選項。
  • 現在,它將以不同的佈局向您顯示您的帖子的預覽。 選擇您的首選。
  • 然後,從編輯器的右側轉到查詢循環塊設置欄。
  • 從這裡您可以自定義文本和背景的顏色、指定帖子類型、按(最新到最舊、最舊到最新、A → Z、Z → A)對帖子排序,以及包含或排除置頂帖子。 事實上,這個查詢循環功能將允許您按類別、作者和關鍵字過濾您的帖子。

因此,這是使用基本的 wordpress 內置塊在網格佈局中顯示帖子的兩種方式。 但是,如果您想做一些非凡的事情來顯示具有更高級功能和易用性的網站帖子,那麼使用插件是您的最佳選擇。 記住這一點,讓我們繼續我們的下一個方法。

方法2:使用插件以網格佈局顯示帖子

插件是最有效、最省時和最簡單的方法之一,它可以使用網格以專業的方式以最精美的方式顯示您的帖子。 使用插件最好的一點是不需要具備特殊的技術和編碼技能。

除了所有這些之外,插件還有許多功能和自定義選項,可讓您以您想要的方式在網格中創建和顯示您的帖子。 因此,對於本節,我們將使用最好的帖子佈局插件 wordpress,即 Gutenberg Post Blocks 插件。 那麼,讓我們開始這個過程——

第 1 步:安裝 Gutenberg Post Blocks 插件

  • 首先,登錄到您的 wordpress 站點,從儀表板轉到插件,然後單擊它。
  • 之後,從下拉菜單中選擇添加新的。
  • 接下來,從右上角找到搜索欄,您需要使用“ Post Block WPQode ”進行搜索。
  • 然後你會看到插件; 現在,只需單擊“立即安裝”按鈕,完成後,只需激活它。

第 2 步:使用 Post Block 插件顯示 WordPress 帖子

現在您已完成安裝和激活過程,讓我們按照這些過程在網格視圖中顯示您的網站帖子。 那麼,讓我們開始吧——

注意:要使用此插件,您需要確保您處於塊編輯器模式。

  • 現在,打開一個新頁面並給它一個標題。
  • 接下來您需要做的是,從您的 Gutenberg 編輯器中單擊 (+) 圖標。
  • 現在,在搜索欄中輸入“post block”。
  • 一旦你得到帖子塊並點擊它。
  • 現在,您的所有帖子都將使用默認的網格佈局進行查看。
  • 因此,轉到右側工具欄並單擊阻止。

從這裡,您將可以使用此插件的所有功能和自定義選項來設計您的帖子塊。

第 3 步:設置網格佈局

現在,從塊部分,單擊全局控制菜單。 這就是全局控制設置的樣子。

現在,是時候將網格佈局添加到您的網站帖子中了。 因此,從帖子佈局選項中,您只需單擊向下箭頭即可獲取所有網格佈局選項。 這個插件有 6 種不同的佈局,包括網格、列表和覆蓋。

因此,選擇可用的 6 個網格選項中的任何一個。 這是添加到網格後帖子的示例。

接下來,您可以設置塊的最大寬度。 然後也可以指定列號; 這意味著將顯示您的帖子的網格。 例如,如果您選擇 6 列,則 6 個方框將在您的網站上以一行顯示。

這還沒有結束; 還有更多選項可用於自定義您的帖子佈局。 您可以調整列和行之間的間隙和圓角大小。 實際上,此插件允許您指定要顯示的帖子總數並選擇要摘錄的最大字數。

第 4 步:自定義查詢設置

現在您已經為您的網站獲得了首選的網格佈局,讓我們體驗並充分利用該插件的更高級功能。 Gutenberg Post 塊插件的這個高級查詢構建器將幫助您進行自己的更改。

在這裡,您可以選擇通過創建類別列表然後為您的帖子設置一個或多個類別來自定義您的帖子類別。

不僅如此,您還可以通過隨機帖子或熱門帖子對帖子進行排序,帖子查詢的升序或降序,指定縮略圖大小以及設置特色圖像的最大高度。

最後,您可以設置一個閱讀更多文本按鈕,或者如果您願意,您可以輸入您自己的話。

第 5 步:進行其他自定義

接下來,您可以通過添加或禁用您認為合適的元素來自定義佈局。 例如,內容可見性菜單提供啟用或禁用帖子佈局中的以下元素。

同樣,您將可以使用大量選項從顏色設置菜單中設置帖子的正文背景、標題、分類、分類背景、元、元圖標、描述、按鈕和佈局上的所有其他元素的顏色。

就像這樣,您可以指定帖子的分頁對齊方式,並使用排版菜單自定義所有標題、元帖子按鈕和其他元素。

第 5 步:發布帖子

完成所有自定義後,發布帖子,現在您可以享受 wordpress 網站博客帖子的新外觀。

包起來

如果您對網站帖子的簡單基本外觀感到厭煩,請充分利用本指南,讓您的網站帖子在網格佈局中熠熠生輝。

儘管 wordpress 中的內置功能運行良好,但是,如果您需要自由和靈活性來創建特殊和創造性的東西,這個 Gutenberg 帖子塊插件可以幫助您。

所以,你去吧。 這就是如何在網格佈局中顯示 WordPress 帖子的全部內容。 我們希望本文能幫助您以網格佈局顯示您的 WordPress 帖子。