Drag & Drop File Uploads Are
Coming to the Visual Builder!
Today we are excited to share with you that work is underway to bring an awesome new drag and drop file uploading system to Divi. Allowing you to add images, videos, galleries, text, code and even full layouts to your website by simply dragging those files onto the page you’re working on in the visual builder.
This feature will join a long lineup of design efficiencies that make working with Divi pure pleasure. The ability to create content by simply dragging elements onto the page will make it easier and faster than ever to bring your vision to life.
Drag & Drop to
Turn Files Into Contextual Content
When a file is dropped onto a page, Divi will be able to determine the file type and automatically create a new section, row, and the proper module to support it.
An image file will result in a new image module, a video file will result in a new video module, a group of images will result in a new gallery module, and so on. Just drag the file you want to add over the page you’re building and let Divi take care of the rest!
Supported File Types & How They Will Work
Here is a full list of supported file types and how Divi will handle them when you drag and drop them into a page where the visual builder is activated:
- Image file: A new image module will be added to the bottom of the layout in a new section and single column row. The image module settings modal will remain open as if an image module was added normally.
- Multiple Image files: Using the dragged images, a new gallery module will be added to the bottom of the layout in a new section and single column row. The gallery module settings modal will remain open as if a gallery module was added normally.
- Text/doc file: A new text module will be added to the bottom of the layout in a new section and single column row. The text module settings modal will remain open as if a text module was added normally.
- Video file: A new video module will be added to the bottom of the layout in a new section and single column row. The video module settings modal will remain open as if a video module was added normally.
- Audio file: A new audio module will be added to the bottom of the layout in a new section and single column row. The audio module settings modal will remain open as if an audio module was added normally.
- HTML file: A new code module will be added to the bottom of the layout in a new section and single column row. The code module settings modal will remain open as if an code module was added normally.
- JSON file: This will trigger the page level Portability System Modal, focusing on the “Import Tab” and populate the “Choose File” field.
- CSS file: This will add the dragged css to page level css. This will be added to the bottom of any existing css..
- Font files: This will trigger our add custom font modal outside the context of any specific module.
Divi. Better Every Week.
That’s all for this week’s sneak peek but don’t forget to come back next week (and every week after) for more insights into how we’re working to make Divi the absolute best way to design websites with WordPress.
Also, as we’re sure you’re aware of if you’ve been following along with our sneak peeks and feature releases, we’re now releasing a new Divi feature each and every week. As of a last week’s release of Quick Access, every feature release is now a feature that we’ve teased in our ongoing sneak peek series. You’ve probably also noticed that features are not all being released in the order that they were teased. There is a very simple and straightforward reason for this. Some features take more time to implement. And some features are dependent on other features coming out before them. So don’t worry, if the feature you’re most excited about hasn’t come out yet it’s not because we’re not working on it. Just keep tuning in each week and watch as Divi becomes better and better. You’re favorite feature will be here just as soon as it’s ready!
Great feature. Is there a plugin or any type of mod that I can use *now* to perform this trick of dnd images into builder?
thanks,
m
The way you plan to handle different kind of files looks awesome, can’t wait to get this update
Thanks to ET for really making my development easier. I’m a lifer and eagerly looking forward to your header and footer implementations… All the best!
Rick
XTREME IT
It is a great idea. It will help us to design much quicker. Will the dropped files are stored in the media and be available for other pages too ?
If anyone needs help with headers… I have a plugin that works with DIVI to make custom headers… give me a shout!
Great idea, again.
Can you tell me how big of an audio file you can upload to your divi site without the whole thing slowing down? I would prefer to have my audio snippets not on someone else’s server.
Look forward to it
Your new features coming are awesome. Thank ET for you dedication to your customers. Purchased the lifetime as well and like the guy above a super investment with more and more value all the time. Thanks can’t wait for them to arrive.
I find myself using the visual builder more and more. I sense the impending death of the divi backend builder lol…The backend builder hasn’t gotten any love in like forever.
A lot of Divians are getting antsy about the header and footer feature lol. I’m more excited about the divi builder in any post types and multisite haha.
Keep it up ET Team!
If we can get something that will help us change the header navigation styles, that would be the best thing ever to happen.
Hi,
Thank you for this new feature but I have a complaint. I’m working on your divi builder for making it compatible with our theme. Just refer to below document and try ti make a new module with this. Check to see if you can create a module with us or not.
It is a bit complicated and messy, I even searched and found couple of add-on but it was messy and confusing that I didn’t understand nothing.
https://www.elegantthemes.com/documentation/developers/divi-module/how-to-create-a-divi-builder-module/
This sounds like an AWESOME and very useful feature. What I would love to see is the ability to literally drag and drop elements onto the page and place them precisely where wanted when the mouse is let go. This reminds me of one of the very early drag and drop web design tools I used many years ago. It was before it’s time but the idea was still waaaaaaaay cool!
Nice new feature. When will it be ready?
Divi just keeps getting better and better! Thanks team!
only what doubt, what will happend with optimizador.io plugin?, work optimize picture, but with this moder, continues working normally? i hope somebody has tray.
Super! ..finally
I agree
I’m so looking forward to using this option. Divi is becoming more user friendly and time saving. Cant wait to use it!
Please add more option in customizer to change header settings. Like menu height and add option to make logo full width on centered layout etc.
Oh Good Post Tnx
You guys rock. I have been with you for many years, even before Divi and watched it all unfold patiently. Your commitment to improving your flagship product is amazing and seeing where it is heading gets more exciting every day.
Slow and steady wins the race and opening your emails everyday I feel like a kid in a candy shop.
Well done and can’t wait for tomorrow.
Divi is getting better and better. I believe buying the lifetime subscription in 2016 may have been the best thing I have ever done – professionally speaking.
Now I am waiting for dropdown click-throughs or custom actions from dropdown option selection.
I hope you’ll be able to make it in a way that you can drop the file on top of an existing module to replace it. E.g. you have a layout you like but want to replace a e.g. a video but still keep the customization.
Things like these upcoming features is a good enough reason to have a subscription. I for one am a happy developer that took the risk ages ago on a Lifetime subscription. To be honest, not only have I never regretted that decision, but over time the value of that investment has increased. The best part is that at times I wish a feature existed and after a while it actually does e.g. Divi divider styles. Worth every penny.
+1
I agree with every word you said. Divi rocks!
Thanks ET!
Sorry guys, but a lot of good Divi Feature Sneak Peeks but never get to be an update. So sad… you are falling behind 🙁
One feature update a week now and one teaser video a week. This is full on progress.
Of course, they are working, hard, but should issue the most and oldest requests first or as a priority.
But they are releasing all those features more or less in the order of releasing those sneak peaks.
yes, I know and I appreciate their work, but they are not including the most and oldest request of the community, and this is not good. Sneak peeks are just smoke for now, because this “future releases” are already included in other builders.
I used to be a Divi lover, really, I have the lifetime license, but now I have released 4 o 5 new websites with other builders 🙁
Wowwwwwwwwww! That’s all I got.
I suspect big news with version number 4.
This is very awesome- thank you for the effort.
My concern is, how many of these concurrent projects are taking away from timely completion of any of the projects?
Ability in VB to modify header, footer, 404, search, blog pages?
Global styles for h1-h6, spans, buttons
and of course, current bug fixes which are numerous.
Awesome feature. Thank you ET.
I would never have thought of that. Nice idea, might save a little time.
I love all these features, really I do but I just cannot help but wonder when will we get the header and footer mod feature. Hate to sound like a old stuck record though.
I know it’s being worked on. I imagine it’s a bigger update. They usually have separate teams working on their more regular releases and feature updates, and for the bigger major updates like header/footer. That way they’re still giving fresh new features, while the bigger updates are being worked on by another team.
(I remember reading this, but unfortunately do not remember the source)
+1. I recently resorted to purchasing a plugin for header and footers which is not an ideal situation and I am sure a solution from Elegant Themes would be more …. elegant. As above I do like these iterative features coming out but would really be grateful for accelerated release of additional header / footer features.
Agreed. The biggest issue I have with Divi is my struggle to get the Headers to work consistently without custom CSS or other Nav Plugins that conflict.
Please, Please, Please… Really, Please make the Headers and Footers as AWESOME as you are making other aspects of the Builder…
You guys are really making some great productivity and design improvements, but the Headers & Footers need some Real Love…
Please do the great things you do with them… 🙂
We ALL Can’t wait! 😉
If anyone needs help with headers… I have a plugin that works with DIVI to make custom headers… give me a shout!
It takes next to nothing to code a custom header. Unless you have no coding knowledge, this shouldn’t be an issue. Divi can do decent to great things on its own, but it really comes alive when you do custom development for it. It’s not a Swiss Army Knife of web design.
Reckon headers and footers will come in a big update which will address a lot of things in one go. Divi 4 let’s say.
I DIVI 4.0 is just the custom post type update.
Soon I think.
I feel you, I too requesting for the very same feature since long.
Upload files in a contactform should be awesome!! Its missing that right now.