The Incredibly Easy New Way
To Adjusting Sizing & Spacing In Divi
The new draggable sizing controls take full advantage of Divi and its visual builder technology to give you a new and super intuitive way to design your pages.
Today we are introducing Draggable Sizing for Divi. This new UI innovation allows you to quickly adjust the width, height, margin and padding of any module, row or section with ease. Instead of having to open a settings panel and type in sizing values manually, you can instead drag to adjust the elements right on the page and see the results instantly. It’s quick, it’s easy and it really leverages Divi’s Visual Builder technology to provide to best building experience possible.
Visual Control Over Every Element’s
Width, Height And Spacing
Now it’s easier than ever to control the size and position of every module, row and section on your page thanks to the brand new draggable width, height, margin and padding interface.
Draggable Widths & Heights
Adjusting sizing in Divi is now simple with the addition of just a few subtle UI improvements that add small draggable anchors to all elements that are easy to use while at the same time don’t get in your way while you build. To adjust the width or height of any module, row or section, simply hover over the edge of any of the four sides of the element, and drag in either direction.
You will also find new Width, Height, Max Width, and Max Height settings in the Sizing option group of all Divi elements. These are accompanied by new Overflow settings in the Visibility option group that can be used to determine the visibility of content that overflows the static widths or heights you set. These new height and width options give you a much wider range of flexibility when it comes to the size of your page elements and how the size of each element changes as its inner content increases. They also allow you to create more intuitively responsive designs using a mixture of width and max width values.
Draggable Margin & Padding
You can also quickly drag to adjust top, bottom, left or right padding and margin values for any module, row or section. You can even drag to add new margin and padding values thanks to the addition of helpful draggable anchors that slide into view when you get close to the edge of an element. To add padding to the inside of an element, simply hover over any inside edge and then drag the anchor to increase or decrease the padding of that side. To add margin to the outside of an element, hover over the outside edge and drag the anchor accordingly. You can even drag to add negative margin to create cool overlapping effects and break elements outside their column grid.
New Width, Height & Overflow Controls
The new draggable width and height interface is accompanied by a range of new width, height and overflow controls within the settings panels of all modules, rows and sections. You can find these new options in the Design > Sizing and Advanced > Visibility panels. These settings allow you to create clipping masks and scrollable boxes within your page. The new settings include:
- Height
- Minimum Height
- Maximum Width
- Minimum Width
- Horizontal Overflow
- Vertical Overflow
Break The Grid With Negative Margins
The draggable sizing interface doesn’t just make designing your page easier, it also allows you to do some new and creative things using negative margins and static widths. Negative margins can be used to pull elements in any direction, allowing you to free them from their parent containers and create fun overlapping effects. Static widths also allow you to break elements free from their parent column’s rigid structure.
The new Draggable Sizing feature not only adds a bunch really helpful new settings, it also expands upon the Visual Builders nature as a WYSIWYG tool to help make your website building experience even more enjoyable. Draggable Sizing is available today, so download Divi and take it for a spin. Let us know what you think in the comments and don’t forget to check back next week for even more great Divi features coming your way.
Get 10% Off Today!
Today's The Best Day To Get Divi Or Upgrade Your Account To Lifetime
Join the most enthusiastic and loving WordPress theme community on the web and download Divi today. Using the new Visual Builder, you can build websites faster than ever before with its incredibly fast and intuitive visual interface. You have to see it to believe it!
Join Today For 10% OFF!Renew Your Account Today For 10% OFF!Upgrade Your Account Today For 10% OFF!
Hi I appreciate your work in letting us unleash our creativity and I believe that your visual composer remains the best, but I also believe that today a professional theme has to think of a dynamic content management, as well as being an all-in-one solution for any kind of project, I believe that the dynamic management of contents, a serious integration with woocommerce and the management of headers and footers should be the prerogative of the next updates, I would also be willing to pay an additional subscription if it served to not having to resort to dozens of different plugins, thanks
Hey Nick,
Thank you alot for creating Divi! Great Work 😉
And thanks for all the Features and Benefits.
Do you have a Solution yet for editing the whole text of a complex page quickly?
Here would be the solution you can implement:
It’s this: QUICKTEXT VIEW TOGGLE
Edit TEXT for the whole Page or Parts of the Page quickly.
Without going in and out of Divi Modules all the Time and having formatted text as well within the module…
It’s especially useful for Website Translation and that would be my preferred purpose.
You could extract all text, let it translate and reimport new Text.
Also quickly edit some parts of the text / article, without going in and out of every module.
You probably know Sublime Text and how good you can modify and edit Text on this, right?
Well If it would be possible to extract all Text from the current Page and put it into an easy format. Refering to the Design that was posted recently (https://www.elegantthemes.com/blog/divi-resources/get-a-free-farmer-layout-pack-for-divi)
Extract and convert all Text from all Modules into a basic Format like this:
[TEXT#1]
Divi Organic Farming
[/TEXT]
[TEXT#2]
Donec rutrum congue…
[/TEXT]
[TEXT#3]
Our Farming
[/TEXT]
Also add some basic styling like those:
[b] [u] [i] and [link=]Linktext[/link]
[TEXT#1] can be something clever like [TEXT#15hd1f8] as well
or even [TEXT-15hd1f8#Button] for better recognition.
You can figure it out, what would be best 😉
So you basically have then extracted clear Blocks of Text wich can be then send to some translator or Editor. Also maybe quickly check and fix typo etc on modern tools. So we could use tools like deepl.com or grammarly.com much more efficient.
Everyone who knows how to use Sublime Text etc. or is a translator or editor would love divi even more 😉
This would be a huge Benefit and Timesaver for everyone who uses Divi!
Also even more People would switch from other Builders to Divi, wich I found to be the best in the Game so far!
Could you promise me to give the following great Idea a Chance and think about it? Also maybe by pushing it to the main developers and for the next Team Discussions? Please go for this! Improve Divi even more!
This would be a Gamechanger for Divi again!
Please let me know.
Best regards from Germany
Maxim
ps: Don’t forget to finally add more Icons to Divi as well (Font-awesome and some more, so People have 1000+ Icons to choose from, not just 60 or so :D). Maybe even integrate flaticon.com to Divi, Create a Partnership 😉
pps: I couldn’t post directly in support, so please get this topic going by adding it to your feature list. Best would be a priority. Hope to see this to be added soon in Divi 😉
Taking away the MAKE FULLWIDTH was just STUPID!
How do I adjust the spacing between element? I have a logo, subheader and button but can’t increase the spacing between them?
What is missing for me personally, is specific Documentation. Worse yet, is when I go to Divi Documentation, searching is very hit or miss without a Documentation menu as such. I’m always second guessing and nothing is dated. I don’t need detailed information about a release from a year ago. I need it for this update.
I’d be happy and excited to really learn new features, but regrettably, I spend all my time trying to figure out what any update changes are, how to apply them, and in cases like this update, how to repair all the damage it did. It is massive …
The net result is repetitive communications with support personnel, tying them up and frustrating me to no end. Typical communications on a single issue number around ten, or more, over a few days. And that has to be for each and every single issue. If I dare to ask more than one question, the questions get lost in the replies.
For me, it’s far more about understanding the program, and detailed Documentation would allow that.
on youtube you will find excellent tutorials for learning Divi and for making a site from scratch
If I have an extremely tall image, say 2000+ px, am I able to put that in a 400px image module and have the overflow setting set to scroll? This would be extremely useful because I don’t want to add the CSS code to make the image move only on hover for x-amount of seconds.
Full width on Rows is seriously broken. Works on first load then reverts to 80%. It also adds classes into the row CSS ID & Classes. Divi version 3.22.2
I’m having the same problem. Any response to this problem yet. Very frustrating!
Is it possible to deactivate the draggable sizing?
The fullwidth rows that we have auto changed to smaller widths and I am unable to drag them back to fullwidth.
Question: Has anyone else experienced a huge slowdown in the builder?? I mean like it’s now constantly saying its disconnected from server somehow, or saving a draft to the browser window, or just flat out moving like a turtle?
Huge Divi fan here, not hating at all.. Seriously, nothing else changed on my sites.. Same plugins running as before, cleared the cache(s), etc.. Not sure what else to do but this is cray.. Something changed something. You’re welcome for the detailed description, lol, but I don’t know what else to say… FRUSTRATED
Hi! I just updated my divi versoin but can’t find the arrows to enlarge or reduce the blocks. Has it been released already?
I can’t find this on mine
Good evening to all,
I did some tests with the new functionality in the last update, I can’t activate the scroll effect as shown in this post in the gif under the heading “New Width, Height & Overflow Controls”.
Dragging the section, it does not rise and does not hide the content.
Does anyone have the same problem?
I state that I have tried it on several sites also turning out all the plug-ins.
Thank you
It’s not working for me either – any fix on this?
This is great, but it would be really helpful to keep your users better informed – ideally in advance of updates. For me it’s very frustrating to start building a site, and then to discover the options I use regularly have disappeared and I have to learn a new way of doing things.
Yes, this new way is better and allows much more flexibility – which I really appreciate – but I wish I didn’t have to find out half way through a job.
I think the problem is that the guy who is doing the video doesn’t realize that there’s a bank of windows that wind up getting reflected in Nicks eyes. That multiple light makes him look either sick or stoned. I’ve noticed that in a few of his videos now. Easy to fix though!
Feedback as requested – this is not a robust update.
I now have rows that were set to full width no longer full width. There is no longer a control to set full width. This update has changed the design on a huge number of pages on one of my sites. Tried setting width and max with to 100% – nope – 0% margins and padding – nope – updated to 3.22.1 – nope! It would cost me a serious amount of time and money to go though 80 + pages and change settings manually.
We’d be happy to help if you open a support request. Setting width and max width to 100% should result in a full width row. This is what we are seeing.
The selector created in the dynamic css needs to stronger i.e. .et_pb_row.et_pb_row_0 instead of just .et_pb_row_0 since you have removed the use of !important.
This will still allow the use of .et_pb_row in my global css but Divi’s css will take precedence for any custom width settings.
“Setting width and max width to 100% should result in a full width row. This is what we are seeing.”
OK – Updated to 3.22.1
Yes – that’s what you have to do to fix this – manually set the values
Previously ‘make full width rows’ now default to 90%
Rolled back to 3.21.4
Genuinely concerned here – no one is going to pay for me to manually go through 80 pages – enable the editor on each page, make each problem row 100%, exit editor, find next etc etc . I need a robust solution. These rows should default at 100%. As far as I can see this update has essentially stopped me updating Divi any further on a big site!
Hi,
For those who do not use woocommerce, would it be possible to split css and js to have smaller files size ?
Not to have Woocommerce css and js charged if you don’t use it would be great. A lot of ko won. I would add an optionanal css for fonts too. Today we charge all the font evening if we use 2. That’s a pity.
That would be a nice speed improvements. I suggested also some weeks ago in the support chat.
Hello,
Really great ideas for this update.
However, on my two test sites, I too have display problems.
Not sure which display problems those are, so be sure to open a support request so we can take a look.
Nick, great job with the new update, but I don’t know whats up now.
After this update I now have stuff that looks great in the builder but jacked up in the live version and some stuff that is jacked up in the builder but perfect in the live version. After spending an insane amount of time trying to get everything looking consistently fluid on the desktop and the laptop, now its not anymore! How do you fix something when you are consistently playing “Whack-A-Mole” with this thing?
If the street wasn’t so far down from the top of the curb this thing could cause me to jump.
We aren’t aware of any such issues, so it’s likely a plugin conflict or a cache problem. It could also be a case of custom CSS working differently in the new version of the theme. If you open up a support ticket we can take a look.
Have you cleared you cache?
Hi,
I would like to adjust size EFLB on mobile devices, and even with new dragging tool doesn’t fix the problem. On mobile is just to big and goes on right side and missing. Any idea how to make it smaller?
Thanks a lot for your help and reply.
Klemen
Super Divi, Great!!
Great!
Thank you!
This is a very cool update! We wait! How about creating interchangeable images for the background section? Very necessary!
Another excellent update, makes particularly the negative spacing a breeze.
As others have mentioned – looking forward to the header/footer defaults feature for blank pages.
Hello,
Many interface issues with this last update, please check and update it as soon as possible.
thank you.
Not sure which issues you are referring to, so be sure to contact our support team so we can take a look.
Wow Amazing !! Great !! Thanks
Hello thanks for the update — but now its imposible to put the rows full with ? please help whit that
Thanks
You can make a row full width by setting the Width and Max Width to 100%.
Its not working, like many replies have posted. We used to have a button to set row sections fullwidth. Having used that option, your suggested option of setting the new width to 100%. However, this seems already to been set on 100%, while my website is now showing issue because its boxed in stead of being fullwidth as intended.
I’ve designed in print for decades and website restrictions have frustrated me. Now I can do with the website anything and everything that is desirable. To tweak an image or a component to the degree now possible in Divi is beyond belief.
Um, no.
It works for sections and rows, but not for modules. Am I missing something?
Yes, it sounds like you are missing the update entirely. Be sure you are on Divi 3.22.1.
Does this also work with blog posts in grid layout? I can’t seem to get it to work for one of my clients.
This is really a great feature, but it lacks something very important
When you work in a multiple columns/rows, I would expect for a dotted (Red) line to auto appear whenever a size change reaches the same value of an adjacent element. This will help a lot to set elements to the same value while working with the dragging tool. (just like this kind of feature as in Photoshop)
Would love to see it implemented soon
Thanks, Avi
Seconded. I was thinking the same thing.
It’s awesome. A much awaited update.. Thank you ET Team -for the nice job!
Hi Nick and Divi team.
Great job!
When Divi will be able to switch into Dark mode?!?
This is a mega trend. Every customer asks me about this feature and I have to solve it thru page copy and switching between two pages. Not so nice and terrible for updates.
Thank you in advance for short reply.
Oooh Sweet 🙂
Nice one guys!
Bug: This update changed image set to transform on hover from 2 degr to 358 degr. With the obvious result: A spinning image.
I’m really enjoying these new features. It’s easy to design something better.
Great update Thank You, Divi
I freaking love your updates guys!!! Getting the lifetime membership was one of the best investments i´ve ever made!
Nice feature
I’m sure glad I went with Divi. I love seeing the regular release of features like this. thank you…
Thanks guys this is another fantastic update! Something that will save me so much time while building. I am so glad I committed to you guys and Divi with my lifetime membership. Keep up the great work Nick and team!
This is one of the best innovations I have seen DIVI come up with! Crazy easy with limitless options creative minds everywhere will enjoy… Bravo Nick and to your entire team.
I am getting thick ugly borders around each content box, even after I have published the post. This is awful! How can I turn it off?
This has been fixed in Divi 3.22.1. Thanks for reporting the issue ?
Nick, I am very impressed with the constant flow of meaningful updates and improvements to Divi. It shows how serious you are by putting the money back into the business for development of functionality. It is no wonder why the growth of Divi users has spiked higher and higher each year (I was an early adapter). Thank you for caring about us and ultimately the end-users, our clients. Keep it going.
Dennis
Really think it’s great the advanced features being developed to make designing easier but… can we please have some standard WP features that have been missing for a long time? Like captions, or show full image in portfolio gallery. Thanks.
It is definitely great what you are doing… But I encourage you do work on improving some “backend / developer” stuff also, rather than just concentrating on designers and visual builder. And by that I mean stuff like buttons interfering with A tag and theme color, where we need to add a lot of !important on our css if we want to use global multiple style buttons. Not to mention buttons padding, it’s a mess honestly. You already use !important for those, so one has to be very specific when targeting those with custom css.
Adding a secondary style for buttons in the customizer might improve this.
Also for headings, adding an option to input size for every H separately instead of it automatically deciding according to H1 only. And the possibility to turn off the “responsive” heading size which is determined automatically according to its parent/column size.
Improvements like these are needed very much.
Thanks
This is the reason I stick with Divi. It already does just about everything I’d expect or want from a theme, and then the team finds a way to make it even more fantastic. Great addition to the feature set!
This is so inspiring! As a new blogger I find this extremely useful. Thank you!
Is it a free update. I dont see in my WP dashboard notifications for update
This is really neat and fun. I just played with it. Couple things. These are things we could do fairly easily before. And with dragging you have to be very, very careful as things pop out crazy or disappear and you’ll need to go back to the numbers and manually correct.
it’s neat and there feels like a snap to point built in? It feels that way.
Anyone having issues with dividers in the new update?
Are you referring to Divider module max width not working? That has been fixed, but let us know if you experience any other difficulties.
Hola!! para cuando habra una actulaizacion para que el textbox tenga fecha? 🙁
Really fantastic feature, but I wonder if it wouldn’t be better if the changes to margin and padding settings only affected the current layout mode (phone, tablet, desktop). In my opinion it makes little sense that these settings are applied globally when I work in WYSIWYG editor, at least when I’m in phone or tablet mode.
That’s how it works actually, you just need to enable Responsive Editing for the width, height, margin or padding setting. After that the changes you make while in a responsive preview will only affect that breakpoint.
+1 on how to do that? Is it the ‘responsive shortcodes’ setting in the theme options? I have that enabled and still if I edit in
* If I edit in desktop breakpoint, it also applies to tablet and phone
* If I edit in tablet breakpoint, it also applies to phone
To edit values for individual breakpoints, you can enable responsive editing for any particular setting. This is done by clicking the mobile device icon above the option within the settings modal.
Once you go into the module setting you cannot set the margin, padding… with the draggable option but changing the settings by numbers as before
Hi Nick, could you please explain that for dummies? Where exactly is the “Enable responsive editing” setting?
Many thanks
How do you make a green row max width now? The original option is missing.
This does not work, at least for me…
If you need any help let our support team know 🙂
You can use the new Max Width setting to adjust a row’s max width.
Another great update ET Team!
But this is not major at all. I know Elementor has this feature already. I think Beaver also has this.
You guys are closing the gap with the other 2 builders. Next should be a stronger integration with Woocommerce. The other 2 builders have special Woo integration…modules.
We’re all tired of the standard (non-existent) integration to Woo. Yeah we can customize the description box of the product page but that’s it???
What else…I saw someone above mention the Header/Footer builder. That’s not too much of a hassle for me. Also we need better control with mobile responsiveness. Elementor does a great job with that. With Divi, I still have to do heavy customization using media queries.
You guys already got Elementor and Beaver beat on intuitiveness. The features above will surpass Elementor easily.
Now if you guys want to take out Beaver, you guys need to implement Multisite features with Divi.
You guys will truly be on top top!
Great job ET Team! I’m starting to use the other builders but I’m still a hardcore Divi user.
Cool feature update!
Nick, you look like you have the flu, or something. You alright? <3
I think the problem is that the guy who is doing the video doesn’t realize that there’s a bank of windows that wind up getting reflected in Nicks eyes. That multiple light makes him look either sick or stoned. I’ve noticed that in a few of his videos now. Easy to fix though!
When you drag the column box to a taller height, will something display that allows you to know it’s in alignment with the other two columns’ boxes (for equal height)?
Otherwise, I’m wary of this kind of dragging option because it reminds me of the inaccuracies I found SO frustrating about working on one’s client’s WIX site – it means the 3 boxes won’t be exactly the same height if you manually drag them like that, one might be a bit shorter or longer than the others, and that’s really frustrating to me from a visual standpoint.
I know what you mean by the arbitrary results of casual dragging. What you can do to counter this is group select all the modules and adjust them all together.
This really isn’t anything that new. These are all things we can do by the numbers (e.g., Margin -250px, etc.). It does feel like there are snap to points. So maybe that works.
When playing around, I found so things got into a place where I no longer could grab the anchor. And in one case, an image vanished. I was just testing so it wasn’t important. I did go back to the numbers and reset things to 0 (padding, margin) so I could get them back. It’s fun but with the back end visual + inputting the settings, I don’t know if I’ll use this.
This new functionality is a dream for me as a Divi-Beginner. I was struggling with the texts and pics all jumping around on their own, and now I have total control. Yeah, thanks!
Your are the best Nick 🙂
Awesome!
No brainer.
Your grandfather can now build a website with ease
That’s why the crowd loving you 🙂
How about a constrain option so when you resize margin and padding on one side, if the shift key is held, then the margin changes by the same amount on _both_ sides simultaneously?
This already exists. The Keyboard Shortcut is Alt+Shift+Drag, which will drag both sides at once. You can also Alt+Drag to drag one side up to the exact size of opposing side. You can press ? in the builder to see a list of all keyboard shortcuts.
All these useful gimmicks are useless if you don’t finally manage to configure the VB’s mobile views so that they correspond to the real views as far as room partitioning is concerned. Also, the much-needed fourth view to test the new tablet generation is still missing.
Sorry, but this is the truth
Awesome! Big improvement for sizing! Thank You!
Awesome! Big improvement for sizing! Thank You!
Great feature. However, this is the first time that a Divi update broke the layout of existing sites and I had to roll back to the previous version!
Horizontal lines created in the „Divider“ module always get extended to full width ;-(
I have exactly the same problem ! Rows are not any more full width in Sections, and there is no way of fixing this. I have gaps between section and row edges on left and right, wich I was able to turn off before by choosing “Force Full Width” option, which is now gone.
How do I downgrade Divi, as this version broke my design.
I am facing the same problems. Couldn’t find any way to make rows full-width again with this update. Website layout is looking weird. Please DIVI Guys, fix this issue asap.
I found two issues before going back to the previous version, either no content is showing in the frontend editing mode or I cannot open a module’s options in the backend.
With the latest update (3.22.2) content is showing again in the frontend. However a click on the cogwheel for the settings does not do anything in back- and frontend.
When going back to 3.21.4, everything works fine.
I use Updraft Backup plugin and was able to restore Divi from few days old backup, and my design is back to how it was before.
I DON’T RECOMMEND UPDATE TO LATEST DIVI VERSION to any one who uses “Force Full Width” option in rows ! Let’s wait until they fix this bug.
I am far from being disappointed, as this guys are making such a good job developing Divi, that such small glitch is forgivable 🙂
There are two settings in rows that you can use to control the width. Setting Width and Max Width to “100%” will make them full width.
I Agree with Lukas.
Affter applying DIVI 3.22.1 many rows dont showing in fullwidth in fact. Settings: width 100%, max width 100%, gutter width 1. But for some rows those setiings dont work – they displayed withh white borders from left and right.
This is issue not for all rows, just for several.
So i had to make the downgrade.
Same error here. First time I used the rollback function. great to have the rollback possibility 🙂
Same issue here. Please bring back the fullwidth button, as it’s not showing true fullwidth at this point.
Unfortunately, adding a picture doesn’t work here.
Thanks for letting us know. We will look into it right away and should have a fix out later today.
Nick and Elegant Themes, your’re the best. Absolutely love this new feature it takes website designing and building to another level all by dragging. When clients see this, they are going to love experimenting with their site.
Thank you for all your work.
Thet why i love divi!! You best!
Sounds great! Are we able to drag and resize columns?
Awesome goodness!
I chose DIVI two years ago because of its innovative development of this ‘wordpress theme’. This new release of draggable modules from a front end WordPress designing perspective, with this level of phenomenal flexibility is completely game changing technology. I cannot believe that I get all this on dozens of websites that I have created for one small annual manageable fee. Thank you guys for doing DIVI!
Very Cool!
Yes, finally. I have been waiting for this. Thank you Devs! Such an incredibly helpful feature that saves a ton of time.
This is the update I have been waiting for. It takes out a whole process and the fact we can do drag and drop overlays is stunning. I love it. Thank you for making this easier for us all.
Really love this! Keep up the great work guys.
This looks amazing! But It’s 4/12 and I can’t find the download. Also, I’m logged in, but site is still asking me to “Join to Download”.
Honestly, the worst update Divi has put out IMO. Makes zero sense that draggable sizing would use percentages and not max-width. You’re going to have thousands of people completely screwing up their designs on mobile when they go in and start dragging to change the width of modules since percentages do not carry over to mobile gracefully.
I agree with you. I started moving around objects and making them neat. When I clicked on the mobile viewer, JESUS, what a mess!!!!!!!!!!!!!!!!!!!!!!
Holy shit…
I just danced myself with this update.
Just an hour ago I was wondering why this is available only in rows and not for every module.
OMG OMG I just love this telepathic connection.
This has happened so many times with me and Divi.
Awesome! Love the way you keep updating and giving us tools.
Amazing! Real help! Thak you!
Excelente.
Deberían mejorar el modulo de Blog
Awesome functionality update! Great work Divi team!!!
Nick, this is great, as usual, a game changer!! Can we get some effort into fixing functionality that already exists, or use to. Such as portability, and to have portability include menus?
Nick, this is what I am talking about!!
Pricing module. [see my open support ticket with Amjad]
The et_pb_pricing has all items as UL. The module also has an option to add a media file. When doing so, it also adds the li so their is now a bullet next to a video.
I’m told this is normal functionality when it is clearly a defect.
Awesome improvement! As far as I understood, this drag and drop does not apply to the columns width. I’ll check it. Thanks a lot!
We need uneven column(flexible column) ASAP!
Only Divi doesn’t have it yet among popular page builders.
Looks like you are correct on not being able to adjust the columns on the fly form the visual builder. That might be a future update so till then we have to roll our own with our own styling. Just contemplating the complexity of how all these new features get implemented explains how long it takes for them to happen.
Holy shit…
I just danced myself with this update.
Just an hour ago I was wondering why this is available only in rows and not for every module.
OMG OMG I just love this telepathic connection.
This has happened so many times with me and Divi.
Congrats! Nick and ET Team. Another amazing and uber-useful feature. So glad to be a part of the DIVI family! Keep up the great work!
Amazing guys! Late the haters hate on all the other stuff, the rate you are introducing this stuff is absolutely unbelievable, so well done!!
This is another step closer to perfect!??????
Another awesome moment
U made my day
Wonderful news! This is a game changer for a lot of manual number crunching and configuring when working these little details out on the design.
Hi
No doubt everything is fantastic, love you Divi 🙂
Hopefully, every feature is giving milestones to WordPress market, new paths, easy to handle advance level customizations, everything is so alluring and tangible which once was a dream.
Best of luck
When will the theme builder be ready?
Definitely, you are the best
You guys are the best! Truly amazing and always timely. #divi4life
Convenient, but most of this falls into the stuff-we-could-already-do category, but max-height/width and I saw z-index too which is nice. Since we’re talking about spacing, what about flex box spacing/alignment controls like space around, space between, space evenly etc?… really useful for lining up modules/content between columns/rows. For example making sure buttons are nicely aligned to the bottom of each column regardless of how much content is above them etc.
And sorry but I have to ask (it’s the only way to vent haha)… How much longer for the theme builder? If memory serves, it’s been 11 months or so since it was announced. We really need this new functionality.
Agreed. We’re looking for this, too.
Agreed! Aligning buttons at the bottom of multiple columns still needs to be addressed.
+1
I was going to ask about ‘snapping’ to the size of other containers within the same div or module.
Great!!!
If you guys solve the “lock-in effect problem” would be awesome 😉
Nice work. Congrats!
Great!!!
If you guys solve the “lock-in effect problem” would be awesome 😉
Nice work. Congrats!
That is one drawback of using a page builder where each one has its own method of implementation. I was hoping that the new block editor in WordPress would address this point of standardisation by providing a fully basic foundation for layout (section, row, column) with a robust API on which page builders can hook in their own interfaces and add all the nice bells and whistles. Change theme or builder and your layout would remain intact, without all the shorcode detritus.
Till this is addressed you will see page builders going their merry way with their own approach. If though the block editor does provide this functionality, at some time in the future, then it is time for pages builder plugins to scramble and port their wares to the block editor.
Nice one. Looking forward to trying it out…when it is released : )
While I have your attention. The quick inset option to add new modules to a layout. You hover until you find where you want to inset the module element, click on the module prior to where you want to add the new module and click to add it. You can’t though opt to place an item before a module, where that module is the first in a column?
Being able to defining the responsive order / stack / arrangement of modules would be great.
Oh, and also in the transform settings. Will we get a setting for perspective?
Visual control for adjusting is much more convenient, for sure.
It is quick and simple.
Many thanks.
Nice one, Nick!
Divi just keeps getting better and better. Great job team Divi!
None of my sites have gotten the update yet. 🙁
Very cool update though! Can’t wait to test drive it.
Finally got it.
That why you make me still working with DIVI Theme, because you alway update new feature and thank you
NICK. THANK YOU.!! Great passion you have share with us!!your support community is great and helpful!!
So we are going to get a new theme update a week for another 4 weeks at least??
amazing update…
is it available today now??
The post went live earlier by accident. Sorry about that! The update will be available a bit later.
Probably it was scheduled for release yesterday, I saw the posts published later than usual yesterday…. Someone must have forgotten to cancel the automatic posting :)))) works for us:)))) many thans::))))
WOW! I can’t believe what I’ve just saw! ? It’s gonna make my life so much easier! As a freelance website designer, time is VERY important to me and I already build sites in no time thanks to your amazing layouts and builder, now I’ll be able to style anything in no time too ? Elegant themes is definitely the best company I’ve seen in terms of updates! Thank you so much!!!
With this update, the entire design tool is now much more robust (Filters, Transformation, Size, Position, rotation, animation). We appreciate how easy it is now to design a website with Divi.
Now it’s time for updates to extend functions about Header and Footer Theme Builder, or at least the Woocommerce modules?
Thanks !!
+1
+1
x2
@NickRoach
+2,000,000,000
I really, really need a Header/Footer theme builder. Like, really badly. When my lower-budget clients, who can’t afford custom themes, expect to reap Divi’s benefit of being able to maintain their own sites, not having a Header/Footer theme builder is a major hindrance.
The Theme Builder is coming and we are working really hard on it! We know how important the feature is and how much people want it, and you can be sure that we are putting a lot of resources towards it.
The next feature to be released will be Global Defaults, which is a great precursors to the Theme Builder. You can think of it as the “Theme Designer”. Another important feature that is coming soon that will be great in combination with the Theme Builder is the WooCommerce Builder.
It’s all going to come together really nicely, but we need to take one step at a time and we need to take the time to do it right. You can expect all this stuff to launch within the next month or two.
Thank you, Nick. That’s very good news.
Thank you, Nick. That’s very good news.
You guys promise this theme builder for years. 🙁
The term Theme Builder didn’t exist years ago 🙂 We started working on it last 10 months ago and we hope to be finished soon.
hello I look forward to this postponement with impatience woocommerce and that of the footer
Awesome news! I will look forward to the release of these in the next two months – most specially the WooCommerce Builder.
Thanks Nick
Brilliant improvements all the time. I am delighted that I starting using Divi for all my clients over the past few years.
Keep up the good work.
I like what you have planned, Nick. And I like your attitude.
“within the next month or two”… Just to be clear, does that include the launch of the Theme Builder, or just Global Defaults and WooCommerce Builder? Thanks!
All three of them 🙂
Great news Nick! Keep up the good work. 🙂
Wow Nick, that’s not only amazing news, but that’s also not often that you’re firm on release dates that way! You guys continuously improving after the years… And continue to impress me! <3 And that comes from a guy who built his first "ET" website on…Foxy 🙂 Divi was still a brainchild at that time 😀
That’s great news.
Header footer builder would also be an awesome addition. Flatsome theme has a cool header/navigation builder. It would be great to see something similar (or better 🙂 ) in divi.
Header and footer builder is(I believe) included in the Theme Builder.
Global Defaults and WooCommerce Builder – can’t wait! Sizing and spacing controls are very important and cool too, no more custom CSS for min-height 🙂
+1
YES
Wow Amazing !! Great !! Thanks
It just came alive for me in the appearance tab and open the divi view for templates
The update does not appear yet. How long does it take to leave available?
You have to go into dashboard/appearance/themes. At the top of the divi icon you will see update available
Yeah, I don’t see it yet either. Usually the update is rolled out the same time as the announcement. Seems that’s no longer true.
Oops, this post went live at the wrong time! The update is rolling out shortly.
I am getting thick dark gray borders now on every content module if I “touch” / edit content in an existing module. Had to roll-back to previous version.
This has been fixed in Divi 3.22.1. Thanks for reporting the issue ?
I had the same problem. Glad to hear the fix is coming but I tested today and still had this issue. Ill try on my 127.0.0.1 site again tomorrow.
When Nick? Give us a date!
You guys are absolutely amazing
what abut on tablet and phone view ? will we able to make changes there as well without loosing desktop work?
Yep, if you have Responsive Editing enabled for margin, padding, height or width, then the changes you make on the page while any particular responsive view mode is enabled will be applied to that specific breakpoint.
This is good that each adjustment gets set for each breakpoint. It would though be handy if we didn’t have to go into the settings panel to do this. Having it happen automatically would be a better user experience. In fact having responsive on by default would be better all round, accepting that there may be a logical reason that I am not seeing.
Where in the settings panel do we set ‘responsive’?
I’ve always just manually set my parms.
You hover to the right of the setting name and three icons appear, the one that looks like a phone triggers display of the responsive settings tabs.
But there is no draggable options then. You have to do it as always…
I would like to know It too
I do not quite understand that – where can I find this attitude?
Simply without words.
Very Gooood Job !
no problem nick .. when 😀 ??