Skip to content

Installation

Media Directories is a meta-package: the base module gives Media entities a directory field, and each submodule layers a specific editor feature on top. You only enable the pieces you actually need.

Requirements

  • Drupal: 11 or 12. The base module also supports 10.2, but media_directories_browser and everything built on it requires 11+.
  • PHP: whatever your Drupal core version requires.

The base media_directories module depends on these core modules: media, media_library, taxonomy, views.

Install with Composer

composer require drupal/media_directories

Then enable the submodules you want — see the pages below for what each one does and how to configure it.

Coming from an older release?

If you're moving an existing site off the deprecated media_directories_ui / media_directories_editor submodules, follow the Upgrading guide — it covers switching widgets and how image field displays are migrated automatically when you uninstall the editor.

# Required base.
drush en media_directories

# Recommended editor experience (Vue.js browser + CKEditor 5 integration).
drush en media_directories_browser

Pick your submodules

Submodule When you need it
Base module Always — the directory field lives here.
Browser You want the Vue.js media browser and the CKEditor 5 button.
File link Editors should be able to insert file download links inside CKEditor 5.
AI You want AI-generated alt text or AI-translated media metadata.
Canvas You use the Drupal Canvas page builder and want media selected through the browser there.
Image resize Inline images in rich text should be physically resized to the dimensions set in the editor.
Compatibility You're migrating from entity_embed-based embeds and need legacy markup to keep rendering.

Suggested companion modules

These aren't strictly required, but Media Directories gets noticeably more useful with them installed. They are listed under suggest in the project's composer.json.

Package Why you'd want it
drupal/svg_image Adds SVG support to image fields used by media types.
drupal/focal_point Enables focal point selection inside the media browser.
drupal/ai Required by media_directories_ai for AI-generated alt text and translations.
drupal/canvas Required by media_directories_canvas to use the browser inside the Canvas page builder.

Verifying the install

After enabling the modules you want:

  1. Visit /admin/config/media/media_directories and confirm a vocabulary is selected.
  2. If you enabled media_directories_browser, open /admin/content/media-browser — the Vue.js browser should load with your directory tree on the left and a media grid on the right.
  3. If you enabled media_directories_ai, open the AI tab on the settings page and confirm the form is reachable (you'll wire it up to a provider on that page).