Overview

Gallery3x3 min readPage 1 of 22
On this page 4

Gallery3x is a gallery component for MODX 3. It keeps images, videos, file attachments and embedded objects (maps, widgets) for each resource and outputs them on the site with snippets in any markup.

The component was created as a replacement for ms2Gallery, which has no MODX 3 version: similar features, but on the MODX 3 architecture and with a ready-made script for migrating galleries from ms2Gallery.

Working with Gallery3x in the manager

Highlights

  • Thumbnails are prepared in advance. All sizes are generated once on upload (the Glide library) and ready files are served — pages are never slowed down by image processing.
  • Any markup. Snippets pass all fields and the URLs of all thumbnails to chunks; ready-made chunks for Fancybox, lightGallery and Fenom examples are included.
  • Four kinds of content: images, videos (YouTube, Rutube, VK, Vimeo, Dailymotion, Coub, OK.ru, Dzen, Kinescope), file attachments and embed blocks.
  • Groups (tags) for images, videos, files and embeds — a filter in the manager and the &group parameter in snippets.
  • Different media sources for different templates — separate thumbnail sizes and watermark for the catalogue, the blog, etc.

In the manager

On the resource page (for templates listed in gallery3x.templates) these tabs appear:

  • Gallery G3x — images: drag-and-drop upload (including many files at once), a paginated thumbnail grid, sorting by dragging, multiple selection, a group filter.
  • Video G3x — video links; title, description and cover are filled in automatically (enabled with gallery3x.video_enable).
  • Files G3x — attachments: PDF, DOC, ZIP, etc. (gallery3x.files_enable).
  • Embed G3x — maps, widgets, iframes by link or ready-made code (gallery3x.embed_enable).

The right-click menu on an image: edit properties (title, alt, description, groups, extra fields), enable/disable, mark as “special”, regenerate thumbnails, delete (the record and all files on disk). For selected images — bulk group assignment.

The visual editor (CKEditor, TinyMCE RTE) gets an “Insert from gallery” button — see Inserting galleries in the visual editor.

On the site

  • [[!Gallery3x]] — images; [[!Gallery3xVideos]] — videos; [[!Gallery3xFiles]] — files; [[!Gallery3xEmbeds]] — embeds; [[!Gallery3xMixed]] — images and videos together.
  • Selection by the current resource, a list of resources or child resources, by group, by specific IDs, with sorting, a limit and &where conditions.
  • Fenom mode (pdoTools), data as an array/JSON (&return, &toPlaceholder), debugging with &debug.
  • Placeholders [[+g3x.0]], [[+g3x.0.medium]] without a snippet call; g3xGetImage — a thumbnail URL by ID (for pdoResources and Collections).

Installation and maintenance

  • Installation creates tables, system settings and the “Gallery3x Source” media source (its ID is written to gallery3x.source_id), and installs pdoTools if it is missing.
  • Thumbnail sizes are JSON in the media source properties; the format (WebP by default), filters and watermark are system settings.
  • Command-line scripts: regenerate all thumbnails, import from ms2Gallery, clear galleries by template.
  • When the MODX trash is emptied, the files of deleted resources are removed from disk.

Requirements: MODX 3, PHP 8.2+, the Imagick (recommended) or GD extension.