Динамическая галерея в "шапке" сайта на WordPress

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

Примерно как тут.

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

Поскольку для каждой страницы должны быть свои картинки, напросилось решение в виде произвольных полей (Custom Fields). Но по умолчанию произвольные поля - это просто текстовые строчки, в которые пришлось бы вручную копировать ссылки на картинки - такой UI мне точно не подходил.

Руководствуясь таблицей сравнения, я перепробовала несколько плагинов: Advanced Custom Fields, Custom Field Suite, и в итоге остановилась на Custom Content Type Manager.

Чтобы настроить галерею, достаточно оказалось выполнить четыре простых шага:

  1. Создать на странице плагина Custom Fields поле типа Image, дать ему имя, указать галочку Is Repeatable, чтобы оно было множественным, отметить тип записей, для который поле нужно показывать, например post. По желанию заполнить другие поля.
  2. На странице плагина Custom Content Types (пользовательские типы страниц) под нужным типом записей нажать ссылку "Standartize Custom Fields", чтобы созданный тип полей показывался для данного типа записей.
  3. На странице редактирования / создания поста должен был появиться блок с созданным полем, в нашем примере поле называется "Галерея в верхней части сайта". Нужно просто загрузить в это поле картинки для галереи, или выбрать из  загруженных ранее.
  4. Остался лишь четвёртый шаг - отобразить галерею в шаблоне, например в файле header.php. Код может быть примерно таким:
 
<?php
$custom_images = get_custom_field('header_gal_images');
if ( count($custom_images) ):
?>
	<?php foreach ( $custom_images as $i ): ?>
		<img src="<?php echo $i; ?>" alt="" />
	<?php endforeach; ?>
<?php else: ?>
	<?php $images_dir = get_template_directory_uri().'/images/headers'; ?>
	<img src="<?php echo $images_dir; ?>/1.jpg" alt="" />
	<img src="<?php echo $images_dir; ?>/2.jpg" alt="" />
<?php endif; ?>

P.S. Кое-где на скриншотах можно заметить смесь русского и английского языка на страницах плагина Custom Content Type Manager. Это связано с тем, что мне он попался без русской локализации и на данный момент я всё ещё не закончила его перевод.

Поделиться с друзьями: