Для сайтов на WordPress существует большой набор плагинов для вывода слайдеров. Наиболее известные плагины обладают обширными возможностями и разнообразными настройками, способными создать впечатляющие слайдеры.
Однако часто на сайте требуется сделать простой слайдер со сменой нескольких картинок и не хочется разбираться со множеством настроек сложного плагина.
Для этих целей есть удобный плагин – WP Slider Plugin. На момент написания этой статьи у плагина не было перевода на русский язык, но я постараюсь максимально подробно описать его настройки.
После установки плагина в меню появится пункт WP Slider, в котором видны уже созданные слайдеры, а также можно создать новый с помощью кнопки “Add New”.
После нажатия на эту кнопку появляется форма создания нового слайдера.
С помощью синей кнопки “+ Add Slide” вы можете загрузить картинки. Поле “Slide Label” – это название картинки, которое может отображаться на сайте при наличии соответствующей настройки, поле “Slide Type” принимает значение “Image” (почти всегда используется именно картинка) или “Html”, и и в поле “Slide Image” вы с помощью кнопки “Add Image” можете загрузить нужную картинку.
Желательно, чтобы картинки по размерам соответствовали размеру самого слайдера, если он у вас фиксированный, чтобы они не масштабировались и не искажались.
С помощью кнопки “+ Add Slide” вы можете загрузить сколько угодно картинок.
Ниже в разделе “Options” идут настройки:
- Skin – в моей бесплатной версии плагина доступно только 1 значение по умолчанию;
- Animation (Анимация) – Slide (скольжение) или Fade (затухание);
- SlideShow (автоматически запускать анимацию) – Да или Нет;
- Height (высота слайдера) – Responsive (адаптивная) или Fixed (фиксированная, в этом случае надо в поле ниже указать значение). Если у вас слайдер должен быть определенных размеров, то указывайте фиксированные высоту и ширину. Адаптивные размеры означают, что размеры слайдера будут подстраиваться под размеры элемента, в котором находится слайдер.
- Width (ширина слайдера) – все то же самое, что и для высоты;
- Direction (направление смены картинок) – Горизонтально или вертикальное;
- Cycle speed (скорость смены картинок) – указывается значение в секундах;
- Animation speed (время на эффект анимации при смене картинок) – указывается значение в секундах;
- Navigation (настройки панели навигации):
- Pagination – пагинация
- Previous/Next – предыдущая/следующая картинка;
- Keyboard navigation – навигация с клавиатуры
- Caption Box – отображать заголовок
- Linkable – кликабельная
- Pause on hover – пауза при наведении курсора
- Thumbnail navigation – навигация в виде миниатюр
После всех настроек надо нажать вверху справа кнопку “Create Slider” (или “Update Slider” если вы корректируете существующий слайдер) и для него отобразится Шорткод в виде
|
1 |
[slider id='9' name='Слайдер в шапке' size='full'] |
Вы можете вставить этот шорткод в любое место вашей записи или страницы и на этом месте при отображении страницы на сайте будет виден ваш слайдер.
Также вы можете вставить шорткод в шаблон сайта, например, в шапку, однако для этого нужно воспользоваться специальной функцией Вордпресс для вставки шорткодов. Так, чтобы вывести наш слайдер, например, в шапке сайта, нужно добавить в файл header.php в нужное вам место следующую инструкцию:
|
1 |
<?php echo do_shortcode("[slider id='9' name='1' size='full']"); ?> |
