Янв
4
33

Миниатюры для поста в WP 2.9 на практике

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

Атрибуты img для вывода превью

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

< ?php the_post_thumbnail(array( 200,200 ), array( 'class' => 'alignleft' )); ?>

Можно использовать несколько классов либо добавлять другие атрибуты тега img как, например, переопределить alt – полезный для поисковиков.

<?php the_post_thumbnail('medium', array('class' => 'alignleft another_class')); ?> // задаем дополнительный класс
<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext')); ?> // класс + атрибут alt

Для заголовка title изображения превью мы можем также использовать переопределение, если нам это нужно. Без упоминания этих атрибутов по умолчанию автоматически выведутся значения из заданного вами в Media Library при загрузке картинки.

<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext', 'title' => 'titletext')); ?>

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

Есть в настройках wordpress блога такой раздел как «Медиафайлы» (Media Settings). Там можно указывать размер для миниатюрных изображений. Насколько я понимаю, если у вас есть блог с множеством зарегистрированных пользователей, то они могут эти настройки менять под себя. Так это или нет сказать сложно, но предлагаю научиться эти значения использовать при генерации миниатюр – мало ли пригодится для чего.

<?php
$width = get_option('thumbnail_size_w') / 2; //получить указанную ширину превьюшки
$height = get_option('thumbnail_size_h') /2; //получить указанную высоту превьюшки
the_post_thumbnail(array($width, $height), array('class' => 'alignleft'));
?>

В тех же медиа настройках есть 2 других размера «средний» и «большой» с указаниями других величин ширины и высоты изображения. Чтобы их считать нужно юзать код:

<?php get_option('medium_size_w'); //ширина "среднего" изображения ?>
<?php get_option('medium_size_h'); //высота "среднего" изображения ?>
<?php get_option('large_size_w'); //ширина "большого" изображения ?>
<?php get_option('large_size_h'); //ширина "большого" изображения ?>
<?php get_option('thumbnail_crop'); //проверка на вырезание части изображения, On=1, Off=0 ?>

Совместимость с другими версиями WordPress

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

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

if (  (function_exists('has_post_thumbnail')) && (has_post_thumbnail())  ) {
	the_post_thumbnail();
} else {
	$postimage = get_post_meta($post->ID, 'post-image', true);
	if ($postimage) {
		echo '<img src="'.$postimage.'" alt="" />';
	}
}

Здесь первым делом проверяется поддержки функции превью для постов, а также наличие этой самой миниатюры. Если все гуд – картинка выводится, в противном случае будет использован другой вариант. В данном случае используется метод произвольных полей custom fields — считывается ссылка для поля с названием post-image. Хотя, конечно, здесь может быть любой другой используемый вами метод, тот же с получением первой картинки поста вполне подходит.

Есть, кстати, возможность получить первое изображение из библиотеки media library

if ( function_exists('has_post_thumbnail') && has_post_thumbnail() ) {
  the_post_thumbnail(); // @param: array(height, width)
} else {
  // via mediathek
  $attachments = get_children( array(
                  'post_parent'    => get_the_ID(),
                  'post_type'      => 'attachment',
                  'numberposts'    => 1, // show all -1
                  'post_status'    => 'inherit',
                  'post_mime_type' => 'image',
                  'order'          => 'ASC',
                  'orderby'        => 'menu_order ASC'
                  ) );
  foreach ( $attachments as $attachment_id => $attachment ) {
    echo wp_get_attachment_image( $attachment_id );
  }
}

Подробнее о методе можно почитать здесь.

Отображение миниатюр в RSS блога

Даже такое оригинальное решение нашел на одном из блогов. Я так подозреваю, что использоваться  оно должно в том случае, если в RSS фид идет первая часть поста (анонс) без всяких там картинок и при этом нужно добавить миниатюру.

Автор рассказывает мол the_post_thumbnail – одно из любимых нововведений в WordPress 2.9, но недавно он с ужасом обнаружил, что заданное превью не было включено в RSS блога. Собственно, для этого он предлагает добавить в файл functions.php немного полезного кода:

function insertThumbnailRSS($content) {
   global $post;
   if ( has_post_thumbnail( $post->ID ) ){
       $content = '<p>' . get_the_post_thumbnail( $post->ID, 'medium' ) . '</p>' . $content;
   }
   return $content;
}
 
add_filter('the_excerpt_rss', 'insertThumbnailRSS');
add_filter('the_content_feed', 'insertThumbnailRSS');

Вот, как оказывается, все не просто с этими превью для постов в WordPress 2.9.

рейтинг Оцените статью:
Ужасная статьяНичего интересногоТак себеНормальноХорошоКлассный постВ закладки!
(голосов - 3, средний балл: 6,67 из 7)
Загрузка...

категория Категории: Хаки и секреты;
теги Теги: , , , , .

комментария 33 к статье “Миниатюры для поста в WP 2.9 на практике”

  • AzzePis   05.01.2010

    Спасибо за исчерпывающие примеры!

  • Перспективный блоггер   07.01.2010

    array(‘class’ => ‘alignleft’, ‘alt’ => ‘alttext’, ‘title’ => ‘titletext’)

    alttext и titletext почему-то не работают. Так и выводятся как строки: alttext и titletext

  • Tod   07.01.2010

    Перспективный блоггер, спасибо за замечание. Похоже я неправильно понял автора англоязычной статьи и там эти alttext и titletext вроде как означают обычный текст, который можно указывать, если мы хотим переопределить значения данных полей картинки из медиа библиотеки. Непонятно правда зачем это нужно, возможно попытаться вставить в картинку тайтл поста или что-то такое.
    Только что попробовал и если их не указывать, то заданные вручную значения альт и тайтл будут выводится автоматически.

  • Перспективный блоггер   07.01.2010

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

    То, что надо! Спасибо! Я че-т сам так не подумал попробовать. Сама функция просто класс, и в Рунете у тебя пока что у единственного внятное описание и отличные примеры! Спасибо за труды!

  • Yury   22.01.2010

    покажите хоть в работе это! а то две статьи про миниатюры и посты, а посмотреть что получается в итоге негде!

  • Tod   23.01.2010

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

  • Перспективный блоггер   23.01.2010

    Показал бы, да сайт клиента, которому делал, сейчас почему-то временно недоступен. Как встанет — кину ссылку. Делал почти весь шаб с помощью этой функции миниатюр, работает блестяще. Разработка красивого шаблона облегчается в разы.

  • RodgerFox   01.02.2010

    хм… не пойму, поч ругается wp:
    Fatal error: Call to undefined function the_post_thumbnail() in в строчке с вызовом функции =\

  • Перспективный блоггер   06.02.2010

    Yury, как и обещал, демонстрирую в работе: _http://a1tv.com.ua/
    Аналог популярного русского музыкального проекта. А ведь и не скажешь, что на ВП? ;)

  • Yury   06.02.2010

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

  • Саша   21.03.2010

    У меня несколько другой код вывода привьюшек, но вот в чем оказия, выводит не ту картику которую нужно, ставлю первую, а выводит следующию, подскажите как быть?

  • Алекс   05.05.2010

    подскажите из-за чего может не работать функция смены title и alt у миниатюры? версия wp 2.9.1 миниатюры выводятся непосредственно таким кодом <a href="» target=»_self»> », ‘title’ => »)); ?>
    мне необходимо вообще убрать значения тегов, чтобы при наведении на миниатюру ее не закрывала всплывающая подсказка. пробовал ставить разные значения alt и title, но все-равно выводится то, что было указано в админке.

  • Алекс   05.05.2010

    блин не могу добавить код. в общем 100 раз его проверял, он точно такой же как у вас в статье

  • Tod   05.05.2010

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

    <?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => '', 'title' => '')); ?>
  • Алекс   05.05.2010

    Вставил ваш код и все стало ок. Оказалось, что у меня проблема была в том, что я не указывал атрибут размера в данном случае’medium’ почему-то думал, что он не обязательный.

  • Алекс   05.05.2010

    если позволите, оффтопик небольшой, чтобы расставить для себя все точки над i.
    можно ли так же сделать пустыми теги title и alt для фотографий в каждом отдельном посте. как я понимаю надо что-то в single.php наколодовать.

  • Oxygen   25.11.2010

    Большое спасибо, отличная статья!

  • Артур   05.09.2011

    А если у меня в качестве миниатюры, первая картинка поста, этот последний код (Отображение миниатюр в RSS блога) для RSS будет работать?

  • Tod   06.09.2011

    Артур, последний код именно для миниатюр заданных в посте, поэтому вряд ли оно подойдет для «первой картинки поста». Фишка метода в том, что в переменную $content добавляется картинка а потом идет в RSS, то есть вместо функции get_the_post_thumbnail нужно подставить другой код для получения картинки поста и все тогда будет работать.

  • Артур   06.09.2011

    Я уверен ты обьяснил все очень понятно, но я в этом ничерта не смыслю :)
    Ну вот есть у меня там скрипт timthumb.php, он обрезает картинку и наверное делает еще много чего..
    На главной есть такой код:

    <img src="/timthumb.php?src=&w=400&h=250&zc=1″>

    В функциях темы тоже код есть к этому делу:

    function getImage($num) {
    global $more;
    $more = 1;
    $content = get_the_content();
    $count = substr_count($content, ‘<img');
    $start = 0;
    for($i=1;$i<=$count;$i++) {
    $imgBeg = strpos($content, '’);
    $postOutput = substr($post, 0, $imgEnd+1);
    $image[$i] = $postOutput;
    $start=$imgEnd+1;
    $cleanF = strpos($image[$num],’src=»‘)+5;
    $cleanB = strpos($image[$num],'»‘,$cleanF)-$cleanF;
    $imgThumb = substr($image[$num],$cleanF,$cleanB);
    }
    if(stristr($image[$num],'<img')) { echo $imgThumb; }
    $more = 0;
    }

    Может скажешь конкретнее чего поменять то? Или добавить?

  • Артур   06.09.2011

    Убралось в первом коде ?php bloginfo(‘template_directory’); ?> и ?php getImage(‘1’); ?>

  • Tod   06.09.2011

    Артур, хм, ну по логике я бы кусок кода с

    <img src="/timthumb.php?src=&w=400&h=250&zc=1″>

    добавил в последний пример вместо функции

    get_the_post_thumbnail( $post->ID, 'medium' )
  • Рам   30.10.2011

    Подскажите как реализовать миниатюры в виде ссылок на пост. Заранее спасибо

  • Tod   01.11.2011

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

  • Рам   03.11.2011

    Спасибо. Да, помог плагин Featured Post with thumbnail

  • Матерый   15.04.2012

    Ищу и ни как не могу найти ответа. Вот в чем дело.
    Использую тему Darhive, которая автоматически создает миниатюры, даже если изображение не было вставлено в запись.
    Подскажите- где и что нужно удалить, чтобы записи выводились без них?

  • Tod   16.04.2012

    Матерый, все «фишки» темы зачастую прописаны в functions.php, я бы начинал поиски миниатюр оттуда + конечно, файлы отображения главной и архивов index.php, archive.php.

  • ChenZi   18.06.2012

    Приветствую! Не подскажешь, где можно подправить?! Использую тему atahualpa, в постах изображения в зависимости от ресайза браузера автоматически масштабируются, на главной странице в мультипостах, задать показывать миниатюры, можно только фиксированного размера, например я указываю размер миниатюры 1000 на 200, соответственно потом на мультистраницах при ресайзе браузера, миниатюра не масштабируется, а залезает на соседние элементы, меню и прочее? Как сделать ее масштабируемой, резиновой?

  • Tod   18.06.2012

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

  • Владислав   10.04.2016

    Как заключить миниатюру в тег, например, ?

Оставить комментарий


Блог Wordpress Inside поможет вам научиться работать в вордпресс, закрепить и расширить имеющиеся знания. Плагины и шаблоны, разные хаки и функции wp, оптимизация и безопасность системы – все это и намного больше вы сможете найти на страницах нашего проекта!

Если хотите быстро и оперативно получать последние новости и статьи, то рекомендуем подписаться на обновления блога:

Поиск:
Последние посты
Лучшее в категории

Облако тегов
Скажи свое мнение!

В чем основные плюсы Wordpress?

Посмотреть результаты

Загрузка ... Загрузка ...
Друзья проекта
Последние новости