用於 Divi 概述和審查的期刊博客工具包
已發表: 2019-05-30Divi 的 Journal Blog Kit 是 Divi Soup 的第三方佈局,具有兒童主題等功能。 佈局本身是由 Divi 構建的,包括一個滑塊、類別和一個帶有懸停效果的博客提要,以創建一個優雅的博客頁面。 它還具有樣式化的側邊欄和您添加到子主題的默認自定義博客文章設計。 通過導入或簡單的複制和粘貼將新功能添加到您的子主題中。
博客套件包括三種不同的博客和存檔頁面佈局。 您可以通過將包含的 CSS 粘貼到主題選項或子主題 CSS 編輯器中來更改全角、網格或內聯佈局。 存檔、類別、標籤、作者和搜索結果頁面遵循與博客頁面相同的佈局。 它還包括 Font Awesome 集成。
博客工具包附帶所有文件和有關如何使用它的說明。 在本文中,我將安裝 Journal Blog Kit,看看它的易用性和功能。
為 Divi 安裝 Journal Blog Kit

解壓下載的文件。 在裡面,您會找到幾個文件,包括用於博客頁面佈局和自定義程序設置的 JSON 文件、自述文件、CSS、PHP、JS 和小部件文件(這些是您可以在子主題中找到的文件類型) .
我建議按照說明查看如何安裝文件,因為它將手動完成。 好在說明書寫得很好,過程也不難。 您需要使用子主題(即使它是空白的)。 如果您將 PHP 文件添加到父主題,則當主題更新時,PHP 文件將被覆蓋。
這是一個佈局和手動安裝文件的優點是它適用於您當前的子主題。 您無需更換子主題即可添加這些新功能。
Divi 文檔的期刊博客工具包

下載文件中提供了指向文檔的鏈接。 單擊該文件會將您帶到博客套件支持頁面,您將在其中找到搜索功能、安裝說明、自定義說明和支持鏈接。 自定義說明顯示瞭如何更改顏色、佈局中的列數和摘錄長度。

單擊安裝說明並按照步驟操作。 這將包括將代碼複製和粘貼到特定位置、通過 FTP 上傳文件以及通過插件導入文件。 每個步驟都有詳細說明。 完成這些步驟需要幾分鐘時間。
Divi 博客頁面的期刊博客工具包

博客工具包將博客頁面佈局包含為 JSON 文件。 此佈局應導入頁面本身而不是 Divi 庫。 該頁面本身使用了一個帖子滑塊、六個號召性用語模塊,以及一個帶有博客和側邊欄的行。 這將根據您使用的 CSS 顯示不同。 讓我們看看每個佈局的功能和佈局。
Divi 滑塊和類別的期刊博客套件

帖子滑塊將垂直點導航放置在左側,並在右側顯示摘錄。 摘錄使文本居中且不透明度較低,因此滑塊的特色圖像顯示出來。 它還包括一個查看帖子按鈕。 當它滑動時,圖像淡入並且摘錄從底部向上滑動。

號召性用語模塊用作特定類別存檔頁面的鏈接。 將鼠標懸停在模塊上會將按鈕的顏色從帶有白色文本的黑色背景更改為帶有黑色文本的白色背景,並添加一個黑色邊框。 我喜歡大膽的黃色。 這是一種向頁面添加類別導航的有趣方式。
顏色來自導入定制器樣式。 您不必使用它,並且可以輕鬆更改顏色。 如果您想訪問原始定制器樣式,則需要先將其導出。
用於 Divi 全寬佈局的期刊博客套件


這是使用全寬 CSS 的博客佈局。 特色圖像在懸停時放大。 它為摘錄的第一個單詞添加了首字下沉。 類別和首字下沉的樣式為黃色。 閱讀更多按鈕的樣式與佈局相匹配。
用於 Divi 網格佈局的期刊博客套件

網格佈局在類別下的一行中顯示兩個帖子。 它包括與全寬佈局相同的樣式,例如特色圖像的懸停縮放、黃色類別和首字下沉以及按鈕樣式。
用於 Divi 內聯佈局的期刊博客套件

內嵌 CSS 顯示博客文章,左側是圖像,右側是文本。 它包括其他佈局的樣式和功能。 在此示例中,我在列表底部截取了屏幕截圖以顯示樣式化的 Older Entries 按鈕。 這個相同的按鈕出現在所有佈局中。
Divi 側邊欄的期刊博客套件

如果您導入小部件設置,它會創建一個帶有多個樣式小部件的側邊欄。 側邊欄包括一個關於我的部分,其中包含標題、照片和描述,以及搜索、類別、檔案、標籤和最近發布的部分。 每個部分的樣式都與佈局相匹配。 我喜歡標題兩邊的黃線。 類別和檔案是下拉框。 標籤是樣式鏈接。
用於 Divi 個人帖子佈局的期刊博客套件

如果您通過 FTP 將帖子文件上傳到您的主題文件,則使用 WordPress 而不是 Divi 構建器創建的各個博客帖子也會進行樣式設置,並添加了許多新功能。 功能包括類別、標題、日期、評論數量和帖子上方的標籤。 該帖子有一個樣式的下沉帽。
帖子後面是樣式化的作者框、帖子導航、相關帖子和样式化的評論框。 評論是級聯的,並包括一個帶樣式的圖標,以表明回復是對另一條評論的回應。 各個部分包括帶有標題的樣式黃線。
Divi Price 的期刊博客套件

Divi 的 Journal 博客套件售價 49.00 英鎊。 它包括使用它所需的所有文件和說明。
- 您可以從開發人員的網站購買 Journal Blog Kit。
Divi 的期刊博客套件
Divi 的 Journal Blog Kit 為您的博客頁面和帖子添加了許多樣式功能。 我喜歡它為博客文章設計樣式,而不必使用 Divi 構建器構建它們。 我也很高興看到一個只關注博客的工具包。 博客並不總是得到足夠的關注。
這些文件必須手動安裝,但我認為這是一個很好的練習,因為它顯示了某些類型的文件所在的位置,並為您提供了一些有關 WordPress 工作原理的信息。 添加文件實際上比聽起來容易。 我添加任何代碼都沒有問題。
我將 CSS 添加到其中一個佈局的子主題文件中,然後刪除了該代碼並將 CSS 添加到其他佈局的主題選項中。 兩者都按預期工作。 CSS、JS、PHP 和所有導入的文件在第一次嘗試時都運行良好。 要返回到您的原始設計或不同的設計,只需更改您的子主題並刪除 CSS。
在佈局中包含子主題樣式功能很有趣。 我喜歡這個,因為它可以與任何子主題或佈局一起使用。 如果您有興趣向 Divi 添加一些新的博客功能,我強烈建議您查看 Journal Blog Kit。
我們希望聽到您的意見。 您是否嘗試過 Divi 的 Journal Blog Kit? 請在下面的評論中告訴我們您對此的看法。
精選圖片來自 M.Stay/shutterstock.com
