Есть способ масштабировать медиа (изображения) на 50 %?
Интересно, есть ли способ уменьшить количество загруженных носителей ровно до 50%.
Из того, что я вижу, с помощью add_image_size
вы можете указать только ширину и высоту в пикселях.
Идея состоит в том, чтобы загружать изображения с высоким разрешением для дисплеев Retina, а затем позволить Wordpress генерировать пользовательский размер изображения, уменьшенный для стандартных дисплеев.
Лучше всего было бы применить это как к исходному изображению, так и ко всем остальным созданным пользовательским миниатюрам.
Спасибо за помощь.
2 answers
Вы можете использовать фильтр image_downsize
и уловить, когда WordPress хочет уменьшенное изображение, а не оригинальное, и на самом деле размер, которого не существует.
add_filter( 'image_downsize', 'wpse_60890_retina_scale', 10, 3 );
function wpse_60890_retina_scale( $value, $id, $size ) {
if ( $size == 'wpse_60890_retina_scaled' ) {
if ( !is_array( $imagedata = wp_get_attachment_metadata( $id ) ) )
return false;
$img_url = wp_get_attachment_url( $id );
$img_url_basename = wp_basename( $img_url );
if ( isset( $imagedata['sizes']['wpse_60890_retina_scaled'] ) ) {
$intermediate = $imagedata['sizes']['wpse_60890_retina_scaled'];
$url = str_replace($img_url_basename, $intermediate['file'], $img_url);
return array( $url, $data['width'], $data['height'] );
}
$file = get_attached_file( $id );
$image = wp_load_image( $file );
if ( !is_resource( $image ) )
return new WP_Error( 'error_loading_image', $image, $file );
$size = @getimagesize( $file );
if ( !$size )
return new WP_Error( 'invalid_image', __('Could not read image size'), $file );
list( $orig_w, $orig_h, $orig_type ) = $size;
$max_w = round( $orig_w / 2 );
$max_h = round( $orig_h / 2 );
$resized = image_make_intermediate_size( $file, $max_w, $max_h );
$imagedata['sizes']['wpse_60890_retina_scaled'] = $resized;
wp_update_attachment_metadata( $id, $imagedata );
$url = str_replace($img_url_basename, $resized['file'], $img_url);
return array( $url, $resized['width'], $resized['height'] );
}
return $value;
}
Теперь вам нужно определить, где вам нужен полный размер или масштабирование на 50%.
Например, у вас есть
echo 'full size:' . wp_get_attachment_image( $attachment->ID, 'full' );
echo 'scaled by 50%: ' . wp_get_attachment_image( $attachment->ID, 'wpse_60890_retina_scaled' );
Я не мог использовать решение @nvartolomei таким, каким оно было. Он не был функциональным, но все же был хорошей отправной точкой.
Вот мое окончательное решение:
Я добавляю 3 новых image sizes
, удваивая исходные 3 размера.
- большая_ретина
- медиум_ретина
- миниатюра_ретины
Затем я ставлю фильтр, когда вы вызываете их на PHP, чтобы заменить with
и height
на их эквивалент без сетчатки (поскольку речь не всегда идет о делении на 2).
- оригинал: src=
image.jpg
ширина=4800
высота=4000
- большой (600x600): src=
image-600x500.jpg
ширина=600
высота=500
Large_retina(600x600): src=
image-1200x1000.jpg
ширина=600
высота=500
Оригинал: src=
image.jpg
ширина=900
высота=750
- большой (600x600): src=
image-600x500.jpg
ширина=600
высота=500
- large_retina(600x600): src=
image.jpg
ширина=600
высота=500
Function.php :
add_action( 'init', 'cjg_register_sizes' );
add_filter( 'image_downsize', 'cjg_retina_scale', 10, 3 );
function cjg_register_sizes(){
add_image_size( 'large_retina', get_option( 'large_size_w' ) * 2 , get_option( 'large_size_h' ) * 2 );
add_image_size( 'medium_retina', get_option( 'medium_size_w' ) * 2 , get_option( 'medium_size_h' ) * 2 );
add_image_size( 'thumbnail_retina', get_option( 'thumbnail_size_w' ) * 2 , get_option( 'thumbnail_size_h' ) * 2 );
}
function cjg_retina_scale( $value, $id, $size ) {
if ( $size == 'large_retina' OR $size == 'medium_retina' OR $size == 'thumbnail_retina' ) {
if ( !is_array( $imagedata = wp_get_attachment_metadata( $id ) ) )
return false;
if ( $size == 'large_retina') $regular_size = 'large';
elseif ( $size == 'medium_retina') $regular_size = 'medium';
else $regular_size = 'thumbnail';
$img_url = wp_get_attachment_url( $id );
$img_url_basename = wp_basename( $img_url );
if ( isset( $imagedata['sizes'][$regular_size] ) ) {
$width = $imagedata['sizes'][$regular_size]['width'];
$height = $imagedata['sizes'][$regular_size]['height'];
if ( isset( $imagedata['sizes'][$size] ) )
$url = str_replace($img_url_basename, $imagedata['sizes'][$size]['file'], $img_url);
else
$url = $img_url;
}else{
$url = $img_url;
$width = $imagedata['width'];
$height = $imagedata['height'];
}
return array( $url, $width, $height );
}
return $value;
}
Теперь вы можете просто называть свои изображения так
wp_get_attachment_image( $attachment->ID, 'thumbnail_retina' );
wp_get_attachment_image( $attachment->ID, 'medium_retina' );
wp_get_attachment_image( $attachment->ID, 'large_retina' );
Важно: после добавления 3 новых размеров я восстановил все миниатюры с помощью плагина регенерации-миниатюр