Как сделать Nivo слайдер (slider) вместе с вложениями картинок на странице WordPress опубликовал Радик Алиев категория  
просмотры 21 039

Как сделать Nivo слайдер (slider) вместе с вложениями картинок на странице Wordpress

Приветствую Друзья на блоге wpandyou.ru . Я уже рассказывал как сделать 2 варианта слайд шоу WordPress для любого блога или сайта. Сегодня я Вам расскажу как сделать Nivo слайдер на WordPress . Тема довольно актуальная, будет многим полезна.

Итак, Nivo Slider это современный слайдер слайд шоу на jQuery, который можно использовать как на HTML сайтах, так и на сайтах WordPress. Правда использовать плагин Nivo слайдер в бесплатной сборке имеет ограничения на количество отображаемых слайдов. Плагин позволяет отображать только 10 слайдов, а во многих ситуациях необходимо отобразить значительно больше.

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

Данный способ я использую, если необходимо на странице отобразить слайдер.


Добавляем JQuery и Nivo Slider в Вашу тему или шаблон Wordpress

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

После того как Вы скачали все необходимые файлы необходимо интегрировать их в тему WordPress . Подключаем jQuery в Вашу тему, данный код необходимо разместить перед тегом </head>:

Хочу обрадовать Вас, WordPress с 3 версии позволяет подключить скрипты jQuery с Фреймворка, при этом Вам не нужно беспокоиться об обновление скрипта, за Вас всё сделает WordPress. Чтобы подключить jQuery через WordPress используйте следующий сниппет WordPress :

Данный код необходимо поставить перед всеми подгружаемыми файлами в Вашей теме.

После подключения jQuery необходимо подключить скрипт Nivo Slider, последнюю версию которого Вы всегда можете скачать на сайте производителя Nivo Slider. Если Вы помните, я написал как сделать и как использовать современную библиотеку jQuery Mansory, на не стандартных сайтах с нестандартной вёрсткой. Статья называется Используем jQuery Masonry на сайтах WordPress. Также Вы можете прочитать статьи о поисковом продвижение.

Далее, мы подключаем скрипт функции Nivo Slider, который будет отображать наш слайдер с разными настройками:

Общий код, который необходимо разместить в файле header.php выглядит так:

После того, как мы сделали основные настройки нашей темы, нам необходимо задействовать Nivo слайдер вместе с attachment WordPress, для этого необходимо прописать функцию в файле function.php следующую функцию:

Мы установили основные файлы в тему WordPress и добавили функцию, которая будет обрабатывать запрос на вывод галереи определённого поста. Теперь нам необходимо собственно вывести данную галерею на определённой странице. Для того, чтобы вывести слайде используйте следующий код:

В параметрах ‘large’ Вы можете указать — large, medium, thumbnail, тол есть те размеры, которые предоставляет стандартная нарезка картинок Wordpres, все размеры Вы можете настраивать в Настройки -> Медиа.

Использование  Nivo слайдер на движке WordPress без плагинов и бесплатно
С помощью данного способа можно с лёгкостью создать слайдер WordPress , который будет работать без плагинов, что значительно не нагружает сайт, значит Вам не придется оптимизировать Вашу сборку WordPress.
Nivo слайдер красивый и имеет много настроек, которые Вы можете узнать на официальном сайте производителя.

Инфо
Теги:

8 Комментарий

Оставить комментарий
  1. Евгений Май 2, 2012 at 7:21 пп #

    Лажняк, при добавлении кода в функции темы, все херит…

  2. Андрей Апрель 28, 2013 at 11:48 дп #

    Для меня все это слишком сложно-лезть в программы. А 2 других описания просто не работают. Хорошие у Вас статьи, доходчиво все описано, но увы-НИЧЕГО НЕ РАБОТАЕТ. Спасибо.

  3. samike Июнь 29, 2013 at 3:03 дп #

    Код неработает, порезаный

  4. Сашка Август 9, 2013 at 2:53 пп #

    Действительно, стоит только что то засунуть в функции и сайт выпадает из реальности

  5. Александр Октябрь 23, 2013 at 7:31 пп #

    ребят все работает, что вы тут в заблуждение всех вводите!!

  6. Андрей Август 2, 2015 at 1:00 дп #

    а есть ли видео ?
    Снимите видео честно новичку тяжело понять все что написано

  7. adrin Ноябрь 24, 2015 at 1:36 дп #

    Он же платный!

  8. Виктор Март 10, 2016 at 1:47 пп #

    А как сделать слайдер с популярными записями?

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

vk_like_site