Как сделать галерею в конце поста WordPress?

Question

[airbor]

В пост вставляется по 3-4 картинки. Можно ли автоматом сделать вывод в конце поста галлереи из этих изображений с возможностью их приближать (аля лайтбокс) и переключать?

Comments

[Антон Литвиненко]

Есть кейс как из стандартной галереи сделать скажем слайдер и к нему прикрутить лайтбокс

Answer 1

[Александр]

Для галереи возьмем Swiper, приближать будет fancybox.

1. Подключаем библиотеки. Если уже подключены, то пункт пропускаем.

Swiper

https://cdnjs.cloudflare.com/ajax/libs/Swiper/6.4.5/swiper-bundle.min.js
https://cdnjs.cloudflare.com/ajax/libs/Swiper/6.4.5/swiper-bundle.min.css

Fancybox

https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js
https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css

2. В файле single.php получаем все изображения, которые прикреплены к посту. У WordPress для этого есть функция get_attached_media. Функция возвращает массив объектов.

$media = get_attached_media( 'image' );

3. Разметка. В конце поста добавляем

<div class="swiper-container">
	<div class="swiper-wrapper">
		<?php foreach ($media as $img) : ?>
			<div class="swiper-slide">
				<img data-fancybox="gallery" src="<?php echo $img->guid ?>">
			</div>
		<?php endforeach; ?>
	</div>
</div>

4. Инициализируем галерею. В js файле темы добавляем

var gallery = new Swiper('.swiper-container', {
    // parameters
});

Готово!

Comments

[yarovikov]

ужас какой, для приближения заюзать целый fancybox))

[Александр]

yarovikov, можно заюзать все что угодно. это просто пример.

Answer 2

[Lord_Dantes]

Да, есть плагин вроде ACF Gallery. Можно настроить через HTML > PHP вывод циклом всех фото прикрепленных к посту в галерею.