Scroll

Виджеты - Галереи

Media Gallery Thumbnail List

2014-10-06_15_20_00-Moto_CMS.png

Media Gallery Thumbnail List позволяет создавать область с миниатюрами, при клике на которые происходит открытие полноразмерного изображения в другом виджете галереи (Media Gallery Lightbox или Media Gallery Preview).

Для того, чтобы добавить изображения в “Media Gallery Thumbnails” вам нужно добавить данный виджет в поле панели управления и дважды нажать на него, затем откроется панель в которой вы сможете добавить изображения. Вам будет предложено выбрать размер для миниатюр и для изображений на предпросмотр.
2014-10-08_21_15_41-Moto_CMS.png

Также для него доступны две вкладки в панели свойств виджета - "Свойства" и "Эффекты". Может хранить, как изображения, так и видео.
748.png

Во вкладке "Свойства" есть следующие следующие параметры:

  • "Название" - позволяет изменить название виджета для удобства использования.
  • "Widget Connection ID" - позволяет соединять данный виджет с другими виджетами галерей. Для всех виджетов, которые связываются, должен быть указан идентичный набор символов. 
  • "Prevent Second Click" - включает/отключает необходимость второго клика по изображению.
  • "Item To Start From" - предоставляет возможность выбора показа стартового изображения в галерее.
  • "Orientation" - выбор ориентации галереи. Может быть горизонтальной или вертикальной.

Вкладка "Item settings" - позволяет производить более глубокую настройку элементов виджета. Среди доступных настроек:

1) Item Creation Delay (время появления миниатюры, может быть от 0 до 5 секунд)
2) Item Corner Radius (скругление углов рамки вокруг миниатюр, может быть в промежутке от 0 до 9999)
3) Item Border Width (ширина рамки вокруг миниатюры, может быть в промежутке от 0 до 1000 пикселей)
4) Item Border Color (цвет рамки вокруг миниатюры)
5) Item Border Alpha (прозрачность рамки вокруг миниатюры, может быть в промежутке от 0 до 100%)

Вкладка "Horizontal/Vertical settings" - позволяет проводить более глубокую настройку поведения миниатюр при выборе вертикальной или горизонтальной ориентации. Для данного подраздела доступны: 

1) Rows/Columns (количество строк/столбцов)
2) Item Width/Heigth (ширина/высота миниатюры)
3) Vertical/Horizontal Spacing (вертикальный/горизонтальный отступ)
750.png 751.png

  • Вкладка "Arrow settings" - дает возможность редактировать настройки стрелок. 

888.png
1) Arrows Width (ширина стрелок)
2) Arrows BG Color (цвет фона стрелок)
3) Arrows BG Alpha (прозрачность фона стрелок)
4) Arrows Color (цвет стрелок)
5) Arrows Alpha (прозрачность стрелок)
6) Arrows Corner Radius (скругление стрелок)

Вы можете привязать к каждому изображению миниатюры: страницы, всплывающие, внешнего URL или файл.
2014-10-08_21_17_53-Moto_CMS.png

Media Gallery Preview
2014-10-06_15_22_19-Moto_CMS.png

Виджет Media Gallery Preview предназначен для демонстрации изображений и видео, как самостоятельно, так и в паре с виджетами типа Media Gallery Thumbnail List. Для него доступны две вкладки - "Свойства" и "Действия".
2014-10-08_21_20_45-Moto_CMS.png

887.png

Во вкладке "Свойства" есть следующие следующие параметры:

  • "Название" - позволяет изменить название виджета для удобства использования.
  • "Widget Connection ID" - позволяет соединять данный виджет с другими виджетами галерей. Для всех виджетов, которые связываются, должен быть указан идентичный набор символов. 
  • "Enabled Slideshow" - позволяет включить/отключить показ слайд-шоу.
  • "Slideshow Delay" - дает возможность задать время между сменой изображений при включенном слайд-шоу (значение может быть в интервале от 1 до 30 секунд).
  • "Corner Radius" - дает возможность регулировать скругление для углов виджета (значение может быть в интервале от 0 до 9999).
  • "Border Width" - дает возможность регулировать ширину контура виджета (значение может быть в интервале от 0 до 20 пикселей).
  • "Border Color" - дает возможность регулировать цвет контура виджета.
  • "Border Alpha" - дает возможность регулировать степень прозрачности контура виджета (значение может быть в интервале от 0 до 100%).
  • Вкладка "Arrow Settings":

888.png
1) Arrows Width (ширина стрелок)
2) Arrows BG Color (цвет фона стрелок)
3) Arrows BG Alpha (прозрачность фона стрелок)
4) Arrows Color (цвет стрелок)
5) Arrows Alpha (прозрачность стрелок)
6) Arrows Corner Radius (скругление стрелок)

"Auto load & play"дает возможность включать показ слайд-шоу при запуске страницы.
"Sound volume" - дает возможность включать/отключать звуки виджета.
"Media controls" - дает возможность включать/отключать кнопки навигации по виджету. При включении ниже появляется вкладка "Mediaplayer skin".

Вкладка "Mediaplayer skin":
889.png

1) Background Color (цвет фона)
2) Background Alpha (прозрачность фона)
3) Elements Color (цвет элементов)
4) Elements alpha (прозрачность элементов)
5) Active color (цвет при наведении курсора)

"Предзагружать виджет" - дает возможность включать/отключать загрузку. 
"Спрятать прелоадер" - дает возможность прятать/отображать анимацию загрузки изображений или видео.

Media Gallery Lightbox
2014-10-06_15_25_53-Moto_CMS.png

С помощью Media Gallery Lightbox можно реализовать открытие полноразмерного изображения при клике по миниатюре. Существует достаточно много разновидностей данного виджета с дополнительными настройками, кнопками и дизайном. Для него доступна только одна вкладка в панели свойств виджета - "Свойства".
2014-10-08_21_22_35-Moto_CMS.png

 753.png

 Во вкладке "Свойства" есть следующие следующие параметры:

  • "Widget Connection ID" - позволяет соединять данный виджет с другими виджетами галерей. Для всех виджетов, которые связываются, должен быть указан идентичный набор символов. 
  • "Enabled Slideshow" - позволяет включить/отключить показ слайд-шоу.
  • "Slideshow Delay" - дает возможность задать время между сменой изображений при включенном слайд-шоу (значение может быть в интервале от 1 до 30 секунд).
  • "Enable Key Navigation" - включает/отключает навигацию по изображениям кнопками.
  • "Enable Mouse Wheel" - включает/отключает возможность прокручивания изображений колесиком мышки.
  • Вкладка "Colors" - позволяет редактировать цветовые решения в виджете.

1) Background Color (цвет фона)
2) Background Alpha (прозрачность фона)
3) Button Color (цвет кнопок)
4) Button Alpha (прозрачность кнопок)
5) Button background Color (цвет фона кнопок)
6) Button background Alpha (прозрачность фона кнопок) 
754.png

  • "Auto load & play" - позволяет включить/отключить показ слайд-шоу. 
  • "Sound volume" - позволяет редактировать громкость звука переключения изображений (может быть в интервале от 0 до 100%).
  • "Media controls" - позволяет включить/отключить кнопки навигации.

Вкладка "Mediaplayer skin" - помогает стилизировать внешний вид виджета и его элементов.
755.png

1) Background Color (цвет фона)
2) Background Alpha (прозрачность фона)
3) Elements Color (цвет элементов)
4) Elements alpha (прозрачность элементов)
5) Active color (цвет при наведении курсора)

"Предзагружать виджет" - позволяет делать так, чтобы виджет загружался вместе с прелоадером сайта (помогает ускорить время запуска сайта).
"Спрятать прелоадер" -  позволяет включить/отключить анимацию при переключении изображений.

Вот, как будет выглядеть данный виджет на предпросмотре:
2014-10-08_21_24_35-Girls_Fastpitch_Softball_-_tt.png

Была ли эта статья полезной?
Пользователи, считающие этот материал полезным: 2 из 2
Еще есть вопросы? Отправить запрос

Комментарии

На базе технологии Zendesk