Создание миниатюр в WordPress 2.9

Создание миниатюр в WordPress 2.9
Наверное все кто установил WordPress 2.9 знают что в нем появилась новая функция для создания миниатюр, но как ей пользоваться для многих до сих пор остается загадкой. Миниатюру можно добавить при создании новой записи, воспользовавшись блоком "Миниатюра записи", но к сожалению этот блок появляется только в том случае, если тема Вашего блога, поддерживает функцию - post-thumbnails. Кстати говоря даже в теме которая установлена по умолчанию эта функция почему то недоступна, не говоря уже о всех других темах которые сейчас доступны для скачивания.

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

<?php if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' ); ?>

Далее нужно вставить фукцию вывода миниатюр в том месте, где Вам это необходимо.

<?php the_post_thumbnail(); ?>

Давайте рассмотрим пример вставки миниатюры на стандартном шаблоне (default), для этого открываем файл index.php и находим там следующие строчки:

<div class="entry">
<?php the_content(__('Read the rest of this entry &raquo;', 'kubrick')); ?>
</div>

Далее под div class="entry" добавим следующий код:

<div class="thumbnail">
<a href="<?php the_permalink() ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
</div>

А в файл style.css добавим:

.thumbnail {
float: left;
padding: 0 10px 5px 0;
}

В итоге в файле index.php у нас получится следующая конструкция:

<div class="entry">
<div class="thumbnail">
<a href="<?php the_permalink() ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
</div>
<?php the_content(__('Read the rest of this entry &raquo;', 'kubrick')); ?>
</div>

Далее добавляем новую запись (теперь в при добавлении записи у нас доступен блок - Миниатюра записи, куда мы и вставляем нашу миниатюру). И смотрим что у нас получилось:
Миниатюра на странице
Также хочу обратить внимания что функцию the_post_thumbnail можно использовать с некоторыми аргументами:

 // миниатюра
the_post_thumbnail('thumbnail');
// средний
the_post_thumbnail('medium');
// большой
the_post_thumbnail('large');
// исходный
the_post_thumbnail();

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

// выравнивание слева
the_post_thumbnail('thumbnail', array('class' => 'alignleft'));
// выравнивание справа
the_post_thumbnail('thumbnail', array('class' => 'alignright'));
// выравнивание по центру
the_post_thumbnail('thumbnail', array('class' => 'aligncenter'));
// выравнивание справа и свой класс 'my_class'
the_post_thumbnail('thumbnail', array('class' => 'alignright my_class'));

Кроме того, можно назначить собственный размер миниатюры:

// миниатюра уменьшена до 60х60
the_post_thumbnail(array(60,60), array('class' => 'alignleft'));
// миниатюра со стандартными размерами
the_post_thumbnail(array(150,150), array('class' => 'alignleft'));
// средняя миниатюра, уменьшенная до 200х133
the_post_thumbnail(array(200,200), array('class' => 'alignleft'));
// большая миниатюра уменьшена до 400x266
the_post_thumbnail(array(400,345), array('class' => 'alignleft'));

Обратите внимание, что исходное соотношение сторон не изменится, даже если указать неправильные размеры.

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

// ширина миниатюры
get_option('thumbnail_size_w');
// высота миниатюры
get_option('thumbnail_size_h');
// высота среднего размера
get_option('medium_size_h');
// ширина большого размера
get_option('large_size_w');
// 1 = обрезать точно по размеру, 0 = не обрезать
get_option('thumbnail_crop');

Вот как можно использовать эти данные. Например, нам нужно вставить вдвое уменьшенную миниатюру:

$w = get_option('thumbnail_size_w') / 2;
$h = get_option('thumbnail_size_h') / 2;
the_post_thumbnail(array($w, $h), array('class' => 'alignleft'));

Еще один пример. Если размер миниатюры больше, чем 100x100 и thumbnail_crop включен, тогда уменьшить миниатюру до 100x100. Если меньше или равно 100x100, тогда поставить со стандартными размерами:
if (get_option('thumbnail_size_w') > 100 && get_option('thumbnail_crop') == 1) {
the_post_thumbnail(array(100,100));
} else {
the_post_thumbnail('thumbnail');
}

Теперь вы знаете все про миниатюры WordPress 😉 и можете смело использовать их в своих блогах и темах.

Имейте ввиду, что каждый вызов функции the_post_thumbnail создает 2 запроса к базе данных. Соответственно, при стандартном выводе 10 статей на страницу, это 20 запросов.

Рубрика: Учебник WordPress | 26 декабря 2009

Предыдущие записи из рубрики `Учебник WordPress`

13 комментариев

Знаток, 26.12.2009 в 14:56

Дмитрий огромное тебе спасибо, а то я вчера вечером час убил на то чтобы разобраться как работают эти миниатюры, но так в итоге ничего и не получилось 🙁 А тут ты все пряма таки сказать разжевал и все сразу понятно, в общем респект тебе 🙂
P.S. Наконец таки хоть одна по настоящему нужная функция, а то обновляешь-обновляешься, а ничем не пользуешься!

Wordpress.realms.biz, 26.12.2009 в 18:04

Админ, молодчина! Все полностью объяснил, я в одной своей статье тоже писал о миниатюрах в 2.9 ,но менее подробно. Спасибо за качественную статью!

alexpts, 26.12.2009 в 18:47

А по какому принцпу береться миниатюра? Первая картинка в посте?

Очень опечалило последнее предложение, где написано про запросы к БД... (

Deimos, 26.12.2009 в 19:14

alexpts, нет она вставляется через специальный блок - Миниатюра записи который находится под блоком выбора рубрик, как выглядит блок можешь посмотреть на первой картинке (справа от надписи, там вставлен мой логотип).

BB Wordpress, 28.12.2009 в 11:25

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

Truper, 29.12.2009 в 23:18

Я как только перешел на WordPress 2.9 сразу начал использовать данный функционал, но у меня на сайте используется эта функция в трех разных размерах, а crop'ить она может только основной заданный размер, так что от timtumb всё равно никуда не уйти.
Кстати сам сайт, на котором я это использую iconsets.ru - это не реклама а пример.
Кстати я там уже поставил WordPress 2.9.1 бетту.

Lazyfriend, 10.01.2010 в 11:42

"в файл function.php" Файл functions.php =)

Deimos, 10.01.2010 в 12:15

Lazyfriend, спасибо, поправил 😉

Orion, 26.01.2010 в 20:02

Странное дело. Я попробовал на WP (2.9.1) это проделать. НО! На любой теме, после вставки выше-приведенного кода php.... в файл functions.php... и админ-панель и сам сайт (вместо текста) выдаёт иероглифы! аля крокозябры.

И в UTF8 бе Boom кодировал и чё тока не делал. Все темы рубятся нах. помогает только ЗАМЕНА файла functions.php, на заранее заготовленный мною файл, перед махинациями. тк удаления кода не приводит к возврату текста в нормальное состояние.

В чём проблема-то?! дело в 2.9.1 или в руках?)

Дмитрий Жуков, 13.02.2010 в 12:30

Orion, Orion,
У меня была такая же проблема, решил легко. обращайтесь, помогу.
А если вкратце - то вместо кода:

Вставьте просто:

if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' );

где нибудь между тегами в файле функций темы functions.php.

А можно как-то в саму запись вставлять и чтобы не миниатюрой а просто под названием и над текстом.
Задача вывести картинку под названием и над текстом с одним и тем же классом, но чтобы выбирать как миниатюру в боковой панели.

kama, 26.07.2011 в 07:21

Дизайн студия ProGrafika, не совсем понял что вам нужно. Вам похоже нужно залезть в шаблон и там над the_content() прописать вызов миниатюры, с необходимыми размерами.

Елена, 16.08.2011 в 14:01

У меня такое не получается. Сайт пропадает после такого сохранения.

Комментировать

Новые комментарии