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 19. 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 19?
I didn’t publish a post for Public Alpha 17 and 18, so I’ll cover everything that has changed since then.
We implemented 121 bug fixes and improvements, five new features, including Flexbox Layouts, Interactions, Improved Backward Compatibility, Relative Colors, and Find and Replace, and made significant progress on two upcoming features.
Bug Fixes & Improvements
Regarding bug fixes, almost every team has finished their features and is now focused on fixing bugs in preparation for the upcoming public beta. You can expect bug fixes to ramp up over the next month, with a new focus on testing and fixing migration-related issues. In addition to all the little bug fixes, Public Alpha 19 also comes with a few minor improvements:
- Significant Performance Improvements: You’ll notice that the builder is much faster when working with large, complex layouts with many nested elements. We refuse to sacrifice performance, even as we introduce more features.
- Add Element Above/Below Options: You’ll find new options in the right-click menu for adding elements above or below a component. This is very useful when working with tiny columns and nested elements, where the “plus button” is prone to overlapping. Using the layers panel and right click, you never have to worry about targeting hover buttons. You can turn most of them off using the icons in the left-hand sidebar once you get familiar with using keyboard shortcuts, right-click, layers view, and breadcrumbs.
Of course, these minor improvements don’t include all the big features we introduced, so keep reading to learn about those!
Feature Progress
We’re moving full speed ahead with feature development. We have seven teams working full-time on Divi 5. Here is what they’re up to. 👇
- Team One: This team fixes bugs and assists Divi Marketplace creators with module conversion. The Divi 5 versions of many popular products are nearing completion, and we have been testing them out on the blog!
- Team Two: This team is working on Woo modules, the final feature for Divi 5 to enter beta. They’re close to finishing their first batch, covering all product modules.
- Team Three: This team finished Improved Backward Compatibility and is now working on fixing bugs in preparation for the public beta.
- Team Four: This team finished Flexbox Layouts and is now working on fixing bugs in preparation for the public beta.
- Team Five: This team finished Relative Colors and is now working on fixing bugs in preparation for the public beta.
- Team Six: This team is working on Loop Builder. It’s almost finished and we plan to release it next week.
- Team Seven: This team finished Interactions and Find and Replace and is now working on fixing bugs in preparation for the public beta.
Flexbox Layouts
We finished this feature and released it in Divi 5 Public Alpha 18.2. 🎉
Divi 5’s new Flexbox layout system has arrived. This is no minor update. It reinvents Divi, allowing you to build any layout structure, including responsive layout breakdown, custom module ordering, easy vertical alignment and element positioning, and much more. No stone was left unturned, no option was forgotten—we did it all, and it’s best in class.
Give it a try today!
Interactions
We finished this feature and released it in Divi 5 Public Alpha 18.1. 🎉
Interactions is a robust system for creating interactive elements such as popups and toggles, and creative scroll-based and mouse-movement-based effects. It’s not a pop-up builder; it’s an anything builder. Create a trigger, assign an effect, choose a target, and bring your custom interactions to life.
Give it a try today!
Improved Backward Compatibility
We finished this feature and released it in Divi 5 Public Alpha 18. 🎉
We’ve been testing all the top-selling products in the Divi Marketplace and improving Divi 5’s backward compatibility system so that, when the time comes, everyone will be able to upgrade. With the improved backward compatibility update, legacy modules are now available in the Add Module panel and will function much better than before.
Give it a try today!
Relative Colors With HSL Support
We finished this feature and released it in Divi 5 Public Alpha 17.1. 🎉
Divi’s color revolution has arrived, positioning Divi as the clear leader in color management and advanced color systems. 🎉 Divi’s color picker has been completely redesigned, and it doesn’t get any better. Using HSL, you can create mathematically beautiful, variable-based color systems that are easy to manage, revolutionizing how you manage colors on your websites.
Give it a try today!
Find And Replace
We finished this feature and released it in Divi 5 Public Alpha 17. 🎉
Find and Replace is an impressive efficiency tool for Divi power users that will speed up your workflow and play an essential role in helping old websites adopt Divi 5’s new design systems, such as variables. Right-click on any field to find and replace its value within a given scope. It’s a simple concept, but boy, is it useful, and it’s not something you’ll find in most page builders. 🤩
Give it a try today!
Loop Builder
We gave a sneak peek at Loop Builder last month, and it’s almost finished. Our goal is to release it next week!
The idea behind Divi’s loop builder is simple: loop anything! You can create new post-based content by looping sections, rows, columns, groups, modules, and sub-elements.
WooCommerce Modules
Our first batch of WooCommerce product modules is almost finished and will be the next feature we release after Loop Builder.
Changelog
Here is a list of all the changes implemented in Public Alpha 17 through Public Alpha 19.
- Added a new developer tutorial series and reorganized Dynamic Content documentation, including a verified guide for enabling Dynamic Content on existing module fields using hooks in Divi 5.
- Fixed the issue of the ACF plugin’s Page Link not showing the correct URL in the front-end.
- Added Child elements Loop support for Slider, Accordion, Tabs, Pricing Table, and Bar Counter modules. Fixed Visual Builder pagination consistency to ensure accurate item counts across all contexts.
- Fixed Loop Builder support for child modules, ensuring consistent behavior between Visual Builder and frontend rendering.
- Looped Dynamic Content with before and after field values is not rendered in VB.
- Fixed third-party Divi modules with legacy folder names to correctly appear under their designated categories in the Add Module dialog.
- Fixed an issue where loop dynamic content fields displayed blank content instead of actual post data on the frontend in Divi 5 loop-enabled modules.
- ACF ACF repeater fields render correctly on the frontend when using Loop Builder.
- Fixed loop position system to allow child modules within looped Row modules to display specific posts based on their configured position, enabling proper grid layout control and targeted content placement.
- Added support for Loop Users and Loop Terms dynamic content options.
- Improved D5 WooCommerce modules system with enhanced product page layout handling.
- Improved WooCommerce REST-API Controllers and fixed WPUnit Tests to work correctly.
- Fixed missing “Delete Column” option in Layers View context menu when right-clicking on column elements.
- Fixed Loop Builder terms query to properly handle requests for all taxonomies instead of crashing when no specific taxonomy is selected.
- Fixed an issue where custom min-height values could not be applied to empty columns in the Visual Builder.
- Fixed JavaScript error that occurred during keyboard navigation in the Add Module modal.
- Fixed Loop Element post type to default to “Post” instead of “Page” when enabling loop functionality on pages.
- Fixed WooCommerce Product Price module frontend tests to ensure consistent and reliable test execution across different scenarios.
- Fixed issue where the Woo Product Title module loses styles if VB is enabled.
- Introduced a new issue template for third-party support tasks.
- Enhanced loop system with comprehensive WooCommerce product support.
- Fixed layout flex options were incorrectly displayed on tablet and phone breakpoints when the desktop layout type was set to block.
- Fixed performance issues during save operations that caused lag and crashes on large layouts with many modules.
- Fixed issue where background colors incorrectly generated “initial” CSS values when switching between responsive breakpoints, preventing proper color inheritance.
- Fixed ColorPicker opacity interactions and SpectrumRange background display to properly default to white when no color is set, providing more logical behavior for modules without default background colors.
- Fixed an issue where nested global colors with filters lost formatting after saving a preset.
- Fixed Fullwidth Post Slider showing the wrong content when using automatic excerpts or full content.
- Fixed D5 code modules having script and style tags stripped for non-logged-in users on frontend page loads.
- Fixed issue where code content in Code modules was being escaped on the front-end due to unnecessary migration processing.
- Fixed an issue where code modules display raw code instead of rendering correctly for non-logged-in users on the frontend.
- Fixed a JavaScript TypeError when changing flex row column structures on legacy column structures.
- Introduced Divi’s new flexbox-based layout system.
- Fixed Contact Form unique ID generation to restore compatibility with third-party plugins during Divi 4 to Divi 5 migrations.
- Fixed style output for the WooCommerce Product Images module in the Visual Builder.
- Fixed style output for the WooCommerce Product Images module in the Frontend.
- Fixed the issue of the code field reset button not resetting the value correctly.
- Added correct FE content for WooCommerce Product Title module, replacing placeholder content.
- Added correct FE content for WooCommerce Product Price module, replacing placeholder content.
- Added correct FE content for WooCommerce Product Stock module, replacing placeholder content.
- Added correct Visual Builder content for the WooCommerce Product Title module, replacing placeholder content.
- Fixed color picker preview display inconsistency where switching between CSS variable and hex color types would show incorrect color previews.
- Fixed CSS variable preview in color picker when variables are declared in the Page Settings advanced CSS tab.
- Fixed loop position in Visual Builder to allow display posts based on their position rather than duplicating across columns.
- Added comprehensive test coverage for Divi 5 migration system, including version sorting, fluent interface validation, and execution order verification—fixed version comparison logic for proper handling of final vs pre-release versions.
- Fixed nested global colors not displaying correctly in background patterns and masks when using complex nesting with filters and opacity.
- Removed deprecated color palette setting from the Theme Options interface to simplify the user experience.
- New BackticksSniff for detecting and preventing shell command execution via backticks.
- Fixed border radius sync incorrectly re-enabling when changing individual corner variables.
- Fixed color picker preview updates and opacity field reset to provide immediate, consistent visual feedback during color editing workflows.
- Fixed misaligned color values in D5 Color Picker’s global colors list view.
- Added a dedicated handler for cloning flex columns with proper structure management and conditional dispatching based on layout type.
- Fixed the Circle Counter module color picker not appearing by adding missing dynamic content support for variable resolution.
- Fixed shortcode module warning messages to correctly display HTML formatting instead of showing raw markup as text.
- Fixed an issue where clicking the dynamic content icon did not close an open color picker modal.
- Fixed infinite loop error in Visual Builder’s Dynamic Content options, a console error.
- Added automatic version-based sorting for migrations and public access to migration version information through getter methods.
- Fixed select menu positioning in column layout components to ensure proper dropdown placement within viewport boundaries.
- Fixed column width styles to only apply !important declarations in block layouts, improving flexbox layout behavior.
- Fixed module spacing in D5 flex layout columns on responsive breakpoints to use proper gap-based spacing instead of conflicting margins.
- Fixed a JavaScript error that occurred when trying to drag interaction items.
- Fixed missing default gap value placeholders in flexbox layout fields that were confusing the actual applied gap values.
- Fixed issue where duplicating or deleting columns in flex rows incorrectly transformed the row structure instead of preserving the intended flex layout.
- Fixed Custom CSS fields not updating visually during undo-redo operations.
- Fixed an issue where disabled breakpoints were still outputting CSS styles in the Divi 5 customizable breakpoints feature.
- Improved drag and drop performance and user experience by preventing hover elements from rendering during drag operations, and added element type tracking for enhanced visual feedback.
- Fixed excessive height in Loop Builder post type selection input field when editing Theme Builder layouts for improved visual consistency.
- Updated Divi 5 roadmap.
- Fixed issue where Fullwidth Portfolio and related portfolio modules would display JavaScript errors and malformed CSS classes when used with WooCommerce Product post types.
- Improve the changing column structure when the row has a flex layout.
- Introduced Interactions, a new system for building interactive elements and effects, including pop-ups, toggles, and more.
- Fixed global layout expansion bug where references were converted to full content during Gutenberg saves.
- Fixed an issue where new lines are not allowed in the GV text.
- Added advanced post and taxonomy filtering support in Loop Builder and updated Tag Input with category-based options and search functionality.
- Fixed an issue where Option Group Presets and Module Presets in Global Elements didn’t display their styling initially.
- Fixed an issue where the Visual Builder would redirect to the home page when editing pages with Unicode characters in their slugs.
- Fixed Text Module font-weight and font-decoration properties now support hover.
- Fixed parent flex layout detection to use null coalescing operator instead of explicit isset() checks for better code efficiency.
- Fixed an issue with the Person Module where overflow was not applied correctly when using global variables on the border radius.
- Fixed Column Class dropdown modal displaying empty previews instead of proper column width visualizations in the Visual Builder.
- Legacy modules are now available in the Add Module panel.
- Fixed the Blurb module title DOM printing issue in the Front-end while the title field value is empty.
- Improve backwards compatibility by properly handling custom settings added to modules by third-party D4 extensions.
- Fixed the Dynamic Content settings modal not restoring the previous value when canceled.
- Re-exported and optimized all icons related to the Flexbox, removed hardcoded SVG fills, added missing icons, and fixed icon alignment and transformation logic.
- Fixed an issue where Global Preset CSS became invalid after exporting and importing again.
- Fixed an issue where deleting and undoing a module with preset styles caused the preset design tab styles to disappear in the preview.
- Fixed the issue of the phone simulator’s initial width value not matching in Visual Builder.
- Fixed the issue of the empty column missing its CSS class.
- Improved backwards compatibility with Divi 4 third-party extensions that register modules later, for example, on woocommerce_loaded.
- New BackticksSniff for detecting and preventing shell command execution via backticks.
- Fixed missing “undent” icon display in Divi 5 for third-party modules using tabbed subtoggle settings.
- Fixed custom fields functionality in the Email Optin module that prevented users from adding custom fields to their opt-in forms.
- Fixed D4 plugin text toggle tabs showing blank labels in D5 Visual Builder.
- Fixed Image Module border radius overflow logic when using global variables, ensuring content stays properly within the frontend’s border bounds.
- Fixed divi-upcoming-countdown plugin compatibility issue where countdown timers appeared empty in D5 due to missing React dependencies.
- Fixed an issue where the Contact Form’s Conditional Logic feature would display an error when configuring conditions for certain field types.
- Migrated WooCommerce default/placeholder modules’ markup passed to VB/TB on page load.
- Implement proper module attributes defaults for WooCommerce module attributes like product, columnsNumber, etc.
- Fixed Dynamic Content “Post/Archive Title” showing placeholder text instead of actual archive titles on empty category pages when using Theme Builder layouts.
- Fixed an issue where links inside editable content would navigate away from the Visual Builder instead of activating the inline editor.
- Implemented a PHP-based system to handle dynamic default attributes for WooCommerce modules.
- Fixed undo/redo functionality for third-party modules in Divi 5 Visual Builder, where undoing changes would incorrectly remove the entire module instead of reverting individual changes.
- Fixed the issue where color fields in the Find and Replace modal were rendered as text inputs instead of proper color picker components.
- Fixed issue where shortcode modules were removed during the Divi 5 migration processes.
- Fixed an issue where global layouts were incorrectly expanded during global color migration, causing layout structure corruption while preserving proper global color CSS variable conversion.
- Fixed issue where color picker modals incorrectly closed option group preset editing mode, and module switching didn’t properly exit preset editing mode.
- Fixed an issue where spaces added to the Text module via the settings panel would disappear when hovering over the module.
- Fixed unitless global variables not appearing in z-index and other unitless CSS property fields.
- Added support for setting the builder version when adding new sections, rows, and columns in the Visual Builder.
- Fixed missing builder version in Flexbox column structure changes for proper migration support.
- Updated Row module to support new Flexbox-based column structure selector and improved grid data handling.
- Fixed Global Numbers appearing in random order in the Dynamic Content field dropdown.
- Fixed excessive spacing on layout card titles in the Theme Builder’s insert layout modal.
- Introduced Relative Colors & HSL, including a new color field and color picker.
- Added support for conditional field visibility in Page Settings modal via a visible prop (boolean or function) on field props.
- Fixed the Export/Import modal visibility issue in Visual Builder.
- Added support for meta query filters in Loop Group settings, enabling custom field-based content filtering.
- Fixed Visual Builder crashes when clicking edit buttons on modules from disabled plugins.
- Migrated WooCommerce modules’ markup passed to VB on page load.
- Added a script command to streamline the process of updating JSON files for D5 conversion tests, ensuring more reliable and accurate module conversion.
- Fixed WooCommerce Block modules detection and ported the WooCommerce script loading functionality to D5.
- Improved global color picker to show disabled circular color references with explanatory tooltips instead of hiding them completely.
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 ~1.5 months based on our progress; 2-3 weeks to wrap up Loop Builder and Woo Modules, followed by a few weeks of focused bug fixing. There are two things we want to accomplish before entering the beta phase, and the majority of our team is now focused on these tasks:
- 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.
- Migration Testing And Polishing – We have multiple teams dedicated to fixing the bugs reported during the alpha phase, ensuring that Divi 5 is stable before the official release. A major focus over the next months will be to put the Divi 5 migration system through its paces and fix migration-related bugs.
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.
Great work! Flex Box is amazing feature!
Question: will you add a menu builder to Divi 5?