Плашка с затемнением и кнопкой

Функциональность

• При наведении на плашку – плашка затемняется фоном, поверх фона появляется кнопка.

• Цвет и прозрачность фона можно менять

• Цвет кнопки можно менять, однако шрифт всегда остаётся белым

• Тип кнопки можно менять – это или цветная кнопка или прозрачная кнопка с контурной обводкой

• Содержимое плашки может быть любым:

  • текст

  • изображения 

  • видео

• При появлении модуля в блоке вывода - блок вывода меняет своё поведение и производит выравнивание всех модулей по центру (по умолчанию - выравнивание по левому краю)

 

 

Адаптивность

 

В настройках модуля можно задать два адаптивных типа поведения:

• С фиксированной шириной и высотой
  
  При наличии нескольких модулей на странице - модули стараются уместиться в одной строке. Если какой - нибудь модуль не умещается в строке с другими модулями - он автоматически переносится на следующую строку и выравнивается по середине экрана.
  
   
• С шириной заданной в процентах, высота выравнивается по содержимому.
  
  Для разных типов устройств (настольные компьютеры, ноутбуки, планшеты, смартфоны)  можно задать – какой процент области может занимать модуль на том или ином устройстве.
  
  Например, мы можем показывать  12 изображений на различных устройствах так:
  • на настольных компьютерах:  2 ряда по 6 модулей
  • на ноутбуках 3 ряда по 4 модуля
  • на планшетах 4 ряда по 3 модуля
  • на смартфонах 6 рядов по 2 модуля

 

 

Пример адаптивности с фиксированной шириной и высотой для 4 модулей: 

 

 

---

 

 

 

Административная панель

 

 

 

 

Функциональность

• Управление показом - везде / только на компьютерах / только на телефонах / отключить
• Заголовок модуля - не отображается во фронтенде
• Возможность вывода модуля в любом доступном блоке вывода
• Возможность изменить порядок следования внутри блока

• Установка типа адаптивного поведения: с фиксированным размером и обтеканием по левому краю и установки ширины модуля в процентах на разных типах устройств.

• Установка размера, ширины / высоты модуля в пикселях для адаптивного поведения с фиксированным значением

• Установка ширины модуля в процентах для разных типов устройств

• Мгновенное визуальное изменение размеров плашек
• Установка отступа по ширине / по высоте

• Установка типа кнопки: цветная / прозрачная

• Редактирование текста на кнопке - цветная / прозрачная

• Редактирование цвета кнопки
• Редактирование цвета подложки
• Редактирование прозрачности подложки
• Установка ссылки, ведущую с модуля на любую страницу
• Визуальное редактирование модуля и просмотр результата после применения
• Автоматическая подстройка изображения под ширину плашки в том случае, если ширина изображения больше доступной ширины для редактирования
• Возможность размещать текст, изображения, видео