使用博客模塊與Divi 5的循環構建器

已發表: 2025-09-06

博客模塊是Divi的內置飼料生成器,可以從開箱即用。它為您提供了一種快速的方法,可以列出標題,圖像,摘錄和元數據的帖子。

Divi 5的新循環構建器採用了不同的方法。您可以使用任何模塊設計該項目,然後將動態內容饋入其中。這兩個工具都顯示循環內容,但每個工具都在不同的情況下發光。知道什麼時候可以節省時間並防止挫敗感。讓我們比較兩者。

訂閱我們的YouTube頻道

目錄
  • 1個迷你詞彙表
  • 2通過博客模塊顯示簡單的帖子和帖子類型供稿
    • 2.1自定義帖子類型:有限但功能性
  • 3個自定義帖子類型 +使用循環構建器的自定義字段
    • 3.1循環構建器的工作方式
    • 3.2自定義帖子類型和自定義字段的示例
    • 3.3自定義佈局的Flexbox
  • 4為您的項目選擇合適的工具
    • 4.1當博客模塊是理想的時候
    • 4.2循環構建器成為必不可少的
  • 5使用Divi構建自己的博客模塊佈局5

迷你詞彙表

對於循環構建器概念的初學者來說,這是一組簡短的術語:

  • 自定義帖子類型(CPT):一種自定義內容類型,例如產品或課程。它的行為就像帖子,但可以擁有自己獨特的領域。
  • 自定義字段:您將字段添加到帖子,頁面或CPT中。食品菜單的示例可能包括價格,評級,麵筋/過敏聲明和辣水平。
  • 中繼器字段:一個存儲單個帖子中的項目列表的字段。考慮可能有效的次級列表。
  • 現場插件: ACF是常見的選擇,但是PODMETA框ACPT工具集也可以使用。

如果您迷失了一些細節,請參閱此詞彙表。但是,一路上我們會讓您簡單。

使用博客模塊顯示簡單的帖子和帖子類型提要

博客模塊是為可識別的博客模式而構建的。它假設了共同的元素,並讓您切換顯示內容,保持設置快速並簡單。

考慮一下博客帖子在WordPress中的工作方式。每個帖子都分享某些常見元素,使其可以識別為博客內容。這些共享特徵包括:

    1. 帖子標題
    2. 特色圖像
    3. 發佈內容
    4. url sl
    5. 作者
    6. 類別
    7. 還有更多

博客模塊的設計考慮了傳統的帖子。標題告訴您帖子涵蓋了什麼。特色圖像添加了視覺吸引。摘錄預覽內容。元數據說是誰寫的以及何時寫的。

Divi的博客模塊自動與這些元素同步。您將其放在頁面上,選擇要顯示的內容。該提要根本沒有自定義查詢工作(除非您想限制所顯示的內容,在這種情況下,如果有內置的查詢工具)。

切換方法使變化無痛。您可以隱藏作者,但請保留日期,顯示圖像或跳過摘錄。小決策會產生快速的結果。

自定義帖子類型:有限但功能性

博客模塊可以顯示普通帖子,並正確註冊自定義帖子類型。

博客模塊帖子類型選擇器內容設置

當CPT反映標準帖子字段時,博客模塊正常工作。當您需要真正的自定義數據時,它會限制。因此,當事情變得簡單時,團隊成員CPT可以工作。

  • 名稱映射到標題。
  • 爆頭/頭像映射到特色圖像。
  • 生物映射到內容。

博客模塊輕鬆處理這種情況。

自定義字段

默認帖子無法共享的任何字段都出現限制。

社交鏈接,認證或多年經驗不會出現在博客模塊中,因為它是為默認WordPress博客文章中的標準字段構建的。對於這些自定義字段,該模塊沒有切換。

自定義佈局

佈局控制也受到略微限制;該模塊按固定順序包裝固定結構中的元素。除非您使用自定義CSS,否則您不能重新排序標題和圖像。您可以通過FlexBox或Block管理每個博客卡的佈局,但是子項目(卡)沒有用於兒童Flexbox控件的尺寸設置(例如縮小或成長以填充)。

博客模塊非常出色,可以快速用於標準卡佈局。如果您有一些創造性的錯誤,您可能會發現自己正在尋找更自定義的東西。

自定義帖子類型 +使用循環構建器的自定義字段

Divi的Loop Builder為您提供了顯示動態內容的不同方法。 Loop Builder無需在具有預定元素的單個模塊的約束中工作,而是使您可以按照您設想的單個Divi模塊構建內容顯示。

使用循環構建器需要更多的思考和準備,但是您不會在博客模塊的方式上受到限制。借助博客模塊,您可以在現有的約束中工作,並儘最大努力。使用Loop Builder,您可以從空白的畫布開始,然後使用Divi模塊的任何組合來構建所需的內容。

循環構建器的工作方式

循環構建器不是一個模塊。它是一個包含您選擇的模塊的容器。當容器設置為“循環”時,它將為每個匹配結果重複。在容器中,您可以放置​​​​圖像,標題,文本和按鈕模塊。

您將每個模塊的內容綁定到正確的令牌。 Divi的UI使它變得非常簡單。圖像指向特色圖像。標題指向標題。按鈕鏈接到帖子URL。

這種模塊化方法可為您提供結構和間距控制。您可以將圖像放在標題上方或旁邊。您還可以為兩個自定義字段添加兩個文本塊。這樣,您可以構建所需的卡,而不是通過模塊預配合的卡。

定制帖子類型和自定義字段的示例

讓我們用幾個快速場景製作混凝土。我們將保持模式並交換字段。讓我們使用上一個示例中的卡設計,看看如何使用自定義帖子類型和自定義字段對其進行調整。

博客發布卡示例使用循環構建器

首先,為標準博客文章構建自定義循環。使用標題,類別,發布日期和特徵圖像的標準字段使用“郵政類型”的“帖子類型”。將每個映射到設計中的各個模塊。這些使用標準的後字段,但以獨特的佈局排列。

對於一些簡單的房地產清單,我們可以做類似的事情。使用相同的卡片佈局,我們可以從定制帖子類型中填充內容,並將標題分配給屬性標題,分配給臥室,浴室和屬性說明的文本模塊以及綁定到屬性列表URL的按鈕。

最終結果看起來像我們的博客卡,但使用了循環構建器從自定義字段和自定義帖子類型中分配內容的能力。

Divi循環構建器的房地產清單卡的前端

所有這些關於CPT的話題,您如何製作這些話題?高級自定義字段(ACF)是這裡的首選。 POD,META框,ACPT和工具集還會創建循環構建器可以讀取的字段。使用適合您的預算,經驗和堆棧的內容。

房地產網站的註釋:您需要使用專用插件,該插件將列表從IDX中刪除到WordPress中。這樣,您就可以擁有新的數據和最少的手動工作(沒有人希望每天早上手動輸入屬性)。

自定義佈局的Flexbox

Flexbox自然與循環構建器對。您可以在兩個層次上使用它,以實現無定制CS的干淨,響應式結構。

首先,樣式外循環容器。選擇循環父容器。打開Flex佈局。將方向設置為行。如果需要多個撓性行,請啟用包裝。設置縫隙以控制項目之間的間距。然後,使用尺寸選項調整循環座位的子容器的尺寸。您可以在容器flex控件和子彈性控件之間為循環元素創建響應迅速而有吸引力的佈局。

其次,樣式的內卡佈局。選擇循環項目內的根容器(例如,列或組模塊)。在佈局選項中,如果您需要並排一些元素,請將彈性方向設置為行。設置圖像模塊的寬度,以佔用容器中的空間的一半。讓文本區域(在這種情況下,一個內部有各種模塊的組容器)填充其餘部分(成長以填充組模塊尺寸選項)。

您可以根據需要安排各種容器或模塊。您沒有鎖定進入預配置的佈局。在這裡,我們將標題放在左組中,並將右組設置為Flex列。這為我們帶來了佈局的細微而獨特的變化。確實不乏可能性。

為您的項目選擇合適的工具

這與原始功能無關,而更多地是找到合適的合適性。選擇滿足要求的最快路徑。需要更改時切換工具。有時,博客模塊會解決問題,但是如果沒有,則與循環構建器有一個很強的樞軸。

當博客模塊理想時

當內容遵循標準的帖子模式時,訪問博客模塊。標題,特色圖像,摘錄和基本元是其最佳位置。基本新聞網站,公司更新和簡單的投資組合資格。訪問者期望傳統的佈局,您可能需要使用最少設置的可靠解決方案。

使用博客模塊,您可以在幾分鐘內發貨。較少的活動部件也意味著破壞事物的機會更少(或感到困惑)。

可能仍然在“循環”概念上丟失的非技術用戶仍然在很大程度上依賴博客模塊。這是一個很棒的工具,應該絕對使用。

當循環構建器成為必不可少的時候

當您需要帖子沒有的字段時,或者您的卡結構與庫存模式不符時,請使用循環構建器。電子商務,房地產和教育是典型的行業,往往需要更多的自定義。每個都需要在自定義字段中使用的詳細信息。當您使用更多內容或更多類型的內容時,佈局往往需要更多的靈活性。

當內容關係變得複雜時,請使用循環構建器。您可能需要在一個視圖中混合帖子類型並顯示中繼器的內容。

使用Divi 5構建自己的博客模塊佈局

Divi的博客模塊仍然是運送標準提要的最快方法。 Loop Builder解鎖自定義卡,自定義字段和中繼器。循環構建器也可以被定制並模製成您想到的確切佈局和設計,而博客模塊在那裡有一些限制。

關於此決定的最好的部分是,您可以將同時保留在工具包中,並根據工作選擇。 Divi 5聚在一起,比以往任何時候都更強大(穩定)。如果您還沒有使用過,請在下一個網站上嘗試一下。公共Beta即將來臨,這意味著現有的Divi網站即將接近批量測試現有網站的遷移。

下載Divi 5learn更多有關Divi 5的信息