[rms] Слайдеры

Введение

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

Установка модуля

Модуль поддерживает автоматическую установку через UMI.Market. Для автоматической установки модуля:

  1. Сделать полный бэкап системы
  2. Обновить UMI.CMS до последней версии
  3. Купите модуль в ЮМИ Маркете 
  4. Обновите систему еще раз

Если у вас истек срок поддержки системы, обратитесь ко мне для ручной установки модуля! Установка модуля бесплатна!

Для пользователей

Информация по настройке и использованию модуля [rms] Слайдеры. Добавление и редактирование слайдеров, добавление и редактирование настроек слайдов.

Добавление слайдера

 Для добавления нового слайдера откройте модуль [rms] Слайдеры и нажмите кнопку «Создать новый слайдер». Откроется форма для редактирования настроек слайдера.

Настройки слайдера:

  • Название — произвольное название слайдера, например, «Слайдер на главной странице»
  • Идентификатор — произвольный, но уникальный в разрезе модуля текстовый дескриптор слайдера, например, «slider_on_index_page». По идентификатору слайдер добавляется на страницы вашего сайта. Не должен состоять из цифр
  • Высота — настройка высоты слайдера
  • Автоматический запуск — настройка для автоматического пролистывания слайдов

Для сохранения настроек слайдера нажмите кнопку «Добавить».

Добавление слайда с текстом

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

Для добавления нового слайда в слайдер, откройте существующий слайдер на редактирование или создайте новый слайдер. Нажмите кнопку «Добавить слайд»

Откроется форма для редактирования настроек слайда. Обязательных полей нет, вы произвольно заполняете настройки, в зависимости от ваших целей.

Настройки подписи слайда:

  • Название — произвольное название слайда
  • Активен — поставьте эту галочку, чтобы слайд отображался в слайдере
  • Заголовок — заголовок слайда
  • Описание — информация под заголовком
  • Цвет текста — произвольный цвет текста для повышения читаемости текста
  • Цвет фона — цвет подложки под заголовком и описанием
  • Выравнивание текста — выравнивание текста. Допустимые значения: left, center, right

Настройки кнопки на слайде:

  • Надпись — текст на кнопке
  • Нажатие — javascript функция, которая вызывается по нажатию на кнопку
  • Ссылка — ссылка на страницу, которая откроется по нажатию на кнопку. При использовании этого параметра, значение параметра «Нажатие» игнорируется.

Настройки фоновой заливки слайда:

  • Цвет — произвольный цвет для фона слайда
  • Градиент — css стили для фона с градиентом

Настройки фонового изображения слайда:

  • Изображение по умолчанию — фоновое изображение, которое выводится по умолчанию для всех размеров экранов
  • Изображение для больших экранов — фоновое изображение для размеров экранов до 1024 пикселей
  • Изображение для средних экранов — фоновое изображение для размеров экранов до 768 пикселей
  • Изображение для маленьких экранов — фоновое изображение для размеров экранов до 480 пикселей

Настройки фонового видео:

  • Источник — видео файл

Корректирующие слои:

  • Наложение цвета — на фон слайда будет наложен полупрозрачный слой с выбранным цветом
  • Наложение градиента — на фон слайда будет наложен полупрозрачный фон с css стилями градиента
  • Наложение анимированных частиц — на фон слайда будет наложен хаос плагина ParticlesJs

Для сохранения настроек слайда нажмите кнопку «Сохранить и закрыть».

Добавление слайда с формой обратной связи

Слайд с формой обратной связи — это максимально короткий путь для мотивации пользователя откликнуться на ваше предложение и заполнить форму заявки!

Для добавления нового слайда в слайдер, откройте существующий слайдер на редактирование или создайте новый слайдер. Наведите курсор мышки на кнопку «Добавить слайд» и в выпадающем меню выберите пункт «Слайд с формой». Дальнейшие действия по настройке слайдера идентичны действиям при добавлении и настройке обычного слайда с текстом, однако у слайда с формой есть уникальные настройки.

Настройки слайда с формой:

  • Идентификатор формы — числовой идентификатор формы обратной связи, которая будет добавлена на слайд
  • Заголовок формы
  • Описание формы — выводится под заголовком
  • Инверсия элементов — используется для определения порядка вывода текста и формы в шаблоне. Если не выбрана эта настройка, то сначала выводится текст слайда, а затем форма. Если выбрана, то наоборот.

Добавление слайда с иллюстрацией

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

Для добавления нового слайда в слайдер, откройте существующий слайдер на редактирование или создайте новый слайдер. Наведите курсор мышки на кнопку «Добавить слайд» и в выпадающем меню выберите пункт «Слайд с иллюстрацией». Дальнейшие действия по настройке слайдера идентичны действиям при добавлении и настройке обычного слайда с текстом, однако у слайда с иллюстраций есть уникальные настройки.

Настройки слайда с иллюстраций:

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

Создание нового типа слайда

Если вам понадобился свой тип слайда, добавьте его через модуль «Шаблоны данных». Для этого откройте список существующих типов данных, выделите тип данных «Слайд» и нажмите на кнопку добавления нового типа данных.

Создастся дочерний тип данных, который унаследует поля типа данных «Слайд». Для нового типа слайда нужно указать наименование и GUID типа данных для удобной шаблонизации. В новый тип добавьте свои наборы характеристик. Новый тип слайда автоматически появится в выпадающем меню «Добавить слайд» на странице редактирования слайдера.

Для разработчиков

Данный раздел документации предназначен для разработчиков сайтов на UMI.CMS и посвящена средствам вывода информации — шаблонизации макросов модуля [rms] Слайдеры.

Макросы

Методы модуля [rms] Слайдеры, реализующие конкретные задачи использования модуля.

slider()

Макрос выводит слайдер с идентификатором, указанным в параметре sliderId.

rmsSlider slider(template = 'default', sliderId, order)
  • template — Имя шаблона, по которому следует вывести слайдер. В XSLT-шаблонизаторе игнорируется, можно указать любое значение
  • sliderId — Id объекта или строковый идентификатор слайдера, который необходимо вывести
  • order — Порядок вывода слайдов [0 - прямой порядок, 1 - обратный порядок, 2 - рандом]

Шаблонизация

Шаблоны — слой преобразования данных из одного формата в другой. Для модуля [rms] Слайдеры подготовлены примеры шаблонизации под PHP и XSLT шаблонизаторы.  

Важные нюансы:

    • Для правильной работы примеров, в config.ini нужно включить параметр udata.http.extended.allow
      udata.http.extended.allow = "1"
    • Для правильной работы примеров используются следующие плагины:
      1. ProSlider — jQuery плагин для слайдера Github
      2. Bideo — JS плагин для фонового видео Github
      3. imagesLoaded — jQuery плагин для отслеживания загрузки изображений Github
      4. ParticlesJS плагин для хаоса Github
      5. Bootstrap 4 CSS Grid — CSS сетка Doc

Все библиотеки уже включены в архивы для шаблонизаторов!

PHP

 В разработке

XSLT

 В разработке

Поддержка

Уважаемые клиенты! Если у Вас появились вопросы по работе модуля, Вам нужна помощь с установкой модуля или Вы заметили некорректную работу модуля, пожалуйста, напишите мне на почту! Я обязательно помогу!

link@mimika-team.ru