I’m back with another Divi 5 update! As you may know, we are in the midst of a massive project recreating the Divi Builder, focusing on foundational improvements such as performance and extendability.

I give a quick update every month to keep the community informed about our progress. Last month, I announced the release of Divi 5 Dev Beta, the second of four beta phases that will precede the launch of Divi 5. With the release of Dev Beta and the Divi 5 API complete, we are working towards the Public Alpha, ensuring we finish enough of Divi’s core features to make that first public beta version broadly usable.

What We Accomplished This Month

We accomplished a lot this month, completing the conversion of more Divi modules, such as the Accordion module, Social Follow module, Icon module, Search module, and Code modules. We fixed more bugs, made more improvements, updated more docs, and continued our march toward the Public Alpha phase.

Here are the latest Divi 5 changelog entries. 👇

• Added Map & Map Pin modules for Divi 5
• Added Pricing Tables and Pricing Table module for Divi 5
• Added Slider and Slide modules for Divi 5
• Added Video module for Divi 5
• Implement import premade layouts via the cloud app into the visual builder.
• Fixed the Dynamic Content button so it would also show up on filled text boxes.
• Added UI enhancement for nested option group in module settings modal.
• Generated module.json from typed ts file to ensure module metadata property values are validated.
• Updated PHP snapshot test
• Fixed a bug that prevented Divi stylesheets from loading in the Builder when a child theme was active.
• Fixed portfolio links exiting the visual builder.
• Fixed resetting a custom hover image causes conflicts on the FE.
• Fixed the Help modal size issue where undocking the Help modal caused it to appear larger than its original size.
• Fixed the Divider module’s default weight.
• Fixed the Blurb module’s icon default size.
• Updated CTA and Login button border and text colors to be empty by default.
• Introduced the elementType imageLink into the ModuleElements class that works to render a linked image element.
• Introduced the elementType wrapper into the ModuleElements class that works to render a wrapper element.
• Introduced the elementType image into the ModuleElements class that works to render an image element.
• Fixed the HTML difference between D4 and D5 for the Code module.
• Added Accordion & Accordion Item modules for Divi 5
• Added Social Media & Social Media Item modules for Divi 5
• Added Icon module for Divi 5
• Added Search module for Divi 5
• Added Fullwidth Code module for Divi 5
• Created doc generator for Divi 5 PHP Action and Filter Hooks.
• Updated PHP action hooks doc declaration.
• Updated PHP filter hooks doc declaration.
• Updated docs for PHP API.
• Added UI enhancement for module settings and modal in general.
• Updated tutorial to incorporate the latest improvement in module development.
• Added new Field Library Component: Warning
• Refactor `animationClassnames` implementation
• Added `moduleClassname` and `moduleOrderClassname` properties for module metadata on `module.json`
• Added `ModuleElement.scriptData()` method
• Added `ModuleElement.styleComponents()` method
• Added option to activate enhanced UI
• Fixed an issue when changing animation style causes the module to crash.
• Fixed correct state(Desktop, Tablet etc.) is not selected in the State Picker modal.
• Fixed Incorrect selector for sticky.
• Fixed leftover defaultAttrs and defaultPrintedStyleAttrs references in the documentation site
• Fixed Module Settings Field doesn’t handle responsive / hover / sticky value correctly if field props are not explicitly declared
• Fixed Page Settings Bar’s icons in buttons are not centered in Firefox
• Fixed the issue of importing link options from D4 to D5 in the Blurb module.
• Fixed the issue of importing link options from D4 to D5 in the CTA module.
• Fixed the issue of showing dynamic child item titles in the content panel for the tab module.
• Fixed vertical and horizontal offsets don’t work with the relative position in the Fullwidth Header module.
• Properly enqueue package style after theme style
• Updated documentation page of functions that are used on the dev beta tutorial

Let’s Talk About Shortcodes

I also wanted to take a moment to discuss one of Divi 5’s most significant changes, which is the removal of shortcodes and the migration towards a more modern storage format that aligns with the future of WordPress.

Why Move Away From Shortcodes?

There are several benefits of Divi 5’s move away from shortcodes. First, WordPress will inevitably deprecate shortcodes as more and more users gravitate towards the new editor, and we want to stay ahead of the game.

Shortcodes also have limitations that make it difficult or impossible to accomplish certain things, like infinitely nested elements, and they also come with inherent problems that often rear their ugly heads, such as particular characters within the post content breaking the shortcode logic, which leads to overly-complex solutions to fix the underlying issue.

Shortcodes are also less performant since parsing them can require complex regular expressions. On the other hand, our new storage format is much easier to parse, which will result in a small performance improvement.

Finally, there is the issue with shortcodes being left over in the post content after moving away from Divi, which will no longer be a problem in Divi 5. If you build your website with Divi 5, and then switch to a new theme or builder, you’ll start with a blank slate instead of with unwanted shortcodes in the post content.

How Will Shortcodes be Migrated On Existing Websites?

In order to make this switch, we’ll need to programmatically search through your website and convert shortcodes to the new format. After you upgrade to Divi 5, there will be a migration process that you initiate to complete the conversion. Old Divi 4 shortcodes will still work with Divi 5, but they will come with a performance cost, and we recommend that everyone migrate their websites and update their third-party Divi modules so that your entire website is using the Divi 5 framework.

If you are building a new website in Divi 5, on the other hand, everything will use the new framework by default. Old layouts in your library or old layouts that you have exported from Divi 4 will be automatically converted to the Divi 5 format on import.