Construction layouts in Divi continues to change into extra complicated and intuitive. You’ll be able to now position modules within different modules with Nested Modules. You’ll be able to additionally put rows within rows; those are referred to as Nested Rows.

Each come up with extra design freedom, and each sound lovely an identical while you first listen about them. Alternatively, they perform at other ranges and satisfy other wishes. On this put up, we’ll display you the adaptation and assist you to select the correct characteristic when construction your web sites with Divi 5.

Figuring out Divi 5’s Nested Options

Nested Modules and Nested Rows each increase our design choices in Divi 5, however they paintings in numerous spots inside of our format construction. Sooner than we examine those two options, let’s take a look at what every one does and which controls assist you to make a selection the correct instrument whilst construction.

Subscribe To Our Youtube Channel

What Are Nested Modules?

Nested Modules introduced in Divi 5 on October 24, 2025. The characteristic breaks down the previous barrier that stored modules remoted. You’ll be able to now put modules within different modules as many ranges deep as you wish to have.

Sooner than this replace, a Blurb Module may just best cling its preset parts: an icon or symbol, a name, and frame textual content. Now you’ll be able to upload buttons, bureaucracy, or whole row constructions within that very same blurb. The Tabs Module used to just settle for tab content material. Now, you’ll be able to construct multi-column layouts inside of every tab the use of nested rows and modules.

Each module in Divi 5 will get handled as a flex or grid container. This implies every module comes with format controls. Place kid parts on the other hand you wish to have. Stack them vertically, prepare them horizontally, create grids, or combine approaches.

The Pricing Tables Module displays this neatly. Follow construction templates to keep an eye on how worth pieces show. The Blurb Module can modify its symbol place via converting the flex-direction environment. Those format powers used to belong best to rows and sections. Now modules have them too.

How To Use Nested Modules

Open any module’s settings panel within the Visible Builder. Search for the Components possibility staff. This phase now seems in each and every module, now not simply structural parts like rows and sections.

Click on Upload Component within that staff. You’ll see choices to insert both a brand new row or any other module. Select whichever suits your design.

The interface is helping you set parts exactly. Proper-click on any module to look choices for including content material above, underneath, or within it. Drag and drop works too. The indications display precisely the place your part will land, even within grid and flex packing containers.

If you upload nested parts, they behave like some other Divi part. Taste them for my part. Follow presets. Regulate spacing. Every nested piece will get its personal settings panel with complete get entry to to design controls.

The Layers panel obviously presentations your nested construction. Make bigger and cave in sections to stay your workspace tidy. Title parts to stick arranged, particularly while you nest more than one ranges deep. This turns into vital on advanced builds the place you may have modules within modules within modules.

What Are Nested Rows?

We introduced Nested Rows in Divi 5 on April 17, 2025. The characteristic permits you to position rows inside of different rows with endless nesting features. Stack them as deep as your design wishes.

The construction can lengthen to as many ranges as you wish to have. We additionally added new column sizing controls with this replace. You get precise width changes for each mother or father and nested rows. High quality-tune measurements to create balanced, actual layouts.

Each row in Divi 5 works as both a flex or grid container. This will provide you with the similar format powers in rows that you have already got in sections: keep an eye on alignment, path, wrapping, and spacing at every stage of your construction. Transfer between flex and grid show modes consistent with your format’s wishes.

Those controls, mixed with Nested Rows, come up with entire freedom over content material association. Construct multi-column layouts within different columns. Create asymmetrical grids. Design advanced card layouts. Maintain constructions that in the past required workarounds or uniqueness sections.

Nested Rows paintings along the Flexbox and Grid Structure Programs and Module Teams we constructed into Divi 5. All options mix to assist you to assemble any format construction you’ll be able to consider without delay within the Visible Builder.

How Do They Paintings?

Open the Visible Builder and upload a normal row in your web page. Click on within any column. The choice so as to add new content material seems.

Choose the New Row tab. Column format choices show, identical to including a normal row. Select your construction. The nested row seems within your column.

Every row can use Flex or Grid show mode. Toggle between them in accordance with what your format wishes. Flex works neatly for flowing content material. Grid will provide you with actual keep an eye on over alignment and positioning.

Upload modules to the nested row. Textual content, pictures, buttons, bureaucracy. The whole lot works the similar.

Cross deeper via clicking within a nested row column and including any other row. Stack as many ranges as your design wishes. Every nested row will get complete keep an eye on over spacing, backgrounds, borders, and format settings.

The Layers panel displays the whole construction. Navigate between nested ranges simply. Title your rows to trace advanced layouts.

Nested Modules vs Nested Rows: How Are They Other?

Nested Modules are living within different modules. The latter works within columns. That placement tells you the entirety about what every one does.
While you nest modules, you’re including content material to an current part. A blurb will get a button. A tab will get an entire row construction with more than one columns. You’re packing extra capacity right into a unmarried design piece. That is in particular useful for modules like tabs and FAQs, the place click on capability is concerned.

While you nest rows, you’re subdividing house. A column turns into house to a brand new row with its personal columns. The ones columns can cling extra nested rows. You’re growing layouts inside of layouts, construction advanced constructions with out uniqueness sections.

Right here’s a handy guide a rough desk that can assist you examine the diversities:

Function	Nested Modules	Nested Rows
The place It Is Used	Inside of any module	Inside of any column
Major Function	Upload pieces within modules	Create column layouts within columns
The place To To find	It’s within the parts possibility staff in module settings	Use the New Row possibility when including content material to a column
What It Adjustments	What a module can do and what it has	How house is organized and the way deep the format is going
What It Replaces	Workarounds for module limits	Particular phase layouts
Use For	Including modules within interactive modules (comparable to tabs and FAQs)	Developing multi-column setups, asymmetric grids, advanced card designs

Each paintings in combination naturally. Construct a nested row within a column. Fill the ones nested columns with modules. Nest extra content material within the ones modules. The device stacks infinitely as a result of we constructed every characteristic to maintain other jobs at other structural ranges in Divi 5.

When To Use Nested Modules & Rows

Each options increase what you’ll be able to construct in Divi 5, however the construction you wish to have determines which one solves your format downside. From time to time you’ll achieve for one, every now and then the opposite, and frequently you’ll mix them in the similar design. Let’s stroll via explicit eventualities to get a greater concept:

Use Nested Modules When…

You wish to have to pack extra into an current module. This works when a unmarried design part wishes further capability however you don’t wish to rebuild your entire format.

Doable use instances:

• Testimonial sliders with video opinions: Put a video module within every testimonial slide. Shoppers see the written quote first, then can watch the overall video evaluate. The slider controls the entirety in combination.
• Toggle sections with touch bureaucracy: Construct a FAQ with toggles. One toggle controls your touch shape, whilst any other presentations your location map. Folks can get entry to knowledge and achieve out with out leaving the phase.
• Name to motion containers with countdown timers: Drop a countdown module within your CTA. Restricted-time gives get the urgency part constructed proper in. The timer, headline, description, and button all transfer as one unit.
• Gallery pieces with caption overlays and buttons: Every gallery symbol includes a textual content module for the caption, together with a button to be told extra. Your portfolio items change into interactive with out customized coding.

Use Nested Rows When…

You wish to have to divide house and create construction inside of construction. This comes into play when your design calls for columns inside of columns or when you wish to have to make use of other column preparations at more than a few issues for your web page.

Doable use instances:

• Hero sections with offset content material blocks: Break up your hero into two columns. The left column holds your headline and button. The proper column comprises a nested three-column row appearing fast stats or key options. The asymmetry makes the format pop.
• Product pages with tiered knowledge: Your primary row has two columns. The bigger column will get a nested row with product pictures organized in a customized grid. The smaller column displays pricing and specifications in one stack. Every space will get its personal inside construction.
• Weblog layouts with embedded sidebars: Create a two-column row. The content material column comprises nested rows for various article sections. Every nested row may have its personal column association for quotes, pictures, or callout containers situated precisely the place you wish to have them.
• Footer sections with grouped hyperlinks: Construct a four-column footer. Inside of one column, upload a nested two-column row to separate your social hyperlinks and make contact with information facet via facet, whilst different columns keep unmarried stack.

Check out Nested Rows & Modules In Divi 5 Nowadays

Each options provide the freedom to construct layouts that in the past required workarounds or customized code. We designed them to maintain more than a few duties at other ranges inside of your design. Now you’ll be able to upload extra capacity to unmarried parts or divide house into new preparations. Choose the characteristic that most nearly fits your undertaking.

Grasp Divi 5 and spot how those options trade the way in which you way format issues for your subsequent undertaking.

The put up Using Nested Modules vs Nested Rows In Divi 5 gave the impression first on Elegant Themes Blog.

WordPress Maintenance Plans | WordPress Hosting

read more