Drag & Drop File Uploads Are
Coming to the Visual Buidler!

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!

divi-vb-drag-drop-files-1

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!

The post Divi Feature Sneak Peek: Drag & Drop Files appeared first on Elegant Themes Blog.