Есть способ масштабировать медиа (изображения) на 50 %?


Интересно, есть ли способ уменьшить количество загруженных носителей ровно до 50%.

Из того, что я вижу, с помощью add_image_size вы можете указать только ширину и высоту в пикселях.

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

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

Спасибо за помощь.

Author: achairapart, 2012-08-05

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' );
 3
Author: nvartolomei, 2012-08-05 17:48:51

Я не мог использовать решение @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 новых размеров я восстановил все миниатюры с помощью плагина регенерации-миниатюр

 2
Author: Christian, 2013-02-28 22:07:50