I’m again with any other Divi 5 replace. Remaining month, we launched the Divi 5 Alpha demo. When you overlooked it, you’ll need to head to demo.elegantthemes.com to take a look at the brand new interface. When you already checked it out, you’ll need to return and take any other glance for the reason that demo will get up to date each two weeks, and we’ve already made enhancements and addressed a few of your comments.
We additionally made Divi 5 even sooner, optimizing quite a lot of not unusual movements comparable to including modules to the web page, switching view modes, and opening panels. We’re interested by efficiency and scrutinize each interplay. When you concept Divi 5 used to be speedy ahead of, check out once more as it’s best getting sooner.
Get the entire main points within the video beneath. 👇
Updating to Divi 5 & Backward Compatibility
After liberating the demo, we gained many new questions in regards to the transition between Divi 4 and 5. Nowadays, I’ll talk about how we’re construction backward compatibility into Divi 5, discover the Divi 5 replace procedure, and show off the Divi 5 Readiness Gadget, which is able to information you during the Alpha and Beta stages.
First, let me say that in case you are in no rush to take a look at Divi 5, then you’ll wait till it’s formally launched and your whole third-party merchandise are up to date to revel in a easy, hassle-free replace. Divi 5 will display up as an ordinary replace on your WordPress dashboard, and also you’ll click on a button to transform your web page to Divi 5, which is able to migrate your whole Divi pages to the brand new layout. Your web page received’t alternate; it’ll get sooner, and also you’ll revel in the use of the brand new snappy model of Visible Builder.
However we additionally have you ever coated if you wish to bounce in early throughout the Alpha and Beta stages and even supposing you’ve got closely custom designed Divi with your individual modules and shortcodes.
Backward Compatibility
We thought to be backward compatibility from the start. Assume a web page incorporates unsupported Divi 4 shortcodes when updating to Divi 5, comparable to legacy third-party Divi modules or previous Divi shortcodes injected into your kid theme. If so, Divi will robotically discover the ones shortcodes and lazy-load the Divi 4 framework on call for. This guarantees that your web page will keep intact after updating, supplying you with and builders from the neighborhood additional time to transition. Loading the Divi 4 framework will come at a efficiency price, making it a concern for web page homeowners to replace their plugins and kid subject matters. Nonetheless, it’ll best have an effect on pages the use of legacy shortcodes.
Legacy modules will proceed to serve as even within the Visible Builder. Alternatively, since they’re incompatible with the brand new front-end framework, design adjustments to these modules will re-render extra slowly the use of PHP.
The Divi 5 Readiness Gadget
While you first set up the Divi 5 Public Alpha or Beta, you’ll be greeted through the Divi 5 Readiness Gadget. It’s going to scan your web page to look in case you are the use of any Divi 4 options or third-party modules no longer natively supported through the present model of Divi 5. It’s going to provide you with a record about which pages to your web page, if any, are affected, and you’ll come to a decision whether or not or no longer you’d love to continue with the Divi 5 replace or transfer again to Divi 4.
Continuing with the replace will begin a migration procedure, which is able to convert all appropriate Divi 4 modules to the Divi 5 layout and wrap unsupported shortcodes within the Divi 5 shortcode module to proceed functioning the use of the legacy framework.
When you best use the Public Alpha or Beta to construct new web sites, you’ll skip this procedure and hit the bottom working, which will probably be our advice when the Public Alpha is going are living. In both case, this permits us to make early variations of Divi 5 extremely usable to lots of the neighborhood. As an alternative of ready till the top, you’ll bounce into Divi 5 at any level throughout the beta procedure, supplying you with the entire advantages of Divi 5, minus a couple of lacking options right here and there, which is able to nonetheless paintings, due to our focal point on backward compatibility.
Make a selection Your Personal Journey
That is our means of creating the large Divi 5 replace extra digestible. The Divi 5 beta procedure will give everybody abundant time to undertake it at their very own tempo, empowering early adopters to revel in its advantages once imaginable. We’re drawing near this replace with nice care and taking our time to do issues appropriate, however we’re getting shut and a great deal recognize your persistence.
What We Achieved This Month
We wrapped up Divi Cloud integration and made excellent development on vital spaces, comparable to Presets, front-end efficiency optimization, and the Divi 5 Readiness Gadget. We merged over 100 updates, together with trojan horse fixes, enhancements, and smaller characteristic increments, comparable to seek and filtering within the layers panel, draggable sizing for responsive perspectives, and the brand new UI for zooming out and in, all indexed within the changelog beneath.
With the demo launched final month, those previous few sprints were centered closely on trojan horse fixes, thank you in your comments. This quickly behind schedule our development towards the Public Alpha however allowed us to get forward of the sport on insects. With a lot of the ones insects now addressed, we will be able to focal point on characteristic building once more.
Listed here are the newest Divi 5 changelog entries. 👇
- When customers create non-regular sections, the correct colours will observe to them.
- Fastened when a consumer hovers over layers, choices will see the “Extra Choices” tooltip textual content.
- Fastened background colour and textual content colour problems with Layer World Module.
- Fastened Layers view column icon colour will have to fit the column textual content colour.
- Up to date World Colours implementation to take away fallback colour that used to be being stored in module characteristic to steer clear of redundancy.
- Fastened a subject the place growing a brand new preset merchandise from the present taste didn’t take away the supply module attributes.
- Fastened a subject the place the button wrapper background for the preset panel used to be wrong.
- Fastened a subject the place the module name within the header panel used to be wrong.
- Up to date the document blocks for world colour and got rid of the recently unused houses labels and folders.
- Fastened a subject the place the worldwide colors-specific context menu didn’t paintings. It didn’t seem whilst you right-click.
- Preset props have been added to the next modules: accordion, accordion merchandise, audio, weblog, Blurb, button, circle counter, and code.
- Added preset props to the next modules: Column, Column Internal, Feedback, Touch Box, Touch Shape, Countdown Timer, Counter, and Counters.
- Added preset props to modules CTA, Divider, Filterable Portfolio, Fullwidth Code, Fullwidth Header, Fullwidth Symbol, Fullwidth Map, Fullwidth Menu.
- Added preset props to modules Symbol, Login, Map, Map Pin, Menu, Quantity Counter, Portfolio, Publish Nav.
- Added preset props to modules Publish Slider, Publish Name, Pricing Desk, Pricing Tables, Row, Row Internal, Seek, and Segment.
- Added preset props to modules Signup, Customized Box, Slide, Slider, Social Media Apply, Social Media Apply Merchandise, Tab, and Tabs.
- Added preset props to present modules Sidebar, Group Member, Testimonial, Textual content, Toggle, Video, Video Slider, and Video Slider Merchandise.
- Fastened prolong when exporting native pieces from the library.
- Fastened efficiency factor the place soaring over Layer Modules makes the builder really feel laggy, particularly the Layer Module spotlight and Module define show within the builder structure.
- Progressed dragging consumer enjoy through making the dropzone width the similar because the father or mother and with the similar house between modules.
- Fastened factor the place a React caution Caution: Interior React error: Anticipated static flag used to be lacking. Please notify the React crew. InlineEditorToolbar@ is output within the browser console whilst you first of all double-click on rich-text-inline-editor editable content material to start out modifying.
- Fastened Symbol module border-radius no longer running accurately.
- Fastened the problem the place the Electronic mail Optin module and different modules with the “Use Background Colour” choice get grew to become on throughout premade structure import.
- Fastened background problems for the Social Media Apply module throughout premade structure import.
- Fastened a subject the place the reset colour box within the colour picker used to be no longer clickable
- Fixes useless re-render on all modules when module settings are opened / new module is chosen
- Fastened useless re-render on all modules when a brand new module that has an inline RichText editor is added
- Fastened the wrong look of delete icons when modifying colour swatches within the “Stored” palette.
- Fastened assist data for the spacing box staff’s margin and padding box choice.
- Fastened a subject the place an undefined world colour object e.g. {gcid-invalid-color: undefined} crashed the entire VB.
- Fastened factor the place default attributes declared within the module.json weren’t getting used within the FE.
- Fastened the login go with the flow within the Save to Cloud characteristic from Visible Builder.
- Fastened the Save To Library panel footer button name in line with the Save To Divi Cloud toggle.
- Fastened useless rerender at the tooltip when switching breakpoint
- Fastened useless rerender on change into staff element when switching breakpoint.
- Fastened the full-width drop zone line appearing a subject whilst soaring at the first part
- Fastened Seek and Filtering Adapt filter out choices UI Sudden scroll bar
- Fastened useless re-render on module settings staff when a special panel is being dragged
- Reproduction Settings Panels & Undesirable Sidebar Area is fastened.
- Preset props have been added to the scroll impact staff.
- Added web page bar UI for settling on customized app window’s width.
- Added draggable maintain for resizing app body by means of drag-and-drop
- Font taste fastened for responsive breakpoints.
- Fastened some miscellaneous inline editor checks that have been failing following the improve to React 18.
- Fastened layer modules can’t be closed personally after we click on the Open All layer modules button within the Layers View panel.
- Fastened a subject the place the right-click motion on some layer module spaces will cause inline modifying, drag motion, and a integrated browser context menu.
- Fastened undesirable context menu look within the Upload Module panel and Library panel.
- Added lacking Save To Divi Cloud toggle characteristic to the Save To Libraray panels.
- We fastened a subject the place resetting the textual content house didn’t paintings anymore for those who had added 2 or extra textual content modules.
- Fastened taking out surprising spacing from Button alignment choices.
- Progressed efficiency of Layers View panel.
- Repair: observe wanted spacing for the FullWidth phase
- Fastened DOM nesting error in Electronic mail Optin Module.
- Fastened factor the place a caution message used to be displayed within the browser console throughout structure import: Caution: Can not replace an element (Unknown) whilst rendering a special element (StyleContainer).
- Proper-click opens the module settings panel factor is fastened.
- Fastened place problems for the Upload Module panel, Context Menu, and Make a selection Choice if the admin bar is disabled.
- Progressed drag and drop enjoy in wireframe mode.
- Changed module movements, spotlight, and added module button habits, so soaring over a column will have to be handled as soaring over a row
- Added open module settings once we click on on Layers panel -> module
- Fastened activating module once we click on on module settings from VB.
- Make the weight structure panel responsive.
- Fastened a subject the place the content material of the assist panel within the Visible Builder would overflow when resized.
- Fastened lacking trend and masks preview at the background surroundings panel.
- Made dropzone of the dragged module remains rendered till the cursor of the dragged module enters any other module
- Added distinctive elegance names to the builder settings fields.
- Repair wireframe part textual content label full-width factor
- Fastened the Pricing Desk Module icon, which used to be lacking in layers.
- Fastened the Upload Row panel top.
- Fastened factor the place the module choices and/or the upload module button would overlap/cover a part of the content material being edited whilst the use of the inline editor.
- Render upload module button on every occasion module choices are rendered.
- Fastened factor inflicting tripled REST requests to be despatched.
- Fastened right-click movements for Present Pages within the Divi Library panel.
- Fastened the problem with portability within the Divi Library backend no longer supporting D5 content material.
- Fastened a subject the place the module choices sidebar would wreck when clicking the “Transparent Format” button.
- Fastened a subject the place the shut icon within the module/row/phase settings panel used to be unresponsive.
- Fastened a subject the place the Weblog Module would wreck when the Publish Depend box used to be empty.
- Fastened a trojan horse in Inline Textual content Editor that occasionally brought about a JS error.
- Fastened the problem of the cloned fullwidth portfolio Module, which isn’t visual when duplicated from the Fullwidth Portfolio Module.
- Fastened incapability to show row’s movements, highlights, and upload module button when soaring row appropriate after soaring phase
- The Timepicker box used to be no longer visual because of a CSS declaration hiding it.
- Upload new module panel is hidden from viewport factor is fastened.
- Fastened layer modules can’t be closed personally after we click on the Open All layer modules button within the Layers View panel.
- Fastened a trojan horse inflicting JS error when a module with a sticky choice enabled is deleted.
- Fastened wrong best offset worth in ‘upload shape library panel container’.
- Fastened module movements, highlights, and upload module buttons which are nonetheless rendered after the mouse leaves a module
- Fastened the problem of textual content flashing within the Inline Wealthy Textual content Editor upon the primary hover.
- Repair: take away undesirable local textual content spotlight when dragging a module
- Fastened wrong horizontal place of upload module panel and right-click choices in responsive mode
- Fastened wrong Tooltip place at the Segment module choices.
- Fastened wrong horizontal place of upload module panel and right-click choices in responsive mode
- Fastened Inline Editor toolbar place adjustments when sub-menus are closed within the inline wealthy textual content editor toolbar.
- Got rid of throttle from the onMouseMove callback serve as to give a boost to dropzone indicator responsiveness throughout speedy module dragging motion.
- Fastened a subject the place uploading a structure with the “Substitute Present Content material” choice checked within the Library panel would purpose an error if a module settings panel used to be open.
- Fastened Dynamic choices aren’t resolved at the button module.
- Up to date UI to accurately place the font/textual content settings toolbar inside of Inline Editor controls.
- Fastened on click on layers panel doesn’t display up at the breadcrumb.
- Fastened the problem of remembering the final closed place of the panel when clicking at the module to open module settings.
- Fastened Web page Settings panel opens when the Module Environment panel is closed.
- Module crashing is fastened when the sticky choice is chosen.
- Fastened a subject the place customers may get caught in a drag state when dragging a piece.
- Fixes a subject the place uploading from the library didn’t import world colours.
- We fastened a subject the place the checkboxes for supported font weights within the Add Customized Fonts panel didn’t handle their decided on state.
Keep Tuned For Extra Updates
That’s concerned with this month’s development record. Keep tuned for extra updates, and don’t put out of your mind to follow us by email and subscribe to our YouTube channel to be sure you don’t leave out a factor. Divi 5 is a limiteless challenge, however I’ll be again per thirty days to let you know of our development. When you haven’t already finished so, take a look at the Divi 5 demo and tell us your ideas!
The put up Divi 5 Migration and Backward Compatibility gave the impression first on Elegant Themes Blog.
0 Comments