Как сделать слайд-шоу на фоне сайта WordPress

самсай пост фото Прибамбасы для сайта

Здравствуйте ! 

Если вы любите проводить эксперименты по улучшению своего сайта, то это хорошо и данная статья будет вам интересна, потому что сегодня я расскажу вам как сделать целое слайд-шоу на фоне вашего сайта. Что это такое ? можно будет установить несколько изображений, которые будут сменять друг друга и всё это на фоне вашего сайта. Можно будет установить слайд-шоу только для главной странице вашего сайта, а у остальных страниц оставить обычный фон. В общем вы сможете настроить слайдер по своему усмотрению.

 

21-01-2016 11-50-36_mini

 

А если нажать на значок в виде экрана, в нижнем правом углу, то можно убрать сайт с экрана, а оставить только слайд шоу, сайт возвращается нажав на ту же кнопку.

 

21-01-2016 11-51-39_mini

 

Итак, устанавливать слайдер с изображениями на фон вашего сайта мы будем с помощью плагина – Responsive Full Width Background Slider, данный плагин хорош тем, что он имеет понятные настройки, разобраться в нём не составит для вас особого труда, в нём нет ничего лишнего, в общем отличный плагин ! Установить данный плагин вы сможете прямо из своей админ-панели wordpress, для этого перейдите по вкладке: ПлагиныДобавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте открывшийся плагин.

 

самсай фон слайдер шоу

 

 

После того как вы установите и активируете плагин, в левом меню панели wordpress появится новая вкладка – RFWB Slider, чтобы настроить плагин перейдите по данной вкладке.

 

самсай вкладка фон шоу

 

Теперь давайте настроим плагин:

 

Where to show Default RFWB Slider, где показывать слайдер ? отметьте галочками страницы на фоне которых нужно показывать слайд-шоу. К примеру, если вы хотите установить слайд-шоу в качестве фона только для главной страницы вашего сайта, тогда отметьте галочкой только значение – Home Page. В конце сохраните сделанные изменения нажав на кнопку – Save Settings.

 

самсай настройки плагина

 

Appearance Settings.

 

– Slide Duration, укажите продолжительность слайд-шоу в мили-секундах.

–  Transition Speed, укажите скорость перехода слайдов в мили-секундах.

– Auto Play, автоматический запуск слайд-шоу при открытии страницы. Enable – включить.

– Show Navigation, включите или отключите навигацию слайдера, речь идёт о стрелочках.

– Show Toggle, включить или отключить возможность переключения слайдов во время слайд-шоу.

– Controls Position, выберите положение органов управления, с какой стороны будет отображаться навигация.

– Show Bullets, включить или отключить показ пуль, это такие кружки внизу слайдера, они показывают количество слайдов и их переключение.

– Animation, анимация, здесь можно выбрать эффект переключения слайдов. Fade – это эффект незаметного переключения слайдов. Slide – слайды будут сменять друг друга перемещаясь вдоль экрана.

– Overlay, если включить то на изображениях слайда будет наложена маленькая сеточка, в качестве эффекта.

– Random Slides, можно включить отображение слайдов в случайном порядке.

В конце, чтобы сохранить сделанные изменения, жмём на кнопку – Save Settings.

 

самсай настройки слайдер

 

Please Enter Slider slides URL / PATH, укажите здесь URL слайда.

Смотрите, здесь у вас будут 3 кнопки, вот их обозначения:

Upload, загрузить изображение в слайд.

Delete, удалить слайд.

Add image, жмите чтобы добавить ещё слайд в слайдер.

 

самсай слайд фон шоу

 

Чтобы добавить URL изображения в слайд жмите на кнопку – Upload, у вас откроется окно где вам нужно выбрать способ загрузки изображения. Можно загрузить с компьютера, а можно из библиотеки медиафайлов.

 

самсай слайд загрузка

 

После того как вы загрузите изображения с компьютера или выберите его из библиотеки, вам нужно будет нажать на кнопку – Вставить в запись, что бы URL изображения добавился в слайд.

 

самсай слайд шоу

 

Итак, после того как вы настроите слайдер, добавите в него изображения, сохраните все настройки, вам нужно будет удалить кэш сайта, чтобы все сделанные изменения отобразились на вашем сайте. А у меня на этом всё, развивайте свой сайт, успехов вам и до новых встреч ! Кстати, а вы знаете – Как добавлять разный фон для страниц Сайта ?

 

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

 

 
Добавить комментарий

  1. Светлана

    Здравствуйте,Илья!
    Я установила данный плагин,всё сделала по Вашей инструкции (огромнейше благодарю за Ваш труд!) и загрузила свои фоны.Всё работает.НО.Я отметила в настройках,чтобы смена фонов происходила везде КРОМЕ главной страницы.И когда я смотрю на свой сайт через ноутбук (Windows 10), то всё нормально – на главной странице только статический установленный фон, а на всех других страницах сайта фон плавно меняется.А вот если смореть сайт через смартфон или планшет, то там на главной странице фон почему-то вообще чёрный (то есть не мой, у меня статический главный фон цветной),но на всех остальных страницах фоны также плавно меняются,как и при просмотре сайта на компе.Почему так?Может подскажете,как можно это исправить?Заранее благодарю за ответ!

    Ответить
    1. Admin автор

      Возможно плагин не поддерживает мобильную тему, точно не помню. У вас тема адаптивная или отдельная тема стоит для мобильных устройств ?

      Ответить
  2. Светлана

    Здравствуйте,Илья.У меня тема адаптивная, платный шаблон WordPress, вот эта – Marlin Версия: 1.0.1.

    Ответить
    1. Admin автор

      Скорей всего плагин не будет работать на мобильной версии, так как это не реально, слишком маленький экран. А фон для мобильных устройств вы можете задать с помощью CSS. Плагины которые могут вам помочь:

      SiteOrigin CSS
      Simple Custom CSS
      Custom CSS Pro
      Здесь показан код CSS для мобильных

      Ответить
  3. Виталий

    Здравствуйте!
    Подскажите, каким плагином возможно реализовать фоновый слайдер для отдельного ряда (блока) страницы ВП?

    Ответить
    1. Admin автор

      Здравствуйте. У вас новый редактор блоков WordPress? Там должна быть такая функция. Потестируйте плагины: Elementor Website Builder, Page Builder от SiteOrigin, WordPress Page Builder — Beaver Builder

      Ответить