Skip to content

Media Directories

Media Directories adds a directory (folder) structure to Drupal Media entities, backed by a taxonomy vocabulary. On top of that it ships a Vue.js media browser and a set of CKEditor 5 integrations that let editors organise, find and embed media without leaving their content.

The Vue.js media browser with directory tree on the left and media grid on the right

What's in the box

The project is a meta-module made up of several smaller modules. Each one has its own installation/configuration page — start with the base module and add the others as you need them.

Module Purpose Setup
media_directories Directory field on Media entities and Media Library integration. Base module
media_directories_browser Vue.js media browser and CKEditor 5 integration. Browser
media_directories_file_link CKEditor 5 plugin for inserting file download links. File link
media_directories_ai AI-powered alt text generation and translation. AI
media_directories_image_resize Resizes inline images in rich text via explicit width/height attributes. Image resize
media_directories_compat Converts legacy <drupal-entity> embeds to <drupal-media> at render time. Compatibility

Where to go next

  • Installation — pick the submodules you need, see the suggested companion packages, and follow the per-submodule pages for the setup steps and configuration options.
  • Integrations — optional contrib and core modules (Focal Point, SVG Image, Content Translation, Entity Usage, …) and what each one unlocks inside the media browser.