Дизайн та розробка сайту

Вывод миниатюр WordPress в слайдере

Вывод миниатюр Wordpress в слайдере

Доброго времени суток. 🙂

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

Вывод миниатюр WordPress в слайдере

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

Чтобы вывести миниатюры WordPress в этом слайдере, надо будет просто изменить HTML разметку. Для этого меняем код из первого пункта прошлой статьи на вот такой:

<ul id="carousel" class="elastislide-list">
<?php
 $pc = new WP_Query('orderby=date&posts_per_page=10'); ?>
 <?php while ($pc->have_posts()) : $pc->the_post(); ?>
 <li>
 <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail(array()); ?></a>
 </li>
 <?php endwhile; ?>
</ul>

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

Цикл WP_Query имеет несколько настроек:

  1. orderby=date - сортировка по дате.
  2. posts_per_page=10 - вывод 10 миниатюр.

Также можете добавить cat=9 - где 9 это айди рубрики. Этот параметр задаст условие вывода миниатюр только с определенной рубрики.

Чтобы все выглядело корректно и так как Вам надо, Вам придется еще править стили, но это уже индивидуально для каждого сайта.

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

Думаю, у Вас не составит труда интегрировать такой слайдер миниатюр WordPress себе на сайт. Главное правильно установите слайдер как расписано в прошлой статье.

На этом все, спасибо за внимание. 🙂

Дизайн та розробка сайту

Back to top