1.1.3releasedMedia Library

Display all files and directories under Uploads in a library view.

Clone URLhttps://github.com/pixelninja/media_library.git

Add as a submodulegit submodule add https://github.com/pixelninja/media_library.git extensions/media_library --recursive




Media Library

An easy way to manage your uploads.


  • Upload the /media_library folder to your Symphony /extensions folder.
  • Enable it by selecting "Media Library", choose Enable from the with-selected menu, then click Apply.


In the main navigation, there should now be a Media Library item. Clicking the icon will take you to the physical page, while clicking anywhere else on the link will open the media library within a lightbox.

With this extension you can:

  • Upload multiple files at once using drag/drop
  • See all files within the /workspace/uploads directory
  • Navigate through subdirectories
  • Preview files
  • Copy the file path to your clipboard
  • Delete files
  • Filter files by keyword (min 3 characters)
  • Tag files with comma separated keywords, for use in filtering products
  • Combine with the Tiny MCE editor to create a filepicker option within image/media options


To use tagging, the tags.json file needs to be writable. Make sure the file permissions and file ownership allow this.

To use the media library within the TinyMCE editor, add this snippet to your TinyMCE javascript file within the init function:

file_picker_types: 'image media', file_picker_callback: function(callback, value, meta) { ml_source_input = callback; localStorage.setItem('add-to-editor', 'yes'); $('#nav .ml-link').trigger('click'); },

Now, when clicking the image or media icon within the editor, there will be a file icon next to the source field. Clicking this will open the media library, and instead of copying to clipboard being an option, it will say add to editor. This will add the file source and the file name to the source and alt fields.

To do

  • ~~Test on production environment, permissions?~~
  • Add image manipulation tool for editing on the fly, e.g https://github.com/pqina/filepond
  • create a Media Library field, which acts in place of the Upload field
  • (maybe) option to replace/overwrite an image
  • (maybe) Check if files are in use
  • (maybe) link with JIT extension for images to copy URL with recipe
  • ~~Add in on-the-fly filtering by name~~
  • ~~Check if uploads field exists~~
  • ~~Upload files?~~
  • ~~preview other file types (not just images)~~
  • ~~delete files~~
  • ~~lightbox on images and videos~~
  • ~~Copy URL button~~
  • ~~Use AJAX to load subfolders nicely~~
  • ~~Use AJAX to load in Library from any page without losing context~~
  • ~~Multilingual support~~
  • ~~TinyMCE text formatter button~~
  • ~~key word Filtering~~
  • ~~Tagging for better filtering~~

Version history

Requires Symphony 2.7.x

  • Add a tag count to the Tags link, and add hover state showing tag content
  • Ignore changes to the json file

Requires Symphony 2.7.x

  • Tagging bug fixes

Requires Symphony 2.7.x

  • Tagging bug fixes

Requires Symphony 2.7.x

  • Added ability to tag images, which are searchable

Requires Symphony 2.7.x

  • Update so deleting works within lightbox
  • Bug fixes

Requires Symphony 2.7.x

  • Remove unused plugins and add clipboard into extension js file for fewer requests
  • Add AJAX call for page fetching
  • Combine this plugin with TinyMCE plugin to work within editors

Requires Symphony 2.7.x

  • Removed Featherlite, and open previews in a new tab instead

Requires Symphony 2.7.x

  • Order files by date instead of name
  • Hide directories by default. A button has been added for toggling their visibility
  • Added an input for filtering files based on a keyword match

Requires Symphony 2.7.x

  • Restructured the way files are displayed
  • Added loads of features

Requires Symphony 2.7.x