Drag 'n Drop in AEM

One of the most common features of today's operating systems is the ability to quickly move files around from one location to another for ease of access and file organization. On a typical computer system, users are able to click down and hold on a file or folder; moving the object around with the mouse cursor. When the user releases, the object "moves" to that location, even if the cursor is on another folder or window. This is known as "drag 'n drop."

AEM itself features a robust suite of tools and components to get your pages uniform, clean, and presentable. But did you know, AEM also supports drag 'n drop functionality for portions of the user interface; making it quick and easy to get an asset uploaded, linked, and on-screen even easier than ever!

There are 3 main times when you may use drag 'n drop to help speed up the process of content creation and pushing it out live:

• When uploading any asset
• Linking text in a Rich-Text Editor (RTE)
• Displaying an asset directly

AEM supports drag 'n drop for the asset uploading process directly from your current view in the Author environment. You may drag multiple files of any allowed file-types directly from your computer's desktop/folder into the AEM instance, and the files will upload automatically to the currently-selected location. You will get a prompt while hovering the item(s) to be added that they are able to be dropped.

*Note: Please limit simultaneous uploads to no more than ~20 items at a time.

The Side Panel will need to be opened, as dragging and dropping occurs from the Assets tab within. Remember, the Side Panel opens by clicking on the Side Panel button from your page while in Edit mode.

Only a few components support direct dragging 'n dropping of certain content types. The noteworthy ones are below:

• Dynamic Media Component: Images, Videos
• Image Component: Images
• Teaser Component: Images

With freshly-inserted, blank versions of these components, you may then drag and drop the matching content type from the Side Panel onto the component directly on the page. The entire component will highlight blue to indicate it will successfully drop; no additional actions required.

As it turns out, you can also link items by simply highlighting any text in a Rich-Text Editor (RTE), and then dragging 'n dropping from the Side Panel. You may do this with documents or images only, and it will create the correct relative link that would also happen if you clicked the Selection Dialog button and clicked through all your folders instead. This is a huge time saver for those agencies that have deeply-nested assets, especially ones they just uploaded.

While linking, the item that is being drag 'n dropped will only link to your currently-selected text. This means you can quickly make multiple links in the same paragraph or block of text by linking only the portion of text you want. This also means that if you don't select any text, nothing will occur when you drop your document/image.

*Tip: Don't forget to "Open in New Tab" if you are linking .pdfs!

Hopefully the above tips and tricks will help speed along your process to getting new content uploaded into AEM, and then getting those items onto your pages and accessible as quickly as possible!