Skip to content
msReviews
msReviews
Отзывы, рейтинг, Q&A и JSON-LD для MiniShop3
  • MODX 3
  • PHP 8.2
  • miniShop3
  • Vue 3
  1. Компоненты
  2. msReviews
  3. Интеграция на сайте
  4. msReviewMediaGallery

Сниппет msReviewMediaGallery ​

Выводит горизонтальную галерею опубликованных фото из отзывов по товару. Разметка собирается из чанков, не из PHP.

Назначение ​

Миниатюры фото из отзывов. По умолчанию lightbox (mediaLinkMode=lightbox). anchor — к секции отзывов. raw — плейсхолдеры без служебных атрибутов (свой lightbox).

Где вызывать ​

  • Шаблон msProduct, между msRatingSummary и msReviews.
  • Передайте hideEmpty=1, чтобы скрыть блок без фото.

Зависимости ​

  • MiniShop3, msReviews, pdoTools 3.0+
  • Настройка msreviews_media_enabled
  • Lightbox: сниппет подключает reviews.js при наличии фото (если registerJs=1). Строки UI идут через msReviewsLexiconScript

Параметры ​

ПараметрПо умолчаниюОписание
product_idid ресурсаID товара MS3
limit24Максимум фото (1–100)
tpltplReviewMediaGalleryЧанк-обёртка (плейсхолдер gallery_body)
bodyTpltplReviewMediaGalleryBodyСписок фото или empty-state
itemTpltplReviewMediaGalleryItemЧанк одного фото
mediaLinkModelightboxlightbox / anchor / raw
galleryGroup(пусто)Значение для data-fancybox и аналогов
thumbSize160width и height превью
hideEmpty1Не выводить без фото
showHeading1Заголовок <h3> «Фото из отзывов»
reviewAnchor(пусто)Якорь секции отзывов (для anchor или вместе с режимом)
registerCss1Подключать reviews.css
registerJs1При 1 всегда подключается лексикон. reviews.js добавляется при lightbox и непустом списке. При 0 остаётся только CSS

Плейсхолдеры item: url, href, link_class, img_class, link_attrs, img_width, img_height, author_name, review_id, media_id, rating, gallery_group, review_anchor, label_open, link_html. Body: items, gallery_group, list_empty.

Миниатюры с атрибутами lightbox, диалог — reviews.js. Пустой reviewAnchor — типовой сценарий.

Сначала msReviewsLexiconScript, иначе подписи кнопок — fallback в JS.

fenom
{'!msReviewsLexiconScript' | snippet}
{'!msReviewMediaGallery' | snippet : [
  'product_id' => $_modx->resource.id,
  'limit' => 12,
  'hideEmpty' => 1
]}
modx
[[!msReviewsLexiconScript]]
[[!msReviewMediaGallery?
  &product_id=`[[*id]]`
  &limit=`12`
  &hideEmpty=`1`
]]

Переход к секции отзывов ​

fenom
{'!msReviewMediaGallery' | snippet : [
  'product_id' => $_modx->resource.id,
  'limit' => 24,
  'mediaLinkMode' => 'anchor',
  'reviewAnchor' => '#msreviews-reviews',
  'hideEmpty' => 1
]}
modx
[[!msReviewMediaGallery?
  &product_id=`[[*id]]`
  &limit=`24`
  &mediaLinkMode=`anchor`
  &reviewAnchor=`#msreviews-reviews`
  &hideEmpty=`1`
]]

Свой lightbox (Fancybox 5) ​

Чанк tplGalleryItemFancybox (Fenom):

fenom
<li class="product-gallery__item">
  <a href="{$href}" data-fancybox="{$gallery_group}" data-caption="{$author_name}">
    <img src="{$url}" alt="{$author_name}" loading="lazy" width="{$img_width}" height="{$img_height}" />
  </a>
</li>
fenom
{'!msReviewMediaGallery' | snippet : [
  'product_id' => $_modx->resource.id,
  'limit' => 24,
  'itemTpl' => 'tplGalleryItemFancybox',
  'mediaLinkMode' => 'raw',
  'galleryGroup' => 'review-media',
  'registerJs' => 0
]}
modx
[[!msReviewMediaGallery?
  &product_id=`[[*id]]`
  &limit=`24`
  &itemTpl=`tplGalleryItemFancybox`
  &mediaLinkMode=`raw`
  &galleryGroup=`review-media`
  &registerJs=`0`
]]

Инициализация: Fancybox.bind('[data-fancybox="review-media"]').

На странице товара ​

fenom
{'!msReviewsLexiconScript' | snippet}
{'!msRatingSummary' | snippet : ['product_id' => $_modx->resource.id]}
{'!msReviewMediaGallery' | snippet : ['product_id' => $_modx->resource.id, 'limit' => 12, 'hideEmpty' => 1]}
{'!msReviewsFilters' | snippet : ['product_id' => $_modx->resource.id, 'showCounts' => 1]}
{'!msReviews' | snippet : ['product_id' => $_modx->resource.id, 'showStats' => 0]}
modx
[[!msReviewsLexiconScript]]
[[!msRatingSummary? &product_id=`[[*id]]`]]
[[!msReviewMediaGallery? &product_id=`[[*id]]` &limit=`12` &hideEmpty=`1`]]
[[!msReviewsFilters? &product_id=`[[*id]]` &showCounts=`1`]]
[[!msReviews? &product_id=`[[*id]]` &showStats=`0`]]

Чанки: Чанки — галерея. Миграция: Обновление до 1.2.

См. также ​