Skip to main content

Gallery3x

омпонент Gallery3x поставляется с основным сниппетом [[!Gallery3x]], который отвечает за вывод изображений на страницах сайта. Сниппет разработан с упором на гибкость и производительность, позволяя создавать галереи любой сложности.

Ключевая особенность

Сниппет не создает превью "на лету". Он работает с уже готовыми, заранее сгенерированными изображениями, которые были созданы в админ-панели при загрузке файлов. Это обеспечивает максимальную скорость загрузки страниц для посетителей вашего сайта.


Сниппет [[!Gallery3x]]

Основная задача сниппета — получить все активные изображения для указанного ресурса, отсортировать их и передать данные в чанки для оформления.

Параметры

 

Параметр По умолчанию Описание
&resource ID текущего ресурса ID ресурса, из которого нужно вывести изображения. Используется, если &parents и &resources не заданы.
&parents null Список ID родительских ресурсов через запятую. Выбирает картинки из этих ресурсов и всех их дочерних. 0 — выборка со всего сайта.
&resources null Список ID ресурсов через запятую. ID с минусом (-) исключает ресурс. Имеет приоритет над &parents, если указаны положительные ID.
&tpl tpl.Gallery3x.item Имя чанка для оформления одного элемента (используется в простых выводах).
&tplOuter tpl.Gallery3x.carousel.outer Имя чанка-обертки для сложных галерей (например, каруселей).
&tplThumb tpl.Gallery3x.carousel.thumbItem Имя чанка для элемента в ленте превью (используется вместе с tplOuter).
&limit 0 Ограничение на количество выводимых изображений. 0 — без ограничений.
&sortBy position Поле для сортировки изображений.
&sortDir ASC Направление сортировки (ASC или DESC).
&showInactive 0 Если установить в 1, будут выводиться также и выключенные в админке изображения.
&where '' JSON-строка с дополнительными условиями выборки.
&debug 0 Если установить в 1, вместо галереи на странице будет выведен массив со всеми данными, которые сниппет подготовил.

Доступные плейсхолдеры

Сниппет передает в чанк все поля из таблицы компонента, а также автоматически генерирует URL для всех существующих превью.

  • [[+id]] - ID записи

  • [[+name]] - Название (title)

  • [[+description]] - Описание

  • [[+alt]] - Альтернативный текст

  • [[+file]] - Имя файла (например, my-photo.jpg)

  • [[+createdon]] - Дата загрузки

  • [[+size]] - Размер файла в байтах

  • [[+original_url]] - URL к оригинальному изображению

  • [[+small_url]] - URL к превью 'small'

  • [[+medium_url]] - URL к превью 'medium'

  • [[+любое_имя_превью_url]] - Если вы создадите превью с именем big, здесь будет доступен плейсхолдер [[+big_url]].


Примеры использования

Пример 1: Простая сетка изображений (как в демо lightGallery)

Этот пример выводит на странице сетку из миниатюр. При клике на любую из них открывается лайтбокс с полноразмерным изображением и лентой превью внизу.

Этот пример выводит на странице большую картинку, а под ней — прокручиваемую ленту миниатюр. Клик по миниатюре меняет большое изображение, а клик по большому изображению открывает лайтбокс.