/ Wordpress / Миниатюры

Миниатюры

HIT

14.06.2015

2975

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

Миниатюра записи

Добавление миниатюр записям (в файле funсtions.php)

//добавление поддержки миниатюр
if ( function_exists('add_theme_support') ) {
add_theme_support('post-thumbnails');
}

Если отсутствует миниатюры выдает placeholder (в верстке)

<?php if( has_post_thumbnail() ) {
	the_post_thumbnail();
} else {
	echo '<img src="'.get_bloginfo("template_url").'/images/img-default.jpg" />';
}
?>
Генерируемый placeholder — https://placeholder.com/ Работает это так: запрашиваем необходимый размер миниатюры и помещаем url к нему в переменную: $image = ‘http://placehold.it/800×490’;

Фон из миниатюры в div’е

<?php if( has_post_thumbnail() ) : ?>

<?php
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'has_post_thumbnail' );
$url = $thumb['0'];
?>
<div id="post-div-pic" style="background-image:url(<?=$url?>);"></div> 

<?php endif; ?>

не помню..

<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(300,225), array("class" => "alignleft post_thumbnail")); } ?>

Пользовательские миниатюры

Добавление нового типоразмера миниатюры

add_image_size( 'square', 300, 300, array( 'center', 'top' ) );

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

add_filter( 'image_size_names_choose', 'my_custom_sizes' );

function my_custom_sizes( $sizes ) {
	return array_merge( $sizes, array(
		'square' => 'Квадратная',
	) );
}
Новые размеры создаются с загрузкой последующих изображений.

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

Старые миниатюры нужно перезагружать плагином Regenerate Thumbnails. В плагине всего одна кнопка — обновить.

В последних версиях Regenerate Thumbnails изменил алгоритм работы. На некоторых сайтах не обновляются миниатюры, ошибка:
Unable to fetch a list of attachment IDs to process from the WordPress REST API. You can check your browser’s console for details. Это происходит на сайтах у которых не работает Rest Api. В частности у меня не работало по причине хуков отключающих Rest Api.

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

С последней версией плагина появилась возможность перезагружать отдельно любую миниатюру.

Удаление лишних миниатюр

В процессе работы сайта может накопится некоторое множество неиспользуемых миниатюр (как размеров, так и вложений в целом). Плагин Regenerate Thumbnails в процессе пересоздания миниатюр старые не удаляет, даже если поставить соответствующую галку.

Чтобы избавиться от лишних миниатюр поможет плагин Media Cleaner (20 000+).

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

Удалить все миниатюры может плагин Thumbnail Cleaner (4000). Естественно делать это нужно с осторожностью (backup).

В этом плане все таки лучший плагин — Force Regenerate Thumbnails (Автор: Exactly WWW). Он пересоздает миниатюры и РЕАЛЬНО удаляет неиспользуемые в шаблоне.

Плагин Delete Thumbnails (от davidsword) удаляет все созданные миниатюры. Но у него есть одна недоработка, он выявляет миниатюры по принципу что в названии файла есть приставки -300х300 и т.д. с любыми размерами. И если исходный файл был загружен с подобными приставками то он удалит и его.

Размеры миниатюр

Стандартные размеры миниатюр

the_post_thumbnail();                  // Передается параметр -> 'post-thumbnail'
the_post_thumbnail('thumbnail');       // Размер по умолчанию: 150px x 150px max
the_post_thumbnail('medium');          // Размер по умолчанию: 300px x 300px max
the_post_thumbnail('large');           // Размер по умолчанию: 640px x 640px max
the_post_thumbnail('full');            // оригинальный размер загруженного файла
the_post_thumbnail( array(100,100) );  // Произвольный размер (100px x 100px)
the_post_thumbnail( 'square' );  // Пользовательский размер миниатюры

Недавно заметил, что появился еще один размер миниатюры —
medium_large. Не обрезанная и не измененная по пропорциям миниатюра с шириной до 1024 px (по умолчанию). При этом large определяется по большей стороне (ширина или высота).

Кадрирование (crop)

Flase (мягкое кадрирование)

Эта строка укажет WP, что при загрузке нового файла, нужно создать его уменьшенную копию. В этом случае миниатюра будет подогнана под ширину или высоту, смотря какая из сторон подходит больше, а противоположная сторона будет уменьшена пропорционально и скорее всего не будет больше указанного размера. Например, у нас оригинал картинки 2500х1800 пикселей мы делаем миниатюру 220х180 пикселей. Картинка будет уменьшена до размеров — 250х180 px, т.е. высота будет 180, как мы и указали, однако ширина получится выше указанной 250 а не 220. В этом случае картинка не кадрируется и уменьшенная копия сохраняет пропорции полностью.

add_image_size( 'homepage-thumb', 220, 180 );

True (жесткое кадрирование)

Если установить четвертый параметр в true, то миниатюра будет уменьшена и обрезана точно под указанные размеры. Например, у нас оригинал картинки 2500х1800 пикселей мы делаем миниатюру 220х180 пикселей. Оригинал будет уменьшен до высоты 180xp (тогда ширина его как бы равна 250px), а ширина будет обрезана по краям по 15px и в итоге получим уменьшенную копию: 220х180 пикселей:

add_image_size( 'homepage-thumb', 220, 180, true ); // 220 pixels wide by 180 pixels tall, hard crop mode

Уменьшение по нужной стороне

Чтобы уменьшить картинку по одной из нужных нам сторон, нужно указать противоположной стороне огромное значение. Например, у нас есть картинка 2500х1800, нам нужно получить миниатюру 500х1800, тогда указываем так:

add_image_size( 'homepage-thumb', 500, 9999 );

Array( x, y ) (жесткое кадрирование с указанием позиций)

С версии 3.9 появилась возможность указывать позицию кадрирования. Давайте добавим размер миниатюры, которая будет размером 220х220 пикселей и будет фрагментом от оригинала, который будет взят с левого верхнего угла (left, top):

add_image_size( 'custom-size', 220, 220, array( 'left', 'top' ) );

Х_позиция может быть: ‘left’ ‘center’ или ‘right’.
Y_позиция может быть: ‘top’, ‘center’ или ‘bottom’.

Placeholder через funсtions

// Placeholder если отсутствует миниатюра

add_filter( 'post_thumbnail_html', 'default_thumbnail' );

function default_thumbnail( $html ) {
 if ( '' !== $html )
 {
 return $html;
 }
 return '<img src="' . get_bloginfo( 'stylesheet_directory' ) . '/images/img-default.jpg" />'; 
}
Данная функция подставляет placeholder вне зависимости от того какой размер миниатюры запрашивается. Подходит, если на сайте изображения одного размера. Для нескольких видов миниатюр требуется доработать

Отключение стандартных миниатюр

function true_unset_image_sizes( $sizes) {
    unset( $sizes['thumbnail']); // миниатюра
    unset( $sizes['medium']); // средний
    unset( $sizes['large']); // большой
    return $sizes;
}
 
add_filter('intermediate_image_sizes_advanced', 'true_unset_image_sizes');

Либо есть альтернативный способ: прописать нули в настройках размеров миниатюр.

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

Отключить размер medium_large. Стандартным способом он не отключается.

//delete medium_large thumbnail size
update_option('medium_large_size_w', '0');
update_option('medium_large_size_h', '0');

Отключение произвольных миниатюр

Например тех, которые создаются плагинами или темами

function wpdocs_remove_plugin_image_sizes() {
	remove_image_size( '1536x1536' );
	remove_image_size( '2048x2048' );
	remove_image_size( 'woocommerce_thumbnail' );
	remove_image_size( 'shop_magnifier' );	
}
add_action('init', 'wpdocs_remove_plugin_image_sizes');

Показать все текущие размеры миниатюр

Данный код показывает только дополнительные произвольные размеры миниатюр (родные не учитывает).

<?php global $_wp_additional_image_sizes; 
print '<pre>'; 
print_r( $_wp_additional_image_sizes ); 
print '</pre>'; ?>

А вот эта функция выводит все миниатюры (в т.ч. стандартные) с размерами:

function get_image_sizes( $unset_disabled = true ) {
	$wais = & $GLOBALS['_wp_additional_image_sizes'];

	$sizes = array();

	foreach ( get_intermediate_image_sizes() as $_size ) {
		if ( in_array( $_size, array('thumbnail', 'medium', 'medium_large', 'large') ) ) {
			$sizes[ $_size ] = array(
				'width'  => get_option( "{$_size}_size_w" ),
				'height' => get_option( "{$_size}_size_h" ),
				'crop'   => (bool) get_option( "{$_size}_crop" ),
			);
		}
		elseif ( isset( $wais[$_size] ) ) {
			$sizes[ $_size ] = array(
				'width'  => $wais[ $_size ]['width'],
				'height' => $wais[ $_size ]['height'],
				'crop'   => $wais[ $_size ]['crop'],
			);
		}

		// size registered, but has 0 width and height
		if( $unset_disabled && ($sizes[ $_size ]['width'] == 0) && ($sizes[ $_size ]['height'] == 0) )
			unset( $sizes[ $_size ] );
	}

	return $sizes;
}

Вывод функции:

echo '<pre>';	
print_r( get_image_sizes() );	
echo '</pre>';

Обязательное включение миниатюры

Если нужно чтобы при публикации поста обязательно была указана миниатюра нужно использовать плагин Require Featured Image (7000). Кнопка Опубликовать перестает быть активной пока не выбрана миниатюра.

Поделиться в соц. сетях:

  • Похожие записи
  • Комментарии
  • Вложения
Атрибуты миниатюры

Атрибуты миниатюры

У миниатюры (thumbnail) есть служебная функция назначения атрибутов. Манипулируя атрибутами можно добиться интересных результатов. Фильтр wp_get_attachment_image_attributes распространяется на миниатюры, а также на вложенные изображения wp_get_attachment_image($image->ID, ‘rectangle’). Как сделать отложенную загрузку Читать далее »

Изображение для категории товаров

Изображение для категории товаров

В дизайнерских целях иногда требуется выводить изображение для категории товаров. Сделать это можно несколькими способами: плагином, кодом в functions, либо дополнительными полями.При этом кодом в funtions описанном мы будем использовать Читать далее »

/
Выравнивание миниатюр товаров

Выравнивание миниатюр товаров

Идеальная ситуация, когда мы загружаем изображения для товаров (хотя бы для главного изображения) квадратными. т.е. заранее подготовленными, откадрированными. Но бывают случаи, когда на сайт начинают заливаться изображения разных пропорций. Сделаем Читать далее »

/

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

Пока нет комментариев. Будь первым!

Миниатюры
Contact Form 7
Рекомендации для васContact Form 7Opttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.