http://wm-monitoring.ru/ ')) {alert('Спасибо за то что установили нашу кнопку! =)');} else {alert('Очень жаль! =(');}"> http://wm-monitoring.ru/

Главная Новости

Создание слайдера из стандартной фотогалереи WordPress

Опубликовано: 23.08.2018

видео Создание слайдера из стандартной фотогалереи WordPress

Плагин Slideshow Gallery для создания впечатляющих слайдшоу на сайтах WordPress



Как вы наверняка знаете, WordPress имеет встроенный функционал добавления в статьи сайта простеньких фотогалерей. Когда вы добавляете в статью галерею из фотографий через кнопку «Добавить медиафайл», в текст вставляется шоткод вида [gallery ids="1284,1283,915"].

Так вот, с помощью специально предусмотренного для подобных случаев фильтра post_gallery можно преобразовать данный шоткод в произвольный код, превратив его в слайдер. Для последнего, разумеется, потребуется подключить к сайту какой-либо jQuery-плагин.


Натяжка на WooCommerce. HTML2WC. Часть #4.2. Шапка: навигация с walker меню, порядок по WC

Чтобы превратить WordPress-галерею в слайдер, нужно выполнить следующие действия:

В файл functions.php вашего шаблона вставьте следующий код:

// фотогалерея-слайдер function gallery_slider($output, $attr) { $ids = explode(',', $attr['ids']); $images = get_posts(array( 'include' => $ids, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'post__in', )); if ($images) { $output = gallery_slider_template($images); return $output; } } add_filter('post_gallery', 'gallery_slider', 10, 2); function gallery_slider_template($images) { ob_start(); include 'gallery-slider.php'; $output = ob_get_clean(); return $output; }

Если задаетесь вопросом, куда конкретно вставить этот код, то поместите его в самый конец файла перед ?>.


Создание интерфейса слайдера в Фотошоп

В папке с шаблоном создайте файл gallery-slider.php и вставьте в него следующий код:

<ul class="slider"> <?php foreach ($images as $image) { $src = wp_get_attachment_url($image->ID); // ссылка на изображение $alt = get_post_meta($image->ID, '_wp_attachment_image_alt', true); // атрибут alt ?> <li><img src="<?php echo $src; ?>" alt="<?php echo $alt; ?>" /></li> <?php } ?> </ul>

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

<ul class="slider"> <?php foreach ($images as $image) { $src = wp_get_attachment_url($image->ID); // ссылка на изображение $alt = get_post_meta($image->ID, '_wp_attachment_image_alt', true); // атрибут alt $title = $image->post_title; // заголовок изображения $caption = $image->post_excerpt; // подпись к изображению $description = $image->post_content; // описание изображения ?> <li> <p><?php echo $title; ?></p> <p><img src="<?php echo $src; ?>" alt="<?php echo $alt; ?>" /></p> <p><?php echo $caption; ?></p> <p><?php echo $description; ?></p> </li> <?php } ?> </ul> Подключите к сайту плагин слайдера, например, bxSlider .

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

Карта
rss