Миниатюры в WordPress
24 июня 2011 года, Размещено в категории: WordPress
Добрый день, сегодня пост про очень красивый вывод записей c миниатюрами в WordPress. Это вывод записей с уменьшенным изображением (миниатюрой). Чаще всего миниатюры в wordpress используется на главной странице, уменьшенные изображения притягивают взгляд к статье и вообще внешний вид сайта с миниатюрами заметно лучше.
Давайте приступим к настройке превьюшек на сайте.
Изначально, в старых версиях WordPress (до 3), функция вывода миниатюр присутствовала, но была не активирована. Чтобы проверить включена она или нет - Зайдите в админку WordPress и откройте какую-нибудь запись для редактирования, если вы видите вот такой бокс справа – внизу (без изображения):
Значитё всё нормально и функции Post-Thumbnail включена. Если не видите, то открывайте файл functions.php и вставьте туда вот этот код
add_theme_support('post-thumbnails'); |
Теперь «окно добавления изображений» будет присутствовать в админке.
Вывод миниатюры
Блок, который изображён на первом скриншоте поста, выводиться с помощью вот этого кода:
<div class="entry"> <h2><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a> </h2>// Заголовок поста <a href="<?php the_permalink() ?>"> <div align="center" id="thumbnail"><?php the_post_thumbnail(array(250,187)); ?></div> </a> //Выводиться миниатюра ссылкой на пост <br/> <?php the_excerpt($post,50) ?>// Вывод текста и его размер <br/> <a href="<?php the_permalink() ?>">Читать Далее...</a> </div> |
Вывод миниатюры осуществляется при помощи функции:
<?php the_post_thumbnail(); ?> |
Оформление миниатюр в WordPress
Чтобы изменять размеры выводимой картинки, надо добавить размеры в функцию вывода:
// размер 50х50 пикселей the_post_thumbnail(array(50,50)); // размер 150х100 пикселей the_post_thumbnail(array(150,100)); |
Так же мы можем создать выравнивание для миниатюр, дописав нужный класс к функции:
// выравнивание справа the_post_thumbnail('thumbnail', array('class' => 'alignright')); // выравнивание слева the_post_thumbnail('thumbnail', array('class' => 'alignleft')); // центрирование the_post_thumbnail('thumbnail', array('class' => 'aligncenter')); //Таким же способом можно присвоить какой-нибудь класс к миниаютере и потом уже оформлять //с помощью него в CSS, например класс – one: the_post_thumbnail('thumbnail', array('class' => 'one')); |
На этом всё, спасибо за внимание. Если возникнут вопросы, то пишите в комментариях, всем с удовольствием отвечу.
Vasiik
9 лет назад
Спасибо, очень хороший урок. Как раз искал как сделать вывод вот таких превьюшек на главной странице
9 лет назад
Пожалуйста, подписывайтесь на RSS, я в скором времени более подробно буду описывать вёрстку шаблона для WP.
8 лет назад
Подскажите как реализовать миниатюры в виде ссылок на пост. Заранее спасибо
8 лет назад
Вот так:
<a href=»<?php the_permalink() ? rel=»nofollow»>»>
<?php the_post_thumbnail(array(250,187)); ?>
</a>
Подкорректируйте ковычки только, а то WP почему-то режит.
Mishel
8 лет назад
Извините, а у меня функция the_excerpt($post,20) не реагирует на количество слов, выводит весь стандартный набор до самого тега . И если для превью в категориях это подходит , то для сайдбара — нет. Не подскажете как быть.
8 лет назад
Опишите эту функцию в файле function.php, вашей темы:
<?php// Вывод the_excerpt, с кол-ом символов
function the_excerpt2($post, $count = 30) {
if(empty($post)) {
the_excerpt();
return false;
}
$content = trim(strip_tags($post->post_content));
$content = explode(' ', $content);
$content = array_slice($content, 0, $count);
$content = implode(' ', $content);
echo $content; return true;
return true;
} ?>
Если не будет работать, то дайте другое название функции, например
the_excerpt2и в шаблоне тогда надо будет использовать новое название.8 лет назад
Сайт находится в разработке.Как сделать, чтобы на главную не выводились новостные материалы.На ней я хочу разместить только
одну постоянную запись.
8 лет назад
Посмотрите в админке — Параментры — Чтение.
mrtoxa
8 лет назад
Возникла трудность. После добавления
if ( function_exists( ‘add_theme_support’ ) ) add_theme_support( ‘post-thumbnails’ ); в functions.phpне добавляется меню для вставки превью на странице создания записи. Пробовал с этой же темой на локалхосте, все ок, а на самом сайте не хочет. Пытался на WordPress 3.3.1. и 3.3
8 лет назад
Для последних версий WP не надо добовлять этот код. Превьюшки должны работатб сразу.
mrtoxa
8 лет назад
Проблема в том, что на локалхосте эта функция присутствует, а когда переношу шаблон на сервер — пропадает.
8 лет назад
Напишите в саппорт хостинга, может у них что-то отключено.
Евгений
8 лет назад
Можете подсказать по данной теме, а то ни как не могу сообразить чёта, мне нужно в sitebar вывести одну последнюю миниатюру с размером 114х157 с поста сайта и чтобы при клике по ней, открывалась данная статья. Вот собственно это не получается пока сделать. Подскажите пожалуйста, что именно нужно прописать в файле function и в месте вывода данной миниатюры??
За ранее очень благодарен!
8 лет назад
Опишите что вы сделали уже и что не получается? А вообще почитайте статью http://gering111.com/populyarnyie-zapisi-wordpress/ здесь расписан код вывода последих постов в сайдбаре, с превьюшками.
8 лет назад
хай.занимательно, но возникла трабла!!
Можно ли реализовать вот таким образом:
-за каждой категорией прикреплена картинка;
-когда выводится материал с определённой категории,то в миниатюре автоматом ставится прикреплённая картинка.
Знаю что бред, но можно такое сделать? Я видел на ДЛЕ похожее..спс))
8 лет назад
Без специального программинга нельзя. Надо программиста вам искать.
Яна
8 лет назад
Может вы и мне подскажите в моей проблемы. Видела на многих сайтах, что вместо цитаты миниатюры и названия, выводится миниатюра и название. Мне тоже нужно выводить лишь картинку и название в две колонки на страницах рубрик. Мне это очень нужно так как сейчас работаю над созданием своего уникального кулинарного сайта. Прошу, просто молю Вас о помощи! Помоги утопающиму новичку в этом деле. Заранее спасибо!
8 лет назад
Уберите
, он отвечает за вывод описания.Екатерина
8 лет назад
Подскажите, а какой код отвечает за вывод картинок (а не миниатюр) на главной?
8 лет назад
Это сама функция вывода картинок the_content, если в посте есть картинка, то она будет выводится и на главной.
8 лет назад
Здравствуйте! Я хочу заранее попросить прощения за свою, скорее всего, глупую просьбу :). Решение моей проблемы, уверен, очень простое, но для меня все такое сложное! Я вот, что хочу сделать. Хочу в сайдбаре вывести 1 рубрику (блоги), хочется, чтобы была фотография, заголовок, и немного описания. И чтобы новый написанный пост заменял старый… Блогеров будет несколько, и снова хотелось бы, чтобы в конце краткого описания была ссылка (читать далее) , а немного ниже все блоги этого блогера. Мог бы мне кто-нибудь помочь с кодом ? Буду очень благодарен!
Спасибо.
7 лет назад
Владислав Тебе нужно, что бы выводился примерно, как на этом в сайте rendzhi.com?
7 лет назад
Спасибо. Как говорится все гениальное просто. А есть какой-нибудь вариант чтоб подхватывалась первая картинка в записях?
7 лет назад
Подскажите, как вывести посты из одной рубрики, например новости? Спасибо заранее.
7 лет назад
Помогли очень с выводом размера миниатюр the_post_thumbnail(array(150,100));
6 лет назад
Наконец то я нашел то, что искал.
С успехом применил данную функцию. А то какие то плагины, сложные настройки, а тут все так предельно просто..
Огромное спасибо автору сайта!
Данилл
6 лет назад
Добрый день! Не подскажите, как сделать, чтобы вместо миниатюр на главной странице появлялись картинки из поста. В моей теме simple catch если я не вывожу миниатюры, то картинки не появляются на главной странице, остается одно потолно текста.