This package provides a node type to easily render image galleries.

The installation is done with composer:

composer require dl/gallery

By default, the galleries CSS and JavaScript files are added to the header and footer includes of your page automatically on pages, where an instance of the gallery plugin is added. If you want to compile the JS / CSS into your pages main files you can deactivate this behavior via settings:

DL:
  Gallery:
    loadGalleryCSS: false
    loadGalleryJS: false

Add a new gallery node to your page and use the inspector add images from the media module or upload them directly.

1. Use tags or collections to group images

The images to show in a gallery need to be grouped by a tag or collection. To group images, go to the media module and add a new tag or collection. Drag and drop images onto this or select it in the image detail view.

2. Chose a tag in the plugins inspector

Add a new gallery plugin to your page. You can now choose a tag or a collection as the gallery source in the inspector. The images will then be rendered equally within the gallery.

The thumbnails of the gallery are displayed squared using a bootstrap grid. The lightbox photoswipe is used to open a large representation of the image.

Uses justified.js to display the thumbnails and also photoswipe as lightbox.