Introducing Nested Modules For Divi 5

I am excited to introduce Nested Modules for Divi 5, which will significantly enhance the versatility of Divi elements and lay the foundation for an advanced component-based menu builder.

Now, you can add modules inside other modules, with infinite nestability. Build custom layouts inside sliders, tabs, accordions, and everything else. Add a button to your menu, insert an opt-in form into your blog’s grid, and much more.

This is a powerful upgrade. 💪

Check out the following video to see the new feature in action. 👇

Infinite Nestability For All Elements

In the settings panel of all native Divi elements, you’ll find a new Elements option group. Click Add Element to add a new row or module inside the current element.

As shown in the video below, I can add a button to a blurb module or build a custom layout using rows inside a tabs module. In fact, you can add a slider inside a toggle inside an accordion, which, while entirely silly, illustrates the freedom Divi gives you to build anything.

Every Element Is A Flex/Grid Container

We’ve used semantics to give meaning to structure elements, such as rows and columns. Now, any element, including modules, can be a container, and every element comes with the full suite of flex and grid settings to control the layout of its children.

You can apply flex and grid structure templates to anything. As seen in the video below, the structure template applied to my pricing tables module controls the layout of its pricing table items, just like a row can control the layouts of its columns.

A module’s layout options can also control its native content elements. For example, as shown in the video below, if I want to position a blurb module’s image to the left of its text, it’s as easy as setting its flex direction to row.

New Flex Column Options

We added flex column width options to all elements. If an element is inside a flex container, you can quickly use Divi’s pre-built column widths to build a custom layout structure, without using math to calculate optimal width and gap values.

Improved Nested Elements UI

We’ve made it easier to work with nested elements.

  1. Add and Paste Above/Below/Inside: First, you’ll find new right-click options to add elements above, below, or inside elements on the canvas. You don’t need to click the plus button to add elements; you can use the right-click menu, which gives you more control over where the element is added. The same options are available when pasting, allowing you to paste elements above, below, or inside the target element.
  2. Sortable List Interface: The sortable list inside the Element option group gives quick access to child elements.
  3. Improved Drag & Drop: We also enhanced Divi’s drag-and-drop system to allow you to drop elements inside modules, and improved the drag and drop indicators to work better inside grid and flex containers.

Grid & Flex Option Consolidation

Divi has various modules that had their own grid layout options, including the blog, gallery, and portfolio modules. These legacy “Grid Mode” settings overlap with Divi 5’s new Layout option group, which has a much more comprehensive set of options.

These legacy grid mode options have been deprecated and migrated to the new layout option group’s native grid options.

Similarly, various modules had unique settings to control layout direction, such as the email opt-in module’s “Form Left, Content Right” option.

These options overlap with Divi 5’s flex options in the layout option group, and have been deprecated and migrated to map to the layout option group’s native flex direction settings.

Try Divi 5 Today

Nested Modules for Divi 5 is available today and is one of many features coming to Divi this year.

You can follow along as we progress through the final release of Divi 5 and beyond, with updates every two weeks. Depending on your priorities, you can use Divi 5 now or wait until we add more features, whatever works best for you.

We want you to try it, and if you love it, use it; when everyone loves it, we’ll make it official.

The Divi 5 Beta Begins!

Divi 5 has entered the Public Beta phase, the final phase before its official release.

Divi 5 has been available for new websites for some time, but it was missing a few features that certain existing websites couldn’t live without. Those features are complete, meaning sites can migrate all their legacy Divi 4 modules to the new system and benefit from the countless new features we’ve added over the past year.

Give it a try, and let us know what you think. We’ll keep addressing your feedback before the official release.

Watch this video for all the details. 👇

More Divi 5 Updates Are On The Way

2025 is the year of Divi 5. The tedious work is behind us. We built the super-fast foundation, and now it’s time for Divi to make its comeback.

If you’re here for the Divi comeback, do us a huge favor and let us know by liking this video and leaving a comment. It means a lot to us to see you cheering Divi on, and it’s essential to feed the algorithm and spread the word.

Don’t forget to follow us on YouTube and subscribe to the Divi newsletter so you never miss an update. I’ll see you soon for another Divi 5 feature announcement, which I promise will be right around the corner. 😁

The post Introducing Nested Modules For Divi 5 appeared first on Elegant Themes Blog.


The Tech Zone

Comments

Popular posts from this blog

Character AI: Everything You Need To Know

Perplexity AI: Review, Advantages & Guide (2023)

How to Use Midjourney to Create AI Art in 2023 (Detailed Tutorial)