Краткое описание
Слайдер доступен и в виде виджета и в виде шорткода. При использовании его в виде шорткода доступно гораздо больше возможностей – кастомные слайды, видеослайды, использование управляющих слайдеров и отдельных элементов управления и т.д.
Слайдер может применяться как для вставки ранее созданных слайдеров из Revolution Slider (по алиасу), так и для создания слайдеров из постов и/или кастомных слайдов, лайаут которых можно строить в Visual Composer. В дальнейшем описании будем рассматривать слайдер постов и кастомные слайды.
Слайдер поддерживает два основных стиля оформления: “Default” и “Modern”. Для каждого из этих стилей можно указать:
- Direction – направление смены слайдов (горизонтально (по умолчанию) или вертикально
- Slide Effect – эффект смены слайдов (slide, fade, cube, flip, coverflow)
- Pagination – наличие и вид кнопок пагинации – Bullets (кружочки), Fractions (номер текущего слайда и общее количество слайдов, например 4/5) или Progress Bar (заполняемая полоса, a-la RevSlider). Также можно выбрать положение элемента с пагинацией – внизу, слева или справа
- Controls – наличие и положение элементов управления слайдами (стрелок)
- Category, IDs, Posts count, Offset, OrderBy, Order – параметры отбора записей, из которых строится сладер – из какой категории, сколько постов и с каким смещением отобрать и как их отсортировать
- Slides per view – количество одновременно видимых слайдов (по умолчанию 1)
- Slides space – расстояние между соседними слайдами в пикселах (по умолчанию 0)
- Interval – время (в миллисекундах, 1000мс = 1сек) между сменой слайдов
Ниже приведены примеры разных типов слайдеров с разной пагинацией и элементами управления.
Slider
Slider
Первый слайдер демонстрирует центрирование слайдов. При указании четного количества видимых слайдов получаем эффект "половинок" слайдов слева и справа.
Второй слайдер показывает, как можно создать видимость "ухода" слайдов за правый край окна.
Заодно на обоих слайдерах продемонстрирована возможность управлять сменой слайдов с помощью колеса мыши.
Slider effects
А в данном примере показаны слайдеры с разными эффектами и направлениями смены слайдов.
Внимание! Эффекты Cube и Coverflow, не совсем корректно отрабатывают на IE!
Slide
Cube
Flip
Fade
Swap
Coverflow
Slider
Ниже продемонстрирован новый тип слайдера - ElastiStack
Slider Controller (internal)
В данном примере показан слайдер с видео. При щелчке на видео оно запускается, прокрутка слайдов останавливается. При ручной смене слайдов видео останавливается.
Справа - слайдер-контроллер, управляющий показом основного слайдера с видео. Этот контроллер встроен в слайдер с помощью соответствующей группы параметров. Контроллер может располагаться слева, справа или под слайдером. Наличие стрелок также управляется параметрами.
Slider Controller (external)
В данном примере показан слайдер с видео. При щелчке на видео оно запускается, прокрутка слайдов останавливается. При ручной смене слайдов видео останавливается.
Справа - слайдер-контроллер, управляющий показом основного слайдера с видео.
Внизу под слайдером - примеры шорткода "Slider Controls", добавляющего независимые кнопки для смены слайдов на основном слайдере и пагинацию четырех видов. И кнопки и пагинация отключаемые
Fullscreen slider
with Parallax and mouse wheel
Следующий слайдер настроен так, чтобы он прилипал к верху окна и только в "прилепленном" состоянии начинала работать смена слайдов по колесику мыши.
Для реализации "прилипания" секции задана высота 150vh, колонка - stretch, а у слайдера включена настройка Position: Sticky (добавляется нашим плагином)