WP позволяет подключить одно изображение к статье, и обычно этого достаточно, чтобы оформить статьи в списке и саму статью. Если требуются дополнительные поля для загрузки изображений, то далее я покажу как можно их добавить в редактор.
Существенно упростить процесс позволяет плагин Multiple Post Thumbnails, который предоставляет свой API для регистрации дополнительных полей изображений и вставки их в шаблон, а также формирует widget в редакторе статьи.
Установка плагина штатная, выполняется через админ панель сайта.
Когда плагин активирован, вы можете начать регистрацию необходимых полей, например, в файле вашей темы functions.php. Вот примеру кода:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
if (class_exists('MultiPostThumbnails')) { //пара доп. картинок для статьи блога new MultiPostThumbnails(array( 'label' => 'Дополнительная картинка #1', 'id' => 'secondary-image', 'post_type' => 'post' )); new MultiPostThumbnails(array( 'label' => 'Дополнительная картинка #2', 'id' => 'secondary-image-2', 'post_type' => 'post' )); } |
Так вы можете добавить изображения к любому типу материала в WP, указав post_type. В редакторе поле будет подписано указанной при регистрации меткой (label), а чтобы получить HTML код изображения, вам понадобится указанный при регистрации id.
Рассмотрим пример кода для вставки в шаблон:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
// в примере у меня пара картинок // тем не менее я собираюсь перебирать их в цикле $meta_ids = array('secondary-image', 'secondary-image-2'); //если мы находимся в контексте шаблона публикации, то //$id - это код post_id данной публикации //$post_title - заголовок данной публикации foreach ($meta_ids as $field_id) { // если плагин включен, а картинка загружена if (class_exists('MultiPostThumbnails') && MultiPostThumbnails::has_post_thumbnail(get_post_type(), $field_id) ) { // пример использования функций WP API $post_thumbnail_id = MultiPostThumbnails::get_post_thumbnail_id(get_post_type(), $field_id, $id); $url = wp_get_attachment_image_src($post_thumbnail_id, 'full'); // ... // вывод изображения в шаблоне echo MultiPostThumbnails::get_the_post_thumbnail( get_post_type(), $field_id, $id, 'full', array ('alt' => $post_title, 'title' => $post_title )), ); } } |
В примере выше я использую следующие функции, предоставляемые плагином:
has_post_thumbnail
Функция позволяет проверить зарегистрировано ли
поле с указанным $field_id для публикации типа $post_type
|
1 |
MultiPostThumbnails::has_post_thumbnail($post_type, $field_id): bool; |
get_post_thumbnail_id
Так можно получить $post_id самого изображения (вложения):
|
1 |
MultiPostThumbnails::get_post_thumbnail_id($post_type, $field_id, $post_id): int; |
Все изображения WP хранит в медиа-библиотеке, используя для описания общую таблицу как для медиа-объектов так и для статей. В терминологии WP — медиа-объект (картинка, файл) — это статья типа attachment. Функции API WordPress, работающие с изображениями, обычно оперируют с ‘post_id’ такой медиа-статьи. Функция MultiPostThumbnails::get_post_thumbnail_id — как раз позволяет его извлечь для дальнейшего использования.
Так вы можете получить данные о изображении (вернее его тизере типа full):
|
1 |
$data = wp_get_attachment_image_src($post_thumbnail_id, 'full'); |
Массив data будет содержать 3 элемента:
[0] => url
[1] => width
[2] => height
get_the_post_thumbnail
Функция рендерит картинку так, как вам её нужно показать в шаблоне.
MultiPostThumbnails::get_the_post_thumbnail(
$post_type, $field_id, $article_post_id, $teaser_type, $attributes): string;
Первые два параметра — $post_type и $field_id — это данные, указанные при регистрации поля картинки. $article_post_id — post_id публикации куда прикреплено изображение, $teaser_type — тип миниатюры, $attributes — дополнительные HTML атрибуты тега IMG в виде массива.