Divi 5 Public Alpha 13: Two New Features In The Works!

The Divi 5 Public Alpha is available for use on new websites. If you use Divi 5, you’ll notice an update notification for Public Alpha Version 13. We release new Divi 5 versions every two weeks, and it gets better each time! If you haven’t tested Divi 5 yet, try it and let us know what you think.

What’s New In Public Alpha 13?

We implemented 38 bug fixes and improvements, one new feature (Nested Rows), and made significant progress on four upcoming features.

Bug Fixes & Improvements

This version includes a handful of minor fixes and improvements. We are tracking every bug reported and tackling them one by one. In total, we merged 38 bug fixes and improvements. I listed every change in the changelog below, but here are a few highlights:

1. Improved Backward Compatibility: One of our main focuses is improving backward compatibility so that Divi 4 modules can be used with Divi 5 more reliably. We fixed some issues where third-party modules were causing the builder to crash.
2. Improved WooCommerce Support: Another primary focus is finishing Woo modules, which also involves fixing WooCommerce-related bugs and improving performance. One thing you’ll notice, when combined with our backward compatibility efforts, is that Divi’s existing legacy WooCommerce modules are functioning much better.

Feature Progress

We’re moving full speed ahead with feature development. We have six teams working full-time on Divi 5. Here is what they’re up to. 👇

1. Team One: This team fixes bugs and assists Divi Marketplace creators with module conversion. Divi-Modules recently announced that three of their most popular modules have been updated for Divi 5. That’s great!
2. Team Two: This team is working on Woo modules, the final feature for Divi 5 to enter beta.
3. Team Three: This team is improving backward compatibility with Divi 4 modules in preparation for the Divi 5 beta.
4. Team Four: This team is working on a new Flexbox layout system for Divi. They’ve developed 50% of the feature so far.
5. Team Five: This team completed Nested Rows, which was released last week. They are now working on a previously unannounced feature: Relative Colors. Keep reading to learn more.
6. Team Six: This team is working on Module Groups. They’re almost finished and we plan to release it this week.
7. Team Seven: Wait, didn’t I say we had six teams? I’m throwing my hat in the ring during this sprint! There’s a feature I’m itching for, so I’m building it in my free time. I’m almost done. Keep reading to find out what it is.

Here is the progress we’ve made since Public Alpha Version 12.

Nested Rows

We finished this feature and released it in Divi 5 Public Alpha 12.1. 🎉

With Nested Rows, you can put rows inside of rows, with infinite nestability, allowing you to create complex new layout structures.

We also added new column sizing options. Give it a try today!

Flexbox Layouts

We started working on Flexbox Layouts and Controls a couple of weeks ago, and we’re already 50% finished with the feature! 🙌

This is one of the most critical features of Divi 5, and it will unlock an incredible amount of flexibility when it comes to building new layout structures and controlling the ordering and wrapping of internal elements.

Module Groups

We gave a sneak peek of Module Groups last week. And guess what? It’s almost done! We plan to release it this week.

This final container element, in combination with nested rows and flexbox layouts, will complete the full vision of Divi 5’s layout system.

Furthermore, module groups will play an essential role in Divi’s future query loop builder, making it possible to loop groups (in addition to all other container elements).

Relative Colors With HSL Support

It’s another surprise feature! 🤩 The team that finished Nested Rows is working on something new. Relative Colors will introduce a new color field component with HSL support, allowing you to create relative colors based on Divi Design Variables.

HSL stands for hue, saturation, and lightness, and it defines a color by its position on the color wheel (hue), intensity or vividness (saturation), and brightness (lightness). In CSS, it’s written like hsl(0, 100%, 50%), where 0 is the hue in degrees (0–360), 100% is the saturation, and 50% is the lightness.

However, the real beauty of HSL is that it supports nested colors. You can create a color based on another color, shifting the original color’s hue, saturation, and lightness. Combined with Divi’s new design variable system, it will allow you to create a mathematically beautiful color system based on your base set of color variables.

Attribute Management

It’s another surprise feature! 🤩 Attribute Management will introduce a comprehensive system for copying, pasting, and resetting attributes, including presets, styles, and content.

You can selectively copy, paste, and reset different attribute types at the element or group levels.

We’re building the most comprehensive attribute management system of any page builder, considerably speeding up your workflow.

WooCommerce Modules

We’re making good progress on WooCommerce modules. There are many modules to convert, but every time we convert a module, the next one gets finished faster. Progress is ramping up, and we aim to finish the first module batch within the next month or so.

In the meantime, you can use Divi 5 with WooCommerce’s standard product templates and blocks. You can also use Divi 4’s WooCommerce modules in backward compatibility mode while you wait for the official versions to be finished.

Changelog

Here is a list of all the changes implemented in Public Alpha 12.

• Fixed disabling scroll effects on smaller breakpoints, which doesn’t disable the effect if the effect is enabled in larger breakpoints.
• Added tests for some option group preset functions.
• Fixed an issue where switching between Module or OG presets without saving or canceling edits did not properly discard unsaved changes or close the preset editor.
• Fixed an issue where unsaved changes were not discarded when switching modules or OG presets. Active editors close automatically, and any unsaved changes are properly discarded.
• Introduced new hooks to filter default and printed style attributes on the server side.
• Fixed the Icon module’s icon picker expand icon and the Icon label help icon overlapping issue on hover on the Icon modal in the settings panel.
• D5 WooCommerce Modules: Improved compatibility with WooCommerce by abstracting template rendering into modular, dependency-managed components.
• Fixed the issue with error messages for Global Color in the Variables Manager modal.
• Fixed the Global String Variable’s string, which is not a sanitized issue.
• Added a new reusable custom WooCommerce product select field in module packages under options to be used in WooCommerce modules for the select field under Content in the Content panel.
• Fixed Global variables are now correctly resolved for icon size settings in Accordion and Toggle modules.
• Added the group structure to the layers view model.
• Fixed an issue where Button Border values in the Theme Customizer caused errors due to inconsistent data types.
• Fixed duplicate animation options appearing in module and option group presets.
• Fixed the vertical alignment issue of the numeric GV label validation error.
• Updated module to auto-open “Add Module” after adding a Group.
• Fixed an issue where the app could freeze when switching between different Global Variable types by properly ignoring archived items.
• Fixed an issue where we can still add the deactivated module.
• Created workflow file for the devalpha index page.
• Fixed range field’s value being unnecessarily cleared when it matches the default value.
• Fixed an issue where group presets couldn’t be used in the transform field when they contained global variable values.
• Fixed the Image module’s missing hover icon issue on the Front-end.
• Updated Woocommerce plugin version in the PHP test guide.
• Added the required WordPress version.
• Optimized shortcode module rendering in the Visual Builder when the WooCommerce Plugin is active.
• Create a Developer Roadmap page for 3rd party developers’ related tasks.
• Introduced Nested Rows and column sizing options.
• Added new tutorial for converting D4 custom module settings to D5.
• Slider and Fullwidth Slider module’s background, Title Text, Button, Sizing, Animation, and Visibility are fixed for the OG preset.
• Fixed a bug in the method that identifies metadata for Divi core modules.
• Removed roadmap files from the generated dir and updated roadmap items.
• Fixes several third-party plugins crashing the Divi 5 builder.
• Fixed an issue where modules were not visible in the Role Editor when using Divi Builder 5.
• Fixed the border radius settings value input field alignment on the settings panel.
• Fixed gutter width range slider visibility when using option group presets with custom gutter width enabled.
• Improved isNestedModule() selector function performance.
• Fixed a memory leak issue caused by redundant serialization of cached values in DynamicData.php.
• Added explanation page for Style::add with use cases and functionality examples.

The Divi 5 Release Schedule

It’s important to note that Divi 5 is production-ready for use on new websites today! Due to the scope of the Divi 5 project, we took a non-traditional approach to its release schedule, releasing it in five phases. The ultimate goal is to make Divi 5 as helpful as possible, as soon as possible, to as many people as possible.

We are in the Alpha phase, akin to “Divi 5 Lite.” It’s missing a few features, but what’s done is ready to be used. It’s far superior to Divi 4 in almost every way. If you prefer Divi 5, you can use it to build new websites.

If an existing website depends on a feature that hasn’t been added to Divi 5, you should continue using Divi 4. WooCommerce modules are the only things missing. Even then, Divi 4’s legacy WooCommerce modules will still work in Divi 5 in backward compatibility mode.

When Will Beta Be Ready?

We aim to enter beta within ~3 months based on our progress. There are three things we want to accomplish before entering the beta phase, and half of our team is focused on these tasks:

1. Improved Backward Compatibility – Divi’s backward compatibility system allows legacy modules like those from the Divi Marketplace to function alongside Divi 5’s new modules. We are actively improving this system with the goal that all existing websites will be able to upgrade to Divi 5 without any changes to their website.
2. Full WooCommerce Module Support – Divi’s WooCommerce modules haven’t yet been converted to the Divi 5 format. You can use them in backward compatibility mode, but you may experience some quirks. We are actively developing WooCommerce modules with each alpha release.
3. Continued Bug Fixes And Improvements – We have a team dedicated to fixing the bugs reported during the alpha phase, ensuring that Divi 5 is stable before the official release. We don’t want the Divi 5 alpha to feel like an alpha, or the beta to feel like a beta.

When Will Divi 5 Be “Officially” Released?

Divi 5 will reach its “final form” before the end of the year, with the ultimate goal of leapfrogging the competition before the year ends. Part of that goal involves aggressively developing new features as part of the feature swap.

But don’t forget! Between now and then, you can use Divi 5 whenever it becomes your preferred experience. Instead of rushing to a final release, we’re maintaining both Divi 4 and Divi 5, giving users a choice.

Once we’re confident in removing that choice, we’ll make it “official,” and everyone will get the Divi 5 upgrade notification.

Jump Into Divi 5 Today

The Divi 5 Public Alpha is available today. Give it a try, and let us know what you think!

If you find a bug, report it to our team, and we’ll fix it. We’ll continue to work aggressively to add new features and address feedback.

Stay tuned for a new Divi 5 version every two weeks.