Jump to main content Jump to doc navigation

Gallery is a dynamic Gallery Extra for MODX Revolution. It allows you to quickly and easily put up galleries of images, sort them, tag them, and display them in a myriad of ways in the front-end of your site.

A tutorial has been made for Gallery by the community, and can be downloaded here: Tutorial - Gallery Component with Galleriffic.pdf

Another small tutorial about setting up an album with Gallery can be found here: https://www.sitsol.be/blog/modx-gallery


  • MODX Revolution 2.0.0-rc-2 or later
  • PHP5 or later
  • php-mbstring Enabled

Historyand Info

Gallery was written by Shaun McCormick (splittingred) as a dynamic Gallery component, and first released on February 5th, 2010.


It can be downloaded from within the MODX Revolution manager via Package Management, or from the MODX Extras Repository, available here: https://modx.com/extras/package/gallery

Development and Bug Reporting

Gallery is stored and developed in GitHub, and can be found here: https://github.com/modxcms/Gallery


The Gallery snippets can be called using the tags:

[[Gallery? &album=`My Album`]]
[[GalleryAlbums? &limit=`10`]]


Gallery comes packaged with 3 snippets - one called "Gallery", which displays a gallery from either an Album, a Tag, or both; a snippet called "GalleryAlbums", which displays a list of Albums; and a snippet called "GalleryItem", which displays a single Gallery Item.

System Settings

You can change the place where you store your Gallery images by changing the following settings:

gallery.files_path The absolute path of a folder to store images in.
gallery.files_url The web-accessible URL that you can reach gallery.files_path from.

As of version 1.3.0 you can also enable and control a TinyMCE integration for Gallery item descriptions. These settings are included:

key description
gallery.use_richtext Set to yes (true) to enable the TinyMCE integration. Note that you will need to have the TinyMCE Extra installed in order for this to work.
gallery.tiny.width Width of the text editor in either pixels or a percentage.
gallery.tiny.height Height of the text editor in either pixels or a percentage.
gallery.tiny.buttons1/2/3/4/5 Buttons to display on the different rows (1 through 5). When empty this will inherit from the main TinyMCE settings.
gallery.tiny.custom_plugins A comma separated list of plugins to load. When empty this will inherit from the main TInyMCE settings.
gallery.tiny.theme_advanced_blockformats Block formats to use in the drop down box. Inherits from main TinyMCE settings when empty.
gallery.tiny.theme_advanced_css_selectors CSS Selectors to choose from. Inherits from main TinyMCE settings when empty.

Using the Custom TV

Gallery comes packaged with a custom TV input and output type for managing Gallery images in the backend. You can crop, resize, rotate, and more with it. Please see the following article for more usage:

Gallery allows you to display your galleries either straight as thumbnail images in the front-end, or using jQuery plugins. You can pass a plugin name through the Gallery snippet. Currently, the only available plugin is for Galleriffic.

Gallery ships with a custom manager page (can be found in the Components top menu) where you can manage your albums. You can create new ones, and use the name you give it in the Gallery snippet to retrieve that specific album. After you have created an album you can right click and update it to manage the photos associated with it.

You can use four different types of uploading. Either single item upload (optionally with a rich text description, see the system settings explained above), multi upload, bulk upload which searches a folder on the filesystem and imports the images found, or zip upload which unpacks a zip file.

Gallery ships with a custom Media Source type that can be used to show your Albums and their items in the left-hand tree in the manager. Simply create a new Media Source with type "Gallery Albums", and Gallery will handle the rest.


A sample code line for a Galleriffic-powered gallery for the album "My Album".

[[!Gallery? &album=`My Album` &plugin=`galleriffic`]]

Grab the first 10 photos tagged "Fun":

[[!Gallery? &tag=`Fun`]]

Grab all photos in the album "My Album" with tag "Blue":

[[!Gallery? &album=`My Album` &tag=`blue`]]

See Also

  1. Gallery.Gallery
    1. Gallery.Gallery.containerTpl
    2. Gallery.Gallery.thumbTpl
  2. Gallery.GalleryAlbums
    1. Gallery.GalleryAlbums.containerTpl
    2. Gallery.GalleryAlbums.rowTpl
  3. Gallery.GalleryItem
    1. Gallery.GalleryItem.albumTpl
    2. Gallery.GalleryItem.GalleryItemPagination
    3. Gallery.GalleryItem.tagTpl
    4. Gallery.GalleryItem.tpl
  4. Gallery.Plugins
    1. Gallery.Plugins.Galleriffic
    2. Gallery.Plugins.Slimbox
  5. Gallery.Setting Up Your Gallery
  6. Gallery.Example1
  7. Gallery.Setting Up the GalleryItem TV

Support the team building MODX with a monthly donation.

The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.



$0 per month—let's make that $500!

Learn more