Выводит html код картинки-миниатюры текущего поста.

Этот Тег шаблона должен использоваться внутри Цикла WordPress.

Дополнительный размер картинки, которую затем можно получить с помощью этой функции, можно создать через add_image_size() . По умолчанию доступны следующие размеры: thumbnail , medium , large , full , post-thumbnail .

✈ 1 раз = 0.001739с = очень медленно | 50000 раз = 6.79с = быстро | PHP 7.1.2, WP 4.7.3

Хуков нет.

Возвращает

null (ничего). Выводит на экран строку. Функция выводит на экран html код картинки или пустое значение (null), если картинки не существует.

Использование

$size(строка/массив)

Размер миниатюры, которую нужно получить. Может быть строкой: thumbnail , medium , large , full или массивом из двух элементов (ширина и высота картинки): array(32, 32) .

Когда указан массив, новая миниатюра с указанными размерами не создается. А WP ищет самый подходящий размер из тех что уже есть, берет его и просто указывает высоту и ширину в пикселях для тега IMG, чтобы уменьшить картинку. Т.е. картинка уменьшается только визуально.

По умолчанию: "post-thumbnail", размер который устанавливается для темы функцией set_post_thumbnail_size()

$attr(строка/массив)

Массив атрибутов, которые нужно добавить получаемому html тегу img .

Можно указать строкой: alt=альт&class=alignleft или массивом:

$default_attr = array("src" => $src, "class" => "attachment-$size", "alt" => trim(strip_tags($wp_postmeta->_wp_attachment_image_alt)),);

Атрибуты можно указывать любые.
По умолчанию: ""

Примеры

#1 Миниатюра как ссылка на пост

Пример 1: Используйте следующий код, чтобы сделать картинку-миниатюру ссылкой на пост. Пример для использования внутри Цикла WordPress:

" title="" >

#2: Сделаем миниатюру ссылкой на пост

Для этого используем хук post_thumbnail_html . В этом случае картинка будет ссылкой на пост сразу при вызове функции the_post_thumbnail(); . Код нужно добавлять в файл шаблона functions.php :

Add_filter("post_thumbnail_html", "my_post_image_html", 10, 3); function my_post_image_html($html, $post_id, $post_image_id) { $html = "" . $html . ""; return $html; }

#3 Миниатюра-ссылка на оригинальный размер

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

#4 Регистрация нового размера

С помощью add_image_size() можно зарегистрировать новый размер и затем получить его по ключу:

// допустим в functions.php мы регистрируем дополнительный размер так: add_image_size("spec_thumb", 360, 240, true); // далее в цикле выводим этот размер так: the_post_thumbnail("spec_thumb");

Flector 5

Это маленький, но весьма полезный плагин, чьей единственной функцией является перегенерация миниатюр в блоге. Любое изменение размера миниатюр в настройках блога коснется лишь новых залитых вами картинок, а все старые картинки останутся с прежними размерами. А что делать, если вы сменили шаблон блога на тот, в котором дизайн заточен под определенный размер миниатюр? Вот тут то вам и понадобится данный плагин. Установили плагин, перегенерировали миниатюры в нужном размере и все, плагин можно удалять. И не стоит бояться экспериментировать с новыми шаблонами и разными размерами миниатюр – плагин создает новые миниатюры, не удаляя при этом старые. Таким образом, вы всегда можете откатиться на свой изначальный шаблон без какого-либо ущерба (ну кроме лишних картинок в папке загрузок) для своего блога.

1 Распаковываем архив.

2 Копируем папку regenerate-thumbnails в /wp-content/plugins/ .

3 Заходим в админку блога на вкладку "Плагины " и активируем плагин.

Никаких настроек в плагине нет. Так что не забываем сначала зайти в "Параметры\Медиафайлы " и установить нужные вам размеры миниатюр.

После этого у нас есть два варианта:

1 Перегенерация всех картинок сразу. Зайдите в "Инструменты\Regen. Thumbnails " и нажмите кнопку "Regenerate All Thumbnails ":

Теперь вам остается лишь ждать, пока плагин пересоздаст все миниатюры. Это может занять от нескольких секунд до десятков минут в зависимости от количества картинок. Сотня картинок пересоздается примерно одну минуту.

2 Перегенерация избранных картинок. Можно пересоздать лишь выбранные картинки, для этого зайдите в библиотеку медиафайлов. Там вы сможете перегенерировать или несколько картинок сразу или каждую по отдельности:

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

Функция the_post_thumbnail (которую вы можете найти в файле index.php в папке шаблона) при этом выглядит примерно так:

the_post_thumbnail("thumbnail"); // миниатюра (150 на 150) the_post_thumbnail("medium"); // средняя (300 на 300) the_post_thumbnail("large"); // большая (640 на 640) the_post_thumbnail("full"); // полная (без ограничений)

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

the_post_thumbnail( array (500 , 150 ) ) ; // 500 на 150

the_post_thumbnail(array(500,150)); // 500 на 150

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

Будет выведено вот это:

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

$post_id (целое число ) ID поста, миниатюру которого нам нужно получить, по умолчанию — ID текущего пост из цикла. $size (строка|массив ) в этом параметре указываем размер миниатюры. Может принимать следующие значения:

• thumbnail / medium / large — одно из стандартных размеров изображений, зарегистрированных в WordPress по умолчанию, данные размеры можно настроить в Параметры > Медиа,
• full — оригинальное разрешение изображения — таким оно было загружено на сайт,
• Можно указать собственные параметры ширины и высоты миниатюры в виде массива, например array(50, 30) . Обратите внимание, WordPress не будет создавать дубликат картинки под этот размер — вместо этого будет использоваться наиболее близкий по разрешению зарегистрированный размер картинки, подогнанный под ваши параметры с сохранением оригинальных пропорций.

  Чтобы было понятнее, приведу пример. Предположим, в качестве этого аргумента мы указали array(50, 30) . У меня самый близкий размер будет 125×125 (thumbnail) — URL этой картинки и будет вставлен в атрибут src . Окей, а что с пропорциями? Так как 125×125 — это квадрат, то и наша миниатюра будет квадратной, она впишется по наименьшему параметру, т.е. результат будет 30×30.

• Один из собственных размеров изображений, зарегистрированных через функцию .

$attr (массив ) массив переопределяемых атрибутов тега , через него можно переопределить следующие HTML-атрибуты:

• src — если вам надо, можете даже заменить URL картинки.
• class — класс тега , по умолчанию имеет следующие классы wp-post-image и attachment-{размер изображения} .
• alt — по умолчанию trim(strip_tags($attachment->post_title)) — указывается в админке при загрузке/редактировании медиафайла.
• title — по умолчанию trim(strip_tags($attachment->post_excerpt)) .

Пример 1

Простой пример — просто выведем миниатюру поста с ID = 5:

echo get_the_post_thumbnail( 5 , "thumbnail" ) ; //

Пример 2. Как сделать миниатюры с ссылками на пост?

Предположим, мы хотим реализовать это на страницах категорий. Давайте немного доработаем цикл:

while ( have_posts() ) : the_post() ; if ( has_post_thumbnail() ) : echo "ID ) . "">" . get_the_post_thumbnail( $post ->ID , "thumbnail" ) . "" ; endif ; echo "ID ) . "">" . $post ->post_title . "" ; endwhile ;

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

Пример 3. Как сделать, чтобы при клике на миниатюру, открывалась полная версия картинки?

Код из этого примера отлично подойдет для использования в каком-нибудь плагине jQuery, например fancybox или pretty photo. В таком случае вам возможно также понадобится добавить класс для ссылки.

Вы также можете ознакомиться с документацией функций и на моем блоге.

Пример 4. Используем третий параметр $attr для изменения класса миниатюры

Давайте добавим на наши миниатюры класс align-left типа для того,чтобы они обтекались текстом слева:

Фильтр post_thumbnail_size

Фильтр позволяет задать размер миниатюр, используемых на блоге (везде на блоге).

А теперь пример со следующим условием: для всех миниатюр на блоге, которые выводятся через функцию get_the_post_thumbnail() с параметром $size равным thumbnail заменяем размер на medium , остальные размеры миниатюр не трогаем:

Количество параметров данного фильтра не может не радовать, это означает, что мы можем творить с возвращаемым HTML-кодом всё, что нам угодно.

$html (строка ) HTML-код, возвращаемый функцией по умолчанию, $post_id (целое число ) ID поста, миниатюру которого нужно получить, $post_thumbnail_id (целое число ) ID миниатюры, $size (строка|массив ) размер миниатюры, $attr (массив ) массив HTML-атрибутов, которые были заданы при вызове функции, если не заданы, то пустой массив;

А теперь несколько интересных примеров.

Пример 1. Автоматическое проставление ссылок на пост

Фишка в том, что каждый раз при использовании функции get_the_post_tumbnail() миниатюры уже будут возвращаться с автоматически проставленными ссылками на пост.

function true_auto_linking( $html , $post_id , $post_thumbnail_id , $size , $attr ) { return "" . $html . "" ; } add_filter ("post_thumbnail_html" , "true_auto_linking" , 10 , 5 ) ;

Круто, да? А главное — всё очень просто.

Пример 2. Возвращаем только URL миниатюры

Миша Рудрастых

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля - .

На многих блогах рядом с описанием постов можно встретить небольшую (большую) миниатюру, которая должна передавать содержание поста. До некоторых пор создать такое было нелегко. С появлением же Wordpress 2.9 осуществить такое стало намного легче.

В этом уроке я покажу Вам как добавить подобный функционал к Вашим шаблонам оформления Wordpress.

Включение Post-Thumbnail функции в шаблонах

Включение происходит очень просто. Все что от Вас требуется - добавление одной строки в файле functions.php:

Add_theme_support("post-thumbnails");

Вставка миниатюр к постам

Когда Вы заходите в администраторской панели в раздел написания нового поста, Вы должны увидеть новый отдел сбоку страницы.

Заметьте, что новый отдел может находится вне видимости и Вам придется опуститься немного ниже. После нажатия Set thumbnail появляется новое диалоговое окно

Нажмите Use as thumbnail и миниатюра будет добавлена к Вашему сообщению:

Отображение миниатюр

После того как мы написали новость, давайте добавим ее. Для того, чтобы миниатюра отображалась необходимо добавить строку в цикл Wordpress. Откройте файл index.php и добавьте следующее:

Это позволит вывести изображение используя классы attachment-post-thumbnail и wp-post-image. C помощью этих классов мы сможем оформить внешний вид миниатюр с помощью CSS. В картинке ниже мы можем увидеть миниатюру с границей и отступом.

На картинке выше миниатюра довольно большая. Ее размер можно менять из админки Settings > Media.

Другой способ определение размеров миниатюры - это изменение файла functions.php. Для этого нам понадобится добавить еще одну строку:

Add_theme_support("post-thumbnails"); set_post_thumbnail_size(588, 250, true);

Теперь нам необходимо сообщить Wordpress, чтобы использовался именно этот размер. Требуется немного видоизменить наш цикл в index.php:

Теперь Wordpress точно знает какую версию миниатюры использовать. Вот что у нас получилось:

Теперь добавим еще немного PHP в файл single.php, чтобы при открытии сообщения миниатюра была в самом верху:

Добавление больше размеров миниатюр

Если Вы хотите, чтобы на главной странице миниатюры были одного размера, а на самой странице сообщения другого - нужно делать следующее.

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

Add_image_size("loopThumb", 588, 125, true);

Описание аргументов:

Loopthumb - название нового размера миниатюр
- 588 - ширина в пикселях
- 125 - высота
- true - настройка, которая сообщает Wordpress следует ли использовать средства движка для изменения размеров изображения

Нам необходимо будет изменить наш код в файле index.php:

Также следует заметить, что у нас появятся два новых стиля для управления внешним видом миниатюры нового размера: attachment-loopThumb и wp-post-image. Может быть полезно обращаться к классу wp-post-image в таблице стилей или же добавить собственный класс при обращении к миниатюре:

"loopyThumbs")); ?>

Это выдаст тег img со следующими классами: loopyThumbs и wp-post-image.

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

Add_image_size("squareThumb", 125, 125, true);

Также, возможно, Вы захотите, чтобы миниатюры была слева и был небольшой отступ справа:

Attachment-post-thumbnail { float: left; margin-right: 10px; }

Теперь мы меняем код в index.php для отображения нашего квадрата:

Вот что у нас получится:

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

Но есть выход и в этой ситуации. Нам поможет плагин Regenerate Thumbnails . После установки плагина - зайдите Tools > Regen и сгенери руйте новые миниатюры ( Regenerate all Thumbnails). После этого у нас будут ровные квадраты.

И помните - для отображения миниатюр у Вас должен стоять Wordpress 2.9.

Надеюсь, Вам понравился урок. До следующих встреч!