Monstroid. Как работать с Редактором стилей Слайдера MotoPress

Из этого туториала Вы узнаете, как работать с Редактором стилей Слайдера MotoPress в шаблонах Monstroid.

В обновлённой версии Слайдера MotoPress есть Редактор стилей. Он позволяет настроить отображение слоёв слайда, их стилей и текста, используя область предварительного просмотра. Этот инструмент позволит Вам избежать непосредственной работы с кодом или правилами CSS.

1. Перейдите на вкладку Слайдер MotoPress (MotoPress Slider) в админ панели; выберите слайдер для редактирования, а также слайд, с которым Вы будете работать.

2. Вы увидите вкладку с изображением и текстом слайда. Она используется для работы с содержимым слайда. Выберите слой, в который Вы хотите внести изменения, и перейдите в раздел ‘Стиль’ (Style). Нажмите на кнопку ‘Редактировать’ (Edit), для того чтобы запустить Редактор стилей:

   

3. Вы увидите окно с расширенными настройками. При помощи этих настроек Вы можете управлять отображением слайда в обычном состоянии, а также при наведении на него мышкой:

   

4. Используйте предложенные настройки, для того чтобы изменить отображение слоя слайда:

   • Фон (Background): определите фоновую область любого элемента;

   • Шрифт (Font and typography): задайте цвет текста, шрифт, размер, толщину и стиль текста, межбуквенное расстояние, высоту строки и выравнивание текста в несколько кликов мышкой;

   • Тень текста (Text shadow): позволяет использовать тень для текста. Вы можете определить цвет тени, радиус, её ширину и длину;

   • Границы (Border): задайте тип границ, цвет и радиус;

   • Отступ (Padding): задайте отступ со всех 4 сторон элемента;

   • Расширенный редактор (Advanced Editor) – здесь Вы можете добавить пользовательские стили CSS.

5. Укажите, хотели бы Вы включить Стили при наведении мышкой (Hover styles). Если Вы их включите, Вы увидите аналогичные вкладки с настройками, которые позволят Вам настроить отображение слоя слайда при наведении на него мышкой.

6. Используйте кнопку ‘Запомнить настройки’ (Create new preset), если Вы хотите сохранить текущие настройки для последующей работы с ними.

7. Нажмите на кнопку ‘Применить стиль’ (Apply Style), для того чтобы сохранить изменения после того, как Вы закончили изменение стилей слоя слайда.

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