Изменение изображений в WordPress: наложение фильтров

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

Во-первых, мы должны задать непосредственно размер изображения:

add_action('after_setup_theme','themename_bw_size');
function themename_bw_size() {
	add_image_size('themename-bw-image', 100, 100, true);
}

Эта простая функция подцепляется к хуку after_setup_theme, который загружается уже после окончательного представления файла functions.php. Функция вызывает add_image_size для добавления нового размера изображений к загрузчику; этот размер будет создаваться для каждого изображения, загруженного в библиотеку медиафайлов WordPress. Размер определен как 100х100 с жесткой обрезкой.

Теперь мы должны сделать изображение черно-белым. Для этого мы воспользуемся фильтром wp_generate_attachment_metadata. Этот фильтр будет вызван после того, как изображения были изменены и сохранены, однако до того, как метаданные, связанные с этими изображениями, были добавлены к записи. На самом деле мы не используем фильтр в роли традиционного «фильтра», но, поскольку мы нуждаемся в некоторых метаданных, он нам отлично подойдет; главное — помнить о том, что нам нужно будет эти метаданные возвратить.

add_filter('wp_generate_attachment_metadata','themename_bw_filter');
function themename_bw_filter($meta) {
	$file = wp_upload_dir();
	$file = trailingslashit($file['path']).$meta['sizes']['themename-bw-image']['file'];
	list($orig_w, $orig_h, $orig_type) = @getimagesize($file);
	$image = wp_load_image($file);
	imagefilter($image, IMG_FILTER_GRAYSCALE);
	switch ($orig_type) {
		case IMAGETYPE_GIF:
			imagegif( $image, $file );
			break;
		case IMAGETYPE_PNG:
			imagepng( $image, $file );
			break;
		case IMAGETYPE_JPEG:
			imagejpeg( $image, $file );
			break;
	}
	return $meta;
}    

Давайте пробежимся по приведенному выше фрагменту более подробно.

$file = wp_upload_dir();
$file = trailingslashit($file['path']).$meta['sizes']['themename-bw-image']['file'];

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

list($orig_w, $orig_h, $orig_type) = @getimagesize($file);

Эта строка кода просто помещает размер изображения и тип в некоторые переменные. Тип нам понадобится позже.

$image = wp_load_image($file);

Функция wp_load_image очень удобна: она позволяет загрузить изображение из заданной строки.

imagefilter($image, IMG_FILTER_GRAYSCALE);

Применяем grayscale фильтр к изображению, чтобы сделать его черно-белым.

switch ($orig_type) {
	case IMAGETYPE_GIF:
		imagegif( $image, $file );
		break;
	case IMAGETYPE_PNG:
		imagepng( $image, $file );
		break;
	case IMAGETYPE_JPEG:
		imagejpeg( $image, $file );
		break;
}

Наконец, мы сохраняем изображение в тот же самый файл, заменяя его цвета черно-белыми оттенками.

return $meta;

Поскольку мы использовали фильтр, нам необходимо вернуть метаданные. Мы оставили их без изменений.

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

http://otto42.com/ag

Блог про WordPress
Комментарии: 6
  1. Ильхам

    Очень полезный пост! Только прошу пояснить. Этот код вносить в файл function.php используемого шаблона? Или в какой-то другой файл?

    Спасибо!

    1. Дмитрий (автор)

      Этот код вносить в файл function.php используемого шаблона?

      Да, в файл functions.php используемой темы.

  2. Ильхам

    Я внес данный код в файл function.php, а где должны произойти изменения?

    У меня ничего не изменилось. Может какие-нибудь скриншоты выложите?

  3. Дмитрий (автор)

    Вот здесь посмотрите: http://hanswestman.se/2011/07/some-image-filters-

    Тут более подробно, с примерами.

  4. Ильхам

    Прошу прощения, я все равно ничего не понял. Что нужно сделать после внесения этого кода в файл function.php?

  5. Дмитрий (автор)

    Если вы все сделали верно, то у вас должен появиться новый размер для изображений (100×100) в теме. Попробуйте загрузить какую-нибудь картинку и посмотрите, появился ли новый размер для нее (там же, где и миниатюра, средний и крупный размеры).

Добавить комментарий для Architect Of Ruin Отменить ответ

Получать новые комментарии по электронной почте.