A- A A+
Слайдер для Joomla - Vinaora Nivo Slider

Идеальный слайдер для сайтов на супер-шаблонах. В настройках модуля Vinaora Nivo Slider есть всё, что нужно, от описания картинок до назначения ссылки каждой из них.

Карточка расширения Vinaora Nivo Slider:

Дополнительная информация

Тип расширения: Модуль
Версия: 3.3.0
Совместимость: 1.5, 2.5 и 3.x

Шаг 1. Устанавливаем модуль

Установка модуля Vinaora Nivo Slider из-за большого размера (свыше 2 Мб) отличается от стандартной инсталляции. Сначала потребуется распаковать архив. Затем с помощью FTP-клиента закачать содержимое папки в каталог tmp, расположенный в корне сайта (предварительно папку tmp нужно полностью очистить от посторонних файлов). Также возможно файловым менеджером хостинга закачать архив и распаковать его в указанную папку.

После этого в верхнем меню админ. панели выбираем пункт РАСШИРЕНИЯ => МЕНЕДЖЕР РАСШИРЕНИЙ, и в блоке Установить из каталога жмем на кнопку УСТАНОВИТЬ.

Установка слайдера Vinaora Nivo Slider

Шаг 2. Включаем модуль

В верхнем меню админ. панели выбираем пункт РАСШИРЕНИЯ => МЕНЕДЖЕР МОДУЛЕЙ. Находим наш слайдер - Vinaora Nivo Slider. Kликаем по названию и переходим к настройкам.

В левой части можем изменить название (1), скрыть заголовок (2), выбрать позицию (3), включить модуль (4).

Включение модуля Vinaora Nivo Slider

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

Привязка к меню Vinaora Nivo Slider

Шаг 3. Запускаем демо

Разработчики расширения позаботились о нас и внедрили семь вариантов демонстраций работы модуля. Находясь в настройках слайдера переходим в правую часть в блок Основные параметры. Здесь в строке Run demo выбираем демо для просмотра.

Просмотр демо Vinaora Nivo Slider

Если у Вас не работает слайдер, переместитесь вниз к вкладке Extra Options, где в строке jQuery Source установите Нет.

Настройка jQuery в Vinaora Nivo Slider

Шаг 4. Основные параметры

Находясь на вкладке «Основные параметры» Вы можете выбрать тему (Theme), оставив ширину и высоту в режиме auto, чтобы слайдер не потерял свойство респонсива.

Далее необходимо указать папку с изображениями (Image Directory) или прописать ссылки на отдельные файлы (Individual Image Path). Можете дать описание картинкам (Title, Description), указать ссылку (Link), куда будет направлен посетитель при нажатии на определенном изображении слайдера и выбрать способ открытия ссылок (Link Target).

Обратите внимание, что индивидуальные фото с описанием и ссылками необходимо заполнять по порядку с новой строки во всех столбцах, как показано на примере ниже.

Затем идут стандартные настройки слайдеров: эффекты, количество слайдов, временные интервалы, надписи…

Основные параметры в Vinaora Nivo Slider

Шаг 5. Дополнительные опции

Если Вы выбрали тему Amazing, на вкладке Plus Options появляются возможности дополнительных настроек слайдера:

  • позиции навигации (Control Position);
  • стили контрольной панели и стрелок (Control (Arrows Style));
  • цвет, размер, стиль описания (Title…);
  • ширина и высота картинок, которую оставить по умолчанию - auto (Caption Width (Height));
  • фон слайдера (Caption Background).

Дополнительные опции в Vinaora Nivo Slider

Шаг 6. Сохраняем настройки.

Самое главное - жмем на кнопку СОХРАНИТЬ. Теперь на вашем сайте появился красивый слайдер, который автоматически подстраивается под любое разрешение мониторов и дисплеи мобильных устройств.

На этом все. Желаем Вам успешного использования этого слайдера.

 

Комментарии  

#21 +1 Максим M 28.08.2016 09:24
Здравствуйте! При выборе/изменени е темы сладера - тема не меняется. Более того вместо стрелочек - ссылки вперед и назад, вместо точек выбора сладера - ссылки-цыфры 1,2,3 и т.д. В демо-режиме все в порядке.
Цитировать
#20 0 Evgesha108 28.07.2016 13:31
В продолжение вопроса.
Демо я отключала, но картинки не грузятся, хотя вроде пути все как сказано писала
Цитировать
#19 0 Evgesha108 28.07.2016 13:18
Добрый день!
Спасибо за статью. Пытаюсь разобраться со слайдером. Не хочет крутить картики, путь к которым я указываю в настройках, чтобы там не писала продолжает крутить демо. Подскажите, пожалуйста, что не так?
Цитировать
#18 0 Луговской 15.03.2016 08:18
Цитирую Дмитрий11:
Как сделать, чтобы ссылки открывались не в новом окне?

Вкладка "Модуль", строка "Link(s) Target".
Выберите - "_self Open link in the same frame"
Цитировать
#17 0 Дмитрий11 15.03.2016 00:42
Как сделать, чтобы ссылки открывались не в новом окне?
Цитировать
#16 0 Владимир 25.01.2016 14:20
Спасибо Виталий. Начал смотреть видео и понял, что смысла нет. Я скачал для Joomla3 и установил прямо на хостинге, как любое обычное дополнение. Всё сразу заработало после некоторых настроек. Проблемы были с пониманием английского. Однако, указанная в тексте закладка - "Extra Options" пустая. Но и без неё все настроил. Пока достаточно и этого. Amazing самый оптимальный вариант, хотя и в настройках чуть сложнее.
Всё замечательно. Но возникла у меня идея (был у меня слайдер на Joomla2.5) сделать тени к слайдеру. Как фото чуть свернутое. Ранее мне удавалось просто создать модули до и после слайдера и поместить туда картинки png с изображением тени. Но тут вариант не проходит, так как всё делаю на Gantry. Видеоуроков не покупал, не надеюсь на подсказку. Но пробовал сделать так же - модули с html и картинками. Там отступы не могу подрегулировать , всё разлетается.
Но всё равно, огромное спасибо за подсказки и видео. Очень помогает в работе (моё хобби - писать сайт)
Цитировать
#15 0 Луговской Александр 02.11.2015 23:16
Цитирую Ronlegas:
...проблема со скриптом. Когда сайт открывается иногда (очень часто) большая задержка перед перелистыванием на следующий слайд...

Такие проблемы решаются индивидуально, при наличии доступа к Вашему ресурсу. Общий совет в данном случае невозможен.
Цитировать
#14 0 Ronlegas 02.11.2015 13:16
ЗДравствуйте. Слайдер хороший. Многофункционал ьный но проблема со скриптом. Когда сайт открывается иногда (очень часто) большая задержка перед перелистыванием на следующий слайд. Как это решить?
Цитировать
#13 0 Инна Н. 04.05.2015 07:56
Попробуйте увеличить размер картинок для слайдера.
Спасибо, помогло!
Цитировать
#12 0 Луговской Александр 02.05.2015 19:19
Цитирую Инна Н.:
...на большом мониторе оказалось, что хедер не растянулся на всю ширину сайта, выглядит ужасно...

Попробуйте увеличить размер картинок для слайдера.
Цитировать

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

Защитный код Обновить

Если заметили ошибку, выделите фрагмент текста и нажмите Ctrl+Enter

МОЙ TELEGRAM-КАНАЛ

ПОДПИСАТЬСЯ!


Перенос на хостинг

Перенос на хостинг

Бесплатный видео-курс по переносу готового сайта на одну из лучших хостинг-площадок РУнета.

Смотреть (бесплатно)

Бессмертный сайт

Бессмертный сайт

2 урока, 16 минут, и Ваш сайт - БЕССМЕРТНЫЙ!

Узнать подробности!