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.
Stay Tuned For More Updates
That’s all for this month’s Divi 5 update. In other news, we have an update to Divi AI coming out in the next few weeks that will allow you to generate code with AI, making it easier than ever to customize Divi and its modules. For those of you who like to break free of Divi’s design settings and write your own CSS, I think you are going to find this update incredibly useful.
Stay tuned for that, and I’ll see you in the next update. Follow us by email and subscribe to our YouTube channel for all the latest news.
Any news about DIVI 5 for December?
Yes I also wonder what is the ETA? Because end of year is usually work, work, work, so it would be nice to know what is the date aprox DIVI 5 will land live?
Start of the next year would be great:)
I’m curious if we’re still expecting 5 to launch this year — or if we’re likely looking at Q1 of next year at this point 🙂
Hello, can’t wait to check all these new features !
I’m not sure to be at the right place for this, but I’m wondering if you intend to give us the possibility, one day (maybe with this Divi 5 big project), to custom the breakpoints ? Change their values, or even being able to add a fourth or fifth one ?
Elegant theme would take a significant on all the other page builders.
Thank you
Thanks for the updates. Sounds great so far and good to know the shortcode changes are only divi specific.
I have created my own modules and templates for clients e.g. a new portfolio module for specific case studies and their categories.
I created this long before Divi had a template builder. So maybe I have to create a them via this? Only I will be doing work for nothing.
Thanks for the update! Is there any possibility of you showing the new builder in action in the next update? Just a little teaser you know?
Thanks for the update.
As we are moving away from shortcodes, can we see a new Toolset module for content templates made in Toolset, to go along side the Toolset Views module. Incorporating Toolset content templates into bigger Divi templates in the Theme builder is a great way to add extra functionality but it’s cumbersome getting the template shortcodes and then into a text module. Having a module dedicated to this would be very useful and more complient with the new shortcodeless way forward.
100% of my custom work is based on shortcode and also 95% of the success of the wordpress eco-system is based on fact the anybody can insert a shortcode into a any theme.
To be honest I do not think that shortcodes will deprecated before wordpress 10 🙂 That you guy go with an alternative approach for storing the page builders internal data is another story.
I would like to see a kind of content api that is capable to create or alter the page builder content in a “secure” way so without getting in danger to fully detroy an entire page.
Hi, I have a WordPress multisite installation with many sites. I have grabbed the Divi Shortcodes of some modules with dynamic contents of the subsites and with switch_to_blog() functions I display, for example, the module of the subsite C to subsite A, etc…
With the new foundation, there will be a way to do that?
And also, the new foundation will be compatible with Toolset Views and Blocks?
I wonder how the removal of shortcode in Divi will affect any other shortcodes used on the site, especially custom shortcodes in child-theme functions.php, if at all(???).
No, Divi 5 will not affect any shortcodes other than it’s own module shortcodes. Even Divi’s old shortcodes will still work, they will just come with a performance cost (just like they do now).
Outstanding! Much appreciated! Can’t wait for 5 live!
I’m still wondering if visitors will experience a significant upgrade in UX performance. I know us developers will with the Builder, but will the Theme be more efficient? I’ve been considering switching to Astra, but would prefer not to.
We expect front-end page speeds to improve a good deal, but I’d rather not make any specific promises as it’s guesswork at this stage.
Nick, thank you for continuing to improve Divi, and for keeping us in the loop with these updates. I’m always excited to read them!
On the topic of front-end performance, I totally understand wanting to avoid making specific promises. You mentioned in this article that you expect the move away from shortcodes to have “a small performance improvement,” and that gave some insight into the kinds of things you guys are doing to help Divi 5 outperform Divi 4 on the front end. Whether in these comments or in a future post, would you mind talking about some of the other things you guys are doing that should help Divi 5 outperform Divi 4? Thank you for considering!
One of the great things about DIVI is how easy it is to use for the non-techy user. As you speak about this update, please consider that audience. A lot of what you are writing no doubt makes sense to developers, but for us users, the language you are speaking in just increases anxiety that something will get broken in the migration that we don’t know how to fix
Rest assured, the migration process will be simple from a UI perspective. All you’ll have to do is click a button and let the migrator do its thing.
Hi,
How complex will be migrating from Divi 4 to Divi 5 in a manner of leaving shortcodes behind?
Thanks!
It will just be a button you press in the WordPress admin. We’ll let website owners initiate the process, and then the migrator will go through each post and convert the shortcodes to the new format.
I have a website with 7000+ posts, are you sure Divi 5 will handle the migration? Does it all have to be done at one or can I choose specific posts to migrate?
What about the websites that have been online for many years expecting Divi to always work without doing any redesign… which by the way since the sites may follow a timeline of growth as in lhs54.org and numerous others of similar designs? What are you doing to assure you faithful customers website will continue to work as designed? Please don’t leave us in the dark… Gene Mathis
There will be no need for anyone to redesign anything. After you update to Divi 5, you won’t notice any changes to your website (except that it will be faster). Divi’s foundation is improving, but that’s all behind the scenes.
sounds all good! 🙂 finally out with the shortcuts! Now my main worry continue being the support to custom post types. It should be something native to Divi (and wp in general). With Divi we have to go around so much stuff to create simpler content. Thanks for the hard work!
Divi supports CPTs by default. If the Divi Builder is not available on the custom post type, just head to Divi > Theme Options > Builder > Post Type Integration and enable it. Check this screenshot: https://prnt.sc/Bs1PqUWaLP-O
Hi Nick thanks for the update, this is quite a concerning one as we use shortcodes to implement a lot of additional and missing features into Divi. Especially with Woocommerce and then less so with creating custom functions but its still a significant part of what we do.
Can you clarify, if when you are talking about shortcodes you mean specifically divis shortcodes and that other shortcodes can still work?
Also if you do not mind, could you please share with me where you have heard about WordPress depreciation of shortcodes, would be in interesting read.
Sounds like DIVI 5s going to be a big one It is always exciting to see the new features.
Thank you for a great product.
I am only talking about Divi’s shortcodes.
Whoo that’s great, thanks Nick, and thanks for your wonderful product.
As I said looking forward to 5. I have been reading a lot about it after reading this “scary” post.
It seems it’s focused on performance and stability which is always welcomed by us selling it.
Best Regards
Juan
Nick, thank you for the update.
I bought a lifetime subscription years ago, and one thing I can count on is the continuous improvement of an already cutting-edge product set. Keep up the great work. Kudos to the team that helps to make it happen.
We have developed a software which allows to combine pages built with Divi with information coming from a database.
For instance, we can have a page with a section and this section will be repeated in the displayed page for each row found in a database table, and the content of each generated section will be customized by the content of the columns for that row.
To do that, we process the source code of the page before it is processed by Divi, i.e. our algorithm processes Divi shortcodes to generate the final set of shortcodes which will then be processed by Divi to display the finalized page.
With Divi 5, I understand we will have to rewrite our algorithm to use the new format instead of shortcodes.
I have no problem with that, and I would like to know if the new format is already documented, so we can begin to work on this.
And as always, thank you for all the progress made on Divi month after month, the last one on AI is stunning, even if results for images genreration from texts typed in French are sometimes stange 🙂
That’s exactly why we are building Divi 5 in public and releasing four beta phases. 🙂 Right now, we are in Dev Beta, which means the foundational API is complete. You can join the Dev Beta program to get access to the current version and test your integrations.
Thanks for the update! Excited to know we’re moving away from shortcodes. Can you tell me if Divi 5 will use flexbox?
Divi 5 won’t come with any new features or changes to how the UI works or how the website is output on the front end. All of the changes in Divi 5 are foundational in nature and “behind the scenes” so to speak. After Divi 5 is released, however, it’s full steam ahead on new features and improvements, and we’ll be improving things faster than ever thanks to the new foundation we are building.