如何使用 Divi 模板化您的 WordPress 帖子

已發表: 2022-11-04

如果您想為您的 WordPress 帖子添加一些結構,那麼模板是一個很好的方法。 Divi 是一個流行的 WordPress 主題,帶有內置的模板系統。 在本文中,我們將向您展示如何使用 Divi 模板化您的 WordPress 帖子。 首先,您需要在 WordPress 中創建一個新頁面並選擇“Divi Page Builder”模板。 這將為您提供一個空白畫布。 接下來,您需要在頁面中添加幾個部分。 對於每個部分,您可以從各種預先構建的佈局中進行選擇或創建自己的佈局。 設置好部分後,您可以開始向其中添加內容。 您可以使用 Divi Builder 添加文本、圖像、視頻等。 一旦您對您的帖子感到滿意,您就可以將其發佈到您的 WordPress 網站。 這裡的所有都是它的! 使用 Divi,您可以輕鬆地模板化您的 WordPress 帖子以添加結構和样式。

在本文中,我們將向您展示如何使用 Divi 的 Theme Builder 來設計博客文章模板。 博客文章模板是用於所有(或部分)博客文章的網站範圍的模板。 使用Divi Theme Builder ,您可以輕鬆創建數百個視覺上吸引人的設計(並在整個模板中更改靜態和動態內容的組合)。 博客帖子模板是具有動態內容的預先設計的模板,因此任何新的或現有的帖子都將自動繼承其佈局和設計。 使用 Divi Theme Builder 的內置動態內容功能,可以使用博客文章模板創建博客。 在開始處理項目之前,您必須首先了解要使用哪些模塊以及如何將動態內容合併到模板中。 博客文章模板是使用 Divi Theme Builder 創建的。

通過導航到 WordPress 並選擇 Divi、Theme Builder,您可以創建一個新模板。 通過單擊添加自定義正文按鈕,您可以為帖子模板的正文創建一個新區域。 如果您選擇從頭開始構建選項,您將能夠開始創建自己的軟件的過程。 在簡介設置中,單擊動態內容圖標,然後單擊標題輸入框。 帖子作者動態內容元素可以添加到標題內容。 以下是修改設計設置的說明。 將評論計數添加到 Blurb 模塊作為動態內容功能。

作為動態內容,您可以將 Post Author Profile 圖片作為模塊的圖片。 帖子內容模塊包含帖子的主要內容。 可以以與任何其他模塊相同的方式更新發佈內容​​模塊的設置。 這個特性是必不可少的,因為它決定了應用到哪個類別。 這將能夠從帖子模板中提取同一類別中的所有以前的帖子。 評論將添加到此博客文章模板的最後部分。 評論模塊可以位於單列行的評論字段中。

如果您想保存對佈局或主題生成器的更改,請更新其設計設置。 在設計帖子模板時,請記住所有可用的絕佳選項。 如您所見,我希望本教程是使用 Divi Builder 創建自己的博客文章模板時的一個好起點。 了解帖子模板的結構以及可用的各種工具至關重要。 雖然漂亮的模板可以讓博主專注於內容創建,但它也允許模板為博主完成所有工作。

如何在 Divi 中顯示博客文章?

圖片提供:優雅主題.com

在 Divi 中顯示博客文章的一種方法是創建博客頁面模板。 這可以通過創建一個新頁面並從頁面屬性菜單中選擇博客頁面模板來完成。 應用模板後,博客文章將顯示在頁面的主要內容區域中。

可以在Divi Builder 模塊中找到博客,該模塊旨在顯示博客文章。 可以設置博客模塊的樣式,使其在添加到頁面時更有趣。 Divi Builder 的博客模塊提供了有限數量的樣式選項。 例如,如果您希望博客文章顯示為列表,則必須禁用該模塊。 從博客設置面板的設計塊中選擇全寬選項。 CSS ID 將在 Classes 塊下可見。 使用 left-blog-image CSS 類字段複製左側博客的 CSS id。 您可以根據需要更改上面的代碼。


如果我使用 Divi,我需要古騰堡編輯器嗎?

圖片來源:brandelemental.com

如果您使用 Divi 主題,則不需要 Gutenberg 編輯器。 Divi 是一個 WordPress 主題,其中包括一個頁面構建器工具,允許您創建自定義頁面和帖子,而無需使用代碼。

WordPress 5.0 為平台引入了一個全新的塊編輯器(又名 Gutenberg)。 我們新的 Divi Builder Experience不僅改善了設計體驗,還包括新功能。 在本教程中,您將了解 WordPress 選項、成功集成新 Divi Builder 體驗所需的步驟以及如何在您的 WordPress 網站中使用它。 您可以通過 WordPress 儀表板訪問 Divi 菜單中的主題選項。 可以通過轉到 Builder Options 選項卡並選擇 Advanced 選項卡來啟用經典 (WordPress) 編輯器。 接下來,從可用的三個選項中選擇您希望如何開始設計頁面。 前端按鈕上的構建取代了傳統使用的可視化構建器按鈕。

在前端,它將使用 Divi Builder 來創建視覺上引人注目的設計體驗。 新的 Divi Builder 在其後端包括其所有功能和 Visual Builder。 通過選擇構建器頂部的視圖模式,可以在後端激活視覺構建器體驗。 當您在 Divi 的最新版本中編輯頁面時,返回Classic Divi Builder非常簡單。 Divi Builder 現在擁有以前僅在 Visual Builder 中可用的所有強大新功能。 您必須確保也在後端啟用了 Classic Divi Builder。 此外,必須更新 WordPress 5.0,以及 Divi 的兼容性修復。

可以使用 WordPress 後端上的新 Divi Builder 從頁面編輯器切換回Classic Divi 頁面構建器。 兩者都可以同時使用,但必須確定首選哪一個。 很快,您將能夠在 Gutenberg 中使用您最喜歡的 Divi 模塊或在 Divi Builder 中註冊 Gutenberg 塊。

一起使用 Divi 和 Gutenberg

我應該使用古騰堡編輯器嗎? 你如何使用迪維?
同時使用 Gutenberg 和 Divi 作為編輯器不再需要使用哪個編輯器。 Divi 和 Elementor 都是用戶友好的,並提供了廣泛的設計選項。 如果您更喜歡它的工作方式但想要更大的靈活性,Elementor 可能是 Gutenberg 的一個很好的替代品。 Divi 將允許您選擇最優化的選項和設計選項。
您如何使用古騰堡編輯器?
安裝並激活後,轉到設置並在“允許用戶切換編輯器”選項上單擊是。 在經典和古騰堡之間進行選擇後,您可以在它們之間切換。

Divi 博客文章模板

圖片來源:diviextended.com

您可以通過多種不同的方式創建博客文章模板。 一種方法是簡單地在 WordPress 主題文件夾中創建一個新文件,並將其命名為“blog-post.php”。 然後,您可以將現有 WordPress 主題的“single.php”文件中的代碼複製並粘貼到這個新文件中。 這將為您提供一個可以使用的基本模板。 創建博客文章模板的另一種方法是使用 WordPress Customizer 之類的插件。 此插件允許您創建新模板文件,然後在創建新帖子時從下拉菜單中選擇它。 創建模板後,您可以開始向其中添加自己的代碼,以根據自己的喜好對其進行自定義。 例如,您可能希望將特色圖片添加到您的博客文章模板中。 為此,您需要將以下代碼添加到您的模板文件中: 此代碼將檢查當前帖子是否具有特色圖像集。 如果是這樣,它將在帖子頂部顯示特色圖片。 您還可以將其他代碼添加到模板中以進一步自定義它。 例如,您可能希望在博客文章模板中添加“閱讀更多”鏈接。 php the_content('閱讀全文'); ? > 此代碼將顯示您帖子的全部內容,然後是“閱讀更多”鏈接。 自定義博客文章模板有無限的可能性。 這些只是您可以做的幾個例子。 試驗一下,看看你能想出什麼!

作為本週 Divi 設計計劃的一部分,我們將贈送一個免費的博客文章模板。 您可以前往 WordPress 網站後端的 Divi Theme Builder 下載模板。 當您上傳新模板時,模板中會出現一個名為 All Posts 的新正文區域。 在開始修改模板的元素之前,您應該首先打開它。 這個博客文章模板充滿了動態元素,一旦您安裝它,這些元素就會與您的博客文章一起使用。 要在您的設計中包含電子郵件選項模塊,您必須鏈接一個電子郵件帳戶。 輕鬆將您自己的內容添加到側邊欄,例如文本、按鈕的鏈接 URL 和選擇加入的電子郵件地址。

Divi:最強大的博客解決方案

Divi 是一個強大的博客平台,對於那些尋求博客解決方案的人來說是一個絕佳的選擇。 您可以選擇使用強大的博客模塊在各種頁面上顯示您的內容。 檔案功能允許您將帖子添加到特定頁面並將它們顯示在單個帖子或多個帖子中。 此外,Divi 具有多種附加功能,使其成為出色的博客平台。

Divi Single Post 佈局

Divi Builder 的可視化編輯器使您能夠快速創建可以拖放的單個帖子。 無需與任何一行 HTML 或 CSS 交互。 無論您是為整個網站創建單個帖子佈局,還是根據標籤或類別等標準創建某些帖子/頁面,都會顯示它。