The post thumbnail wordpress

Всем привет! Сегодня на seo-mayak.com урок на тему: миниатюра записи в анонсе WordPress. Заодно мы разберем работу функции the_post_thumbnail() и поговорим о размерах миниатюр.

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

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

miniatiura zapisi


Поэтому всем очень советую по возможности вместо плагинов пользоваться функциями WordPress, благо таковые имеются.

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

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

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

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

Размеры изображений WordPress

В настройках WordPress ( Настройки -> Медиафайлы ) по умолчанию заданны следующие размеры:

Размер миниатюры — 150х150 пикселей;
Средний размер — 300х300 пикселей;
Крупный размер — 640х640 пикселей;
Исходный размер не задается.

Каждому указанному размеру WordPress присваивает обозначение или название, как угодно:

150х150 — thumbnail;
300х300 — medium;
640х640 — large;
Исходный размер — full.

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


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

В данной ситуации есть два решения.

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

Решение №2. Можно обойтись без перезаливки изображений, тем самым забив на рекомендации PageSpeed и изменить размеры в самой функции.

Итак, самое время познакомить Вас с функцией вывода изображений, которая называется the_post_thumbnail().

Функция the_post_thumbnail()

Скажу сразу, функция the_post_thumbnail() — это тег шаблона, который работает только внутри цикла WordPress.

На заметку! Функция the_post_thumbnail() работает на основе get_the_post_thumbnail().

Единственное отличие функции the_post_thumbnail() от get_the_post_thumbnail() в том, что в ней нельзя указать ID записи, в качестве параметра, так как функция всегда берет миниатюру с текущего поста в цикле.

Функция the_post_thumbnail() может принимать один или два параметра. Первым параметром всегда идет размер изображения, например:

<?php the_post_thumbnail('medium'); ?>  

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


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

<?php the_post_thumbnail(array(50,50)); ?>

Где 50,50 — новые размеры для миниатюры.

Вторым параметром функция может принимать CSS класс, например:

<?php the_post_thumbnail('medium', array('class' => 'miniature')); ?>  

В файле style.css, для класса .miniature, можно прописать следующие стили:

.miniature{   background: #D2D2D2; /* задний фон */   border: 1px solid #888888; /* рамка */   border-radius: 8px; /* закругление углов */   float: left; /* Выравнивание по левому краю */   height: 181px; /* Высота изображения */   width: 250px; /* Ширина изображения */   margin-bottom: 5px; /* Внешний отступ снизу */   margin-right: 15px; /* Внешний отступ справа */   padding: 5px; /* Внутренние отступы */   }  

Вы наверное поняли, что стили, которые я привел выше, были применены на моем блоге и конечно Вы их можете изменить на свое усмотрение. Для работы со стилями советую пользоваться расширением Firebug.

Но прописывать свой CSS класс в функции вовсе не обязательно, так как всем миниатюрам, созданными функцией get_the_post_thumbnail(), WordPress присваивает общий класс .wp-post-image, но кроме того, миниатюры получают отдельный класс, в зависимости от их размера:


.attachment-thumbnail — размер миниатюры;
.attachment-medium — средний размер;
.attachment-large — крупный размер;
.attachment-full — исходный размер.

Итак, с функцией и ее параметрами мы немного разобрались, осталось выяснить, как с помощью the_post_thumbnail() миниатюра записи выводится в анонс.

seo-mayak.com

Активация функции the_post_thumbnail

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

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

Вы также можете добавить поддержку функции только для постов или страниц:

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


Следующий шаг от Mark Jaquith – установка размеры для ваших превью в шаблоне. Для этого имеется два разных подхода – ресайз или вырезание части картинки. Ресайз позволяет пропорционально уменьшать изображения для поста до указанных вами параметров. Например, у вас есть картинка 100х50, тогда при уменьшении до 50х50 вы фактически получите превью размером 50х25. Преимущество этого метода в том, что отображаться будет все изображение целиком. Плохо то, что в таком случае вы можете получить не всегда одинаковые картинки – ресайз будет производиться то по ширине, то по высоте. В таком случае можно немного «схитрить» и указать для неважной величины очень большое значение – допустим, ширину картинки поставить в 50, а высоту – 9999. В итоге вы получите все превью с шириной 50, что весьма органично впишется в любой дизайн:)

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

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

Добавление превью (миниатюры) для поста


После активации функции в админке при написании постав вы увидите блок «Миниатюра записи», где можно будет загрузить картинку. После клика на ссылку появится стандартное окно добавления изображения (Add Media), где можно выбрать изображение со своего компа или уже имеющееся в галерее. При выборе картинки из галереи в самом конце страницы с настройками вы найдете ссылочку «Использовать как миниатюру» (Use as thumbnail) – кликаем, и все готово.

The post thumbnail wordpress

На странице после загрузки фото будет такая же ссылка. Если вы все сделали правильно, то превью отобразится в блоке «Миниатюра записи».

Вывод миниатюры (превью) в шаблоне блога

За отображение превью отвечает функция the_post_thumbnail, поэтому в каком-то из файлов шаблона, например, index.php мы пишем:

Понятно, что использовать строку нужно в пределах цикла loop, которые выводит посты блога. В результате будет выведена миниатюра с размерами по умолчанию. Говорят, это все равно, что использовать код (хотя лучше без параметра):

Я точно не уверен, но вполне вероятно, что понятие «по умолчанию» берется именно из тех строк, которые мы указывали при активации – это нужно проверять на практие. Можно также выводить миниатюры различных размеров, которые в WordPress создаются автоматически при загрузке картинки.


Кстати, интересно, что Matt Mullenweg в комментариях на одном из блогов не рекомендовал использовать именные аргументы для функции как thumbnail и другие, но пока никак это не объяснил.

Еще можно добавить в код проверку наличия миниатюры в посте:

Результатом вызова функции the_post_thumbnail() будет генерация тега <img /> с классом wp-post-image, для которого вы можете прописать некоторые настройки в CSS по типу рамки или чего-то подобного:

За вторую часть поста спасибо автору данной полезной заметки. Поскольку пост получился немаленьким, то еще один подпункт статьи я вынесу в следующий пост. В принципе, имеющейся информации должно хватить, завтра я покажу парочку полезных примерчиков применения данной функции на практике. Кстати, там в проверке наличия прервью для поста я говорил о другом варианте. Для вывода изображений вполне можно использовать произвольные поля (custom fields) — как раз недавно об этом писал в своем основном блоге.

wordpressinside.ru


Если вы еще не в курсе, то начиная с версии WordPress 2.9 RC1, появилась давно ожидаемая функция the_post_thumbnail, с помощью которой можно легко вставлять миниатюры в свои статьи. Хочу рассказать как работать с этой функцией, а также поделюсь впечатлениями от работы с ней.

Итак, в качестве миниатюр можно использовать изображения четырех стандартных размеров. Это «миниатюра» (150х150), «средний» (300х300), «большой» (1024х1024) и исходный. Изменить параметры этих размеров можно в меню Настройка — Медиафайлы.

Первое условие, которое необходимо для работы функции the_post_thumbnail — вставка специального кода, который активирует поддержку миниатюр. Его необходимо вставить в файл functions.php вашей темы. После этого, при редактировании статьи, вы будете видеть специальный блок для установки миниатюры, который расположен в правой части окна.

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

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

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

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

А как сделать, чтобы блогер мог сам менять размеры миниатюр, не прибегая к правке файлов темы?


Для тех, кто занимается профессиональной разработкой для WordPress, это очень важный вопрос. Что узнать размеры миниатюр, заданые в админке, достаточно воспользоваться стандартной функцией. Например:

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

Еще один пример. Если размер миниатюры больше, чем 100х100 и thumbnail_crop включен, тогда уменьшить миниатюру до 100х100. Если меньше или равно 100х100, тогда поставить со стандартными рахмерами. Смотрим:

Теперь вы знаете все про миниатюры WordPress 🙂

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

Если не хотите ждать выхода финальной версии 2.9, то можете скачать WordPress 2.9 Beta2 и в воочию увидеть новые возможности.

Перевод: The Ultimative Guide For the_post_thumbnail In WordPress 2.9

Постоянная ссылка: Установка миниатюр в WordPress, подробное описание the_post_thumbnail

neolot.com

Фильтр post_thumbnail_size

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

$size
(строка|массив) — аналогичен параметру $size из самой функции.

В следующем примере мы устанавливаем размер для всех миниатюр на блоге medium
:

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

Фильтр post_thumbnail_html

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

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

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

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

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

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

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

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

Ещё одна полезная вещь, которую можно сделать при помощи фильтра post_thumbnail_html. Допустим, нам не нужен весь HTML-код с тегом <img>, допустим, нам нужен только URL. В таком случае:

misha.blog

Добавление изображения-превью для поста или страницы в WordPress

Вывести изображения для иллюстрации содержания записи или страницы на WordPress достаточно просто. Для этого, во время создания новой записи, нужно просто нажать кнопку «Задать миниатюру», находящуюся справа внизу окна редактора.

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

  • Заголовок – появляется при наведении курсора;
  • Подпись – можно вывести специальным кодом;
  • Атрибут alt – альтернативный текст, отображается вместо отсутствующего изображения;
  • Описание – краткое описание содержания картинки.

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

Проблема повторяющихся изображений в постах

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

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

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

Местонахождение этой строчки может отличаться, но всегда следует начинать поиск с файла «Single.php». На примере стандартного WordPress шаблона Twenty Sixteen, нужно открыть редактора кода, который расположен в разделе «Внешний вид» административной панели. Здесь потребуется открыть файл «Single.php» и найти в коде строчку, отвечающую за вывод контента. Она выглядит так:

get_template_part( 'template-parts/content', 'single' );

Из этой строчки становится понятно, что продолжать поиск необходимо по файлу «content-single.php». Открыв этот файл в редакторе, вы найдете такую строку:

<?php twentysixteen_post_thumbnail(); ?>

miniatyry-zapisey

Именно она и отвечает за вывод миниатюры на странице отдельной статьи. Имейте ввиду, что эта строчка может выглядеть по-разному, все зависит от конкретного шаблона, но она обязательно должна содержать слова «post» и «thumbnail». Вам нужно просто заменить эту строчку на:

<?php if (is_home() or is_category()) { twentysixteen_post_thumbnail(); } ?>

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

Включение поддержки миниатюры в шаблоне

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

Первым делом, необходимо открыть файл «functions.php», находящийся в папке с темой, и добавить следующую строчку:

add_theme_support( 'post-thumbnails');

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

add_theme_support( 'post-thumbnails', array( 'post') );

А только для страницы такую:

add_theme_support( 'post-thumbnails', array( 'page') );

Далее, вы должны указать размеры, воспользовавшись один из двух способов, предлагаемых функциями WordPress: пропорциональное изменение или обрезка. В первом случае, изображение будет пропорционально (без искажений) сжиматься, пока не будет соответствовать указанной ширине и высоте. Например, если оригинальная картинка будет 100 × 50, а вы указали 50 × 50, то по итогу получится 50 × 25. Код первого способа выглядит так:

set_post_thumbnail_size( 50, 50 );

Преимущество этого способа в том, что картинки будут показаны целиком. Недостатком является то, что все они будут разного размера, что не всегда соответствует дизайну сайта. Но есть возможность ограничить их только по ширине, оставляя оригинальную высоту. Это можно сделать, просто указав большое число вторым параметром, например, такое 9999.
miniatyru-wordpress1
Второй способ изменения размера – обрезка. В этом случае изображение обрезается, чтобы соответствовать целевому коэффициенту пропорциональности, а затем сжимается, чтобы поместиться в заданные параметры наиболее точно. Код данного способа выглядит так:

set_post_thumbnail_size( 50, 50, true );

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

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

<? php the_post_thumbnail (); ?>

Заключение

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

Похожие статьи

wordpresslib.ru

has_post_thumbnail()

The point of this function is simply to find out whether or not a post has an associated thumbnail. The function simply returns boolean true or false indicating whether or not the post has a thumbnail.

You can call the function without any parameters – has_post_thumbnail() – and it will pull the ID of the current post. If you want to check on a specific post, you can feed an ID into the function – has_post_thumbnail(123) – where “123” is the wordpress numerical ID of the specific post you’re checking.

get_post_thumbnail_id()

This function is extremely similar to has_post_thumbnail(), except that this function actually returns the numerical ID of the attachment that’s being used as the post thumbnail if one exists. As with has_post_thumbnail(), you can call the get_post_thumbnail_id() without any parameters, or you can feed it a post ID to get a specific post’s thumbnail.

get_the_post_thumbnail()

The next function, which is the real crux of the whole post thumbnail concept, is get_the_post_thumbnail(). This function is used to actually retrieve the HTML code you need to display and/or manipulate the post thumbnail.

The get_the_post_thumbnail() function accepts three optional parameters:

  • post ID – the numerical ID of the post for which you want to retrieve the thumbnail
  • size – contrary to what you may see in various documentation, the default for this parameter is not to return the thumbnail-sized (usually 150×150, I think) version of the image; it is actually to retrieve the size of the image defined in the theme’s functions.php file with the set_post_thumbnail_size() function. If you don’t call the set_post_thumbnail_size() function anywhere in your functions.php file, I believe the get_the_post_thumbnail() function returns the full-sized (original) version of your image.You have five choices for the size of the returned image. The first of which is the default ‘post-thumbnail’ (explained to the best of my understanding above). The others are as follows.
    • ‘thumbnail’ – the default thumbnail size of the image (I believe the WordPress default is 150×150, cropped to a square)
    • ‘medium’ – the standard WordPress medium-sized image (maximum of 300×300, resized proportionally without cropping)
    • ‘large’ – the standard WordPress large-sized image (maximum of 1024×1024, resized proportionally without cropping)
    • custom – you can provide an array with two elements – width and height, respectively – to set a custom size for the image. I’m not sure whether the returned image is cropped or sized proportionally
  • attributes – there is still very little documentation on what this parameter does, and it’s difficult to trace through the various function calls to which this parameter is fed. However, the best I’ve been able to ascertain is that there are four different attributes you can send through this parameter.Based on the documentation I’ve found, they seem to be extra query parameters for finding the image, but I think these are actually used to add extra information to the <img> tag that’s generated by the function.Those attributes are:
    • src – can be used to override the “src” attribute in the <img> tag
    • class – the CSS class that should be applied to the image
    • alt – the alternate text that should be used for the image
    • title – the HTML title to use for the image

    The attributes are actually used by the wp_get_attachment_image() function, which is called from within the get_the_post_thumbnail() function.

Again, the get_the_post_thumbnail() function returns an HTML <img> tag with all of the appropriate attributes set. Unfortunately, there is no simple way (as of yet, at least) to retrieve the appropriate attributes in a PHP array or anything, so, if you want to manipulate them after you retrieve them, you’re going to have to parse the <img> tag yourself and change them around.

www.htmlcenter.com

Getting the thumbnail

These functions are commonly used during the loop, because with the_post() it gives us access. Though they can be used anywhere, in custom loops or custom post types, with a minor change.

Everywhere the_post_thumbnail() is mentioned it can equally be replaced with echo get_the_post_thumbnail(). It depends on your preferences.

Inside the loop

while ( have_posts() ) : the_post();   the_post_thumbnail();  endwhile; 

Inside a custom post type

Inside a custom post type is very much like the loop, however, we have to call the_post() on the WP_Query object.

$custom_post_type = new WP_Query( array(  'post_type' => 'portfolio',  'post_status' => 'publish',  'posts_per_page' => -1, ) );  while ( $custom_post_type->have_posts() ) : $custom_post_type->the_post();   the_post_thumbnail();  endwhile; 

Getting the thumbnail URL

Sometimes you may want to get the image src to use it for an inline style. You have access to an array which will return the URL, width, and height.

Everywhere the_post_thumbnail() is mentioned it can equally be replaced with echo get_the_post_thumbnail(). It depends on your preferences.

Inside the loop

while ( have_posts() ) : the_post();   the_post_thumbnail_url();  endwhile; 

Inside custom post type

Very similar, again, we need to make sure we set up the template tags.

$custom_post_type = new WP_Query( array(  'post_type' => 'portfolio',  'post_status' => 'publish',  'posts_per_page' => -1, ) );  while ( $custom_post_type->have_posts() ) : $custom_post_type->the_post();   the_post_thumbnail_url();  endwhile; 

Without using helper functions

Setting up the post template tags is much more convenient, however, for completeness you can do it without those. However, it does give you access to a few more attributes this way.

The loop

while ( have_posts() ) : the_post();   $image = wp_get_attachment_image_src($post_id);  $image_url = $image[0];  $image_width = $image[1];  $image_height = $image[2];  endwhile; 

Custom post type

$custom_post_type = new WP_Query( array(  'post_type' => 'portfolio',  'post_status' => 'publish',  'posts_per_page' => -1, ) );  while ( $custom_post_type->have_posts() ) : $custom_post_type->the_post();   $image = wp_get_attachment_image_src($custom_post_type->ID);  $image_url = $image[0];  $image_width = $image[1];  $image_height = $image[2];  endwhile; 

Inside functions.php or outside of a loop

Outside of a loop we don’t have access to the_post(). So using setup_postdata() is a close equivalent of doing that. Which gives us access to the template tag functions. You won’t need to do this frequently, but it is handy for certain situations.

Custom function for use in single posts

function custom_post_thumbnail() {  global $post;  setup_postdata($post);   the_post_thumbnail(); } 

Usage

It can then be used like any other function in your template, in or out of the loop.

custom_post_thumbnail(); 

You could also add an action to your template.

In single.php or another template

do_action('before_single_post_loop');  while ( have_posts() ) : the_post();   // Post content  endwhile; 

Addition to custom function

function custom_post_thumbnail() {  global $post;  setup_postdata($post);   the_post_thumbnail(); }  add_action('before_single_post_loop', 'custom_post_thumbnail'); 

That’s it

These are all the ways that I’ve come across to add a post thumbnail. Are there any I have forgot? Let me know on twitter.

iamsteve.me

WordPress-Christmas-18WordPress 2.9 RC1 is released and the new post thumbnail function will not change until the final version hopefully.
I was chatting a little bit with Sergej Müller last night and we were trying some things out. We found out the following things:

Edit: Some little changes, see Matt’s comment.

You can provide 4 picture formats to the function (change the width and height values to your need):

  // the thumbnail   the_post_thumbnail(array(100,100));     // medium resolution  the_post_thumbnail(array(300,200));    // large resolution  the_post_thumbnail(array(600, 400));    // original  the_post_thumbnail();  

You can set how the images should align. It is also possible to assign an own class:

  // left align  the_post_thumbnail(array(100,100), array('class' => 'alignleft'));    // right align  the_post_thumbnail(array(100,100), array('class' => 'alignright'));    // center  the_post_thumbnail(array(100,100), array('class' => 'aligncenter'));    // align right and the class 'my_own_class'  the_post_thumbnail(array(100,100), array('class' => 'alignright my_own_class'));   

The 3rd possibility is the control of the images size with an array of height and width:
For this purpose we suppose that the settings for thumbnail is 150×150, for medium 300×200 and for large 600×400.

  // thumbnail scaled to 60x60 pixel  the_post_thumbnail(array(60,60), array('class' => 'alignleft'));     // original thumbnail  the_post_thumbnail(array(150,150), array('class' => 'alignleft'));    // medium resolution scaled to 200x133 pixel  the_post_thumbnail(array(200,200), array('class' => 'alignleft'));    // large resolution scaled to 400x266 Pixel  the_post_thumbnail(array(400,345), array('class' => 'alignleft'));  

We see that the image proportions are always maintained, even if one specifies crooked values.

For the Theme Designers is this not necessarily easier, because no one knows what the user will put in his settings o his library. One way to approach this problem, to query the options for the various sizes:

  // width of the thumbnails  get_option('thumbnail_size_w');    // height of the thumbnails  get_option('thumbnail_size_h');    // height of the medium resolution  get_option('medium_size_h');    // width of the large resolution  get_option('large_size_w');    // 1 = Crop thumbnail to exact dimensions, 0 = Crop off  get_option('thumbnail_crop')  

You can change these values in your theme.

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

Here another example: If the size of a thumbnail is bigger than 100×100 and crop is activated, then the thumbnail should be resized to 100×100, otherwise use the original thumbnail.

  if(get_option('thumbnail_size_w') > 100 && get_option('thumbnail_crop') == 1) {   the_post_thumbnail(array(100,100));  }else{   the_post_thumbnail('thumbnail');  }  

Have fun with post thumbnails! But be aware, that each post thumbnail requires 2 data base queries. On a page with 10 posts that would be 20 more queries.

wpengineer.com


You May Also Like

About the Author: admind

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.

Adblock
detector