Divi 5 Public Alpha 11: Release Notes And Feature Progress

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 11 today. 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 11?

I didn’t publish a post regarding Public Alpha 10, so this post will cover everything we have accomplished since Public Alpha 9.

We have implemented 103 bug fixes and improvements, two new features (Option Group Presets and Advanced Units), and made significant progress on three 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 103 bug fixes and improvements. I listed every change in the changelog below, but here are a few highlights:

1. Improved Speed & Click Feedback: Everything in the Visual Builder feels way faster! Why? Because we switched to using mouse down instead of mouse up for most interactions. Now, things respond as soon as you click your mouse; it’s great! For accessibility reasons, buttons still use mouse up.
2. Pressing Enter To Validate Values: We extended the time for fields and validation units and implemented instant validation when pressing enter or unfocusing a field. You don’t have to wait for validation and won’t get auto-validating as often when typing slowly.
3. Preset Cache Clearing: When saving presets and global colors, the complete website cache wasn’t cleared correctly. This was fixed.
4. Disappearing Google Fonts: A weird and annoying bug mysteriously caused Google fonts to dequeue on the front end. That won’t happen anymore.
5. Triple Checking Security: We reviewed Divi 4 security fixes from the past couple of years to ensure we hadn’t made similar mistakes in Divi 5 and then performed a security review. We found a few minor issues and hardened security in those areas.
6. Field Icon Overhal: We redesigned the icons that appear when hovering over fields in the settings panel. Icons previously in-line, such as the Dynamic Content and AI icons, have been moved above the field. All icons are smaller and aligned to the right to make them easier to click.

Feature Progress

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

1. Team One: This team fixes bugs and assists Divi Marketplace creators with module conversion.
2. Team Two: This team is working on Woo modules, the final feature for Divi 5 to enter beta.
3. Team Three: This team has switched focuses and is now 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, a previously unannounced feature. Stay tuned for a sneak peek coming soon!
5. Team Five: This team is working on Nested Rows, which I gave a sneak peek of this week.
6. Team Six: This team is working on Divi Design Variables, which is almost finished.

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

Option Group Presets

We finished this feature and released it in Divi 5 Public Alpha 9.3. 🎉 You can download Divi 5 and try Option Group Presets today.

Option Group Presets are shared styles that can be combined and applied to any Divi module to style your website’s base elements and create advanced design systems. It’s an absolute game-changer; once the concept clicks, there’s no going back.

Advanced Units

We finished this feature and released it in Divi 5 Public Alpha 10.1. 🎉 You can download Divi 5 and try Advanced Units today.

Divi now supports all CSS units, including unitless values such as unset and fit-content, and functions such as clamp() and calc(), making creating responsive designs with fluid typography easier than ever.

You can also define CSS variables and reference them throughout your designs.

Divi Design Variables

We’re 90% finished with Divi Design Variables and hope to release it next week! 🙌 You may hear the phrase “game changer” being thrown around often when describing new features, but this one truly deserves the label.

It’s a bold step in a new direction for Divi and an essential part of Divi 5’s design system, which we are building to satisfy the needs of advanced web designers.

Nested Rows

It’s another surprise feature. 🤩 Earlier this week, I gave a sneak peek at Nested Rows. Rows inside of rows! It’s a simple idea but an important first step in creating a more flexible layout system for Divi 5.

Soon, you will be able to add rows inside of rows, unlocking new layout structures.

Flexbox Layouts

It’s another surprise feature. 🤩 I haven’t given a sneak peek of this one yet, but here is a little glimpse.

We are completely overhauling Divi’s layout system to use flexbox, implementing many new row structures, and surfacing flexbox controls for modules, rows, and sections. You can create every layout under the sun with flexbox and nested rows. Plus, you can control column wrapping, content vertical alignment, responsive column breakdown, and more.

This massive update will take some time, but it will be worth the wait.

WooCommerce Modules

From the outside, progress on Woo modules has appeared to be nonexistent. That’s because we were researching Woo blocks and creating a new CLI tool to greatly reduce the time it takes to convert Divi 4 modules to Divi 5.

A bit of investment will pay off big time in the long run.

The good news is that we completed our module conversion tool this week! This tool automates 80% of the tedious module conversion work. Using this tool, we hope to convert all 20+ Woo modules over the next couple of months, setting the stage for a mid-year Divi 5 beta release.

In the meantime, we continue pushing Divi 5 forward and encouraging adoption with aggressive improvements. Don’t forget that you can use Divi 5 now, even on WooCommerce websites, using standard WooCommerce templates and blocks.

Changelog

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

• Fixed bug with gradients containing global colors not correctly migrated to Divi 5.
• Fixed the image count option not working in the Gallery Module.
• Fixed an issue where global color values could not be saved/applied to page settings while regular colors were saving/being applied correctly.
• Fixed internationalization for some preset labels.
• Updated Map and Map-Pin module to use callbacks for the map field for the auto-generated module settings.
• Fixed an issue where the Number Counter module animation triggered on page load instead of when entering the viewport.
• Improved performance when interacting with the builder’s UI.
• Fixed an issue where the Open Title Text color in Accordion Items reset to default when changing the Title Heading Level on module settings.
• Fixed an issue where the icon was not vertically centered when dynamic content was used.
• The slider and accordion module’s heading level is fixed for module preset and option group preset.
• Fixed an issue with the Divider module not displaying when set to Position: Absolute.
• Fixed sticky background colors were not applying correctly on rows in both Visual Builder and Frontend.
• Updated generated docs index and intro page.
• We fixed the slider module reinit issue by changing the heading level from the settings panel.
• Fixed the expanded icon color visibility issue while we switched the color mood to Dark.
• We updated our input validation to accept incomplete math function rules.
• Updated math function validation for unit picker can now handle nested parentheses in math function value.
• Removed extra ‘docs’ from documentation and update all links.
• Fixed an issue where option group preset edit mode would close prematurely when creating presets from current styles.
• Fixed an issue where option group preset values were incorrectly inherited by module presets.
• Fixed issue: the unit always resets to deg whenever we change the Transform Rotate and Skew value with spinner, dragging, and increment buttons.
• Fixed the issue where default presets based on custom Option Group presets were not applied correctly in the Visual Builder upon initial module addition.
• Fixed Gradient Length units showed undefined.
• Removed unsupported units (ch, ex, cm, mm, inch, pt, pc, calc(), min(), max(), clamp(), cssVar, inherit, unset) to prevent invalid selections.
• We fixed the Firefox browser error issue for the Fullwidth Header module when we enabled fullscreen.
• Removed invalid unit options (unset, inherit, none, clamp) from the Transform OG unit picker to prevent invalid transformations.
• Set the placeholder to empty when the defaultValue is categorically keywordValue, and the unit is changed to a non keywordValue unit.
• Display an error message when an invalid unit is used on the math function.
• Fixed an issue where the Title Text Option Group preset did not apply the correct heading level for Accordion items.
• Fixed an issue where a global color edit cannot be canceled in TB because clicking the cancel button has no effect/does nothing.
• Fixed an issue that prevented temp JSON files from being deleted after importing big pages.
• Properly clean all caches so that style-related changes take effect across all applicable pages after changes to Module Presets, Option Group Presets, Global Colors, and Fonts.
• Fixed an issue where the unit label changes when line height increases or decreases from the unit picker.
• Introduced a dynamic feature flagging system to manage and toggle experimental functionalities in Divi submodules.
• Removed legacy feature flags and their associated code for enhanced maintainability and simplicity.
• Disable the range field’s increment by pressing the arrow up / down when the current value is a math function or CSS variable.
• Introduce new hooks to filter default attributes, default printed style attributes, and placeholder content defined in the module config.
• Fixed a regression in the color picker where it would not open when clicking the Add New Color button.
• Introduced Advanced Units, including support for all CSS units, functions, and variables.
• Fixed a bug where global colors used in presets are not exported when exporting a layout and are unavailable for import when importing a layout.
• Fixed bug with inline Google fonts caching mechanism in Divi 5.
• Fixed an issue where motion effects were not applied to the Bar Counter module.
• Fixed an issue with customizable breakpoints reset too quickly while typing, requiring users to type very fast.
• Assigning the default option group preset will not activate editing mode.
• Fixed a bug causing import to not work when the layout has Divi 5 shortcode modules.
• We updated the relative URLs with @Divi, where we need to import packages in visual builder shortcuts.ts.
• Fixed switching units in the Unit Picker automatically set the field value to 0, causing elements to disappear unexpectedly.
• Fixed a security issue in the custom heading tag.
• Fixed the unit picker error message for the calc unit picker.
• Moved the module settings field’s button to the new position.
• Fixed the Accordion module toggle background color issue while changing the color from the child element level.
• Fixed an issue where the slider goes blank screen while adding a new slide.
• Fixed the inner-row module alignment issue while setting its left margin value for the specialty section.
• Fixed an issue where the field label is not showing on some fields in the component.
• Fixed the Blurb module Title color issue while we set the Text color to Lite.
• Fixed issue with emails not going out to multiple emails separated by commas added in module settings of Contact Form.
• Fixed bug with the Map module if the Enqueue Google Maps Script option is disabled in Theme Options.
• Updated docs, new index page styling, and new CTAs for downloading Divi 5 and joining Discord.
• We updated the manual documentation with outdated information and added a new download link.
• Introduced Option Group Presets.
• Improved performance while loading Pre-made packs in the Onboarding workflow.
• Implemented library items import system with portability in the cloud app.
• Fixed copying/pasting from/to nested module option groups.
• Fixed the priority order of fields in the Scroll Settings group to ensure ‘sticky’ appears before ‘scroll’ across various modules.
• Fixed the post navigation module’s wrong post links using the same category posts.
• Custom callbacks were added to the auto-generated module settings for the Fullwidth Map Module.
• Improved readability by removing unused files.
• Fixed an issue where the tab module was not displayed correctly when a condition was set on the first tab item and returned false.
• We fixed an issue with Width/max-width not working from the Design tab for Position Absolute.
• Fixed an issue where the Slide module did not inherit the transition set in the Slider module.
• Updated all modules to help modal videos.
• Added foundational support for Composite Group handling in Option Group Presets.
• Refactored AGMS to allow custom callbacks to be assigned for Group/Field in respective module index.ts file.
• Fixed the warning related to the Divider module’s right and left padding.
• Fixed an issue where hover state options were incorrectly available for Background and Text Overlay settings in the Fullwidth Slider Module.
• Fixes a security issue that could allow users lacking unfiltered_html capability to set the enable_html Dynamic Content flag via the classic editor.
• Fixed an issue where the Google font search displayed all fonts instead of filtering results based on the search query.
• Added foundational support for Composite Group handling in Option Group Presets in the Accordion Item module.
• Added foundational support for Composite Group handling in Option Group Presets in the Accordion module.
• Added foundational support for Composite Group handling in Option Group Presets in the Blog module.
• Added foundational support for Composite Group handling in Option Group Presets in CountDownTimer module.
• Added foundational support for Composite Group handling in Option Group Presets in the Divider module.
• Added foundational support for Composite Group handling in Option Group Presets in the FilterablePortfolio module.
• Added foundational support for Composite Group handling in Option Group Presets in the Full-Width Menu module.
• Added foundational support for Composite Group handling in Option Group Presets in the Fullwidth post-Slider module.
• Added foundational support for Composite Group handling in Option Group Presets in the Heading module.
• Added foundational support for Composite Group handling in Option Group Presets in the Menu module.
• Added foundational support for Composite Group handling in Option Group Presets in the Post Navigation module.
• Added foundational support for Composite Group handling in Option Group Presets in the Pricing Table module.
• Added foundational support for Composite Group handling in Option Group Presets in the Search module.
• Added foundational support for Composite Group handling in Option Group Presets in the Section module.
• Added foundational support for Composite Group handling in Option Group Presets in the SignupCustomField module.
• Added foundational support for Composite Group handling in Option Group Presets in Slide module.
• Added foundational support for Composite Group handling in Option Group Presets in the Testimonial module.
• Added foundational support for Composite Group handling in Option Group Presets in the Toggle module.
• Fixed the inner-row module’s et_clickable class missing issue, which makes the module un-clickable when we set the link value from the settings.
• Update the code example in the “Adding Placeholder Content” and “Converting Dynamic Module” pages to import the placeholderContent utility function from the moduleUtils package.
• Fixed example modules are not loaded due to a fatal error when updating the package to import the placeholderContent utility function.
• Fixed a security issue in the Audio Module.
• Fixed an issue where composite groups with multiple attribute names having similar suffixes led to inconsistent attribute selection.
• Fixed a security issue in the Background component.
• Fixed header and footer styles not working correctly on index pages, such as category pages and search results pages.
• Fixed an issue that prevented the Visual Builder from loading on the page that contains shortcode modules.

Jump Into Divi 5 Today

The Divi 5 Public Alpha is available today. As outlined in Divi 5’s original multi-phase release schedule, the Divi 5 Public Alpha is like “Divi 5 Lite.” It’s missing a few features and may not be suitable for existing websites, but it’s ready to be used on new websites if you prefer the experience to Divi 4. 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. From here on out, Divi 5 will improve regularly through the Alpha, Beta, and beyond.