Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I registered 3 custom image sizes (Double sized, for retina displays) with add_image_size: thumbnail@2x, medium@2x and large@2x.

function retina_image_sizes() {
    $retina_sizes = array(
        'thumbnail@2x' => array(
        'width' => get_option( 'thumbnail_size_w' ) * 2,
        'height' => get_option( 'thumbnail_size_h' ) * 2,
        'crop' => get_option('thumbnail_crop'),
        ),
        'medium@2x' => array(
        'width' => get_option( 'medium_size_w' ) * 2,
        'height' => get_option( 'medium_size_h' ) * 2,
        'crop' => false,
        ),
        'large@2x' => array(
            'width' => get_option( 'large_size_w' ) * 2,
            'height' => get_option( 'large_size_h' ) * 2,
            'crop' => false,
        )
    );

    foreach ( $retina_sizes as $name => $data ) {
        add_image_size( $name, $data['width'], $data['height'], $data['crop'] );
    }
}
add_action( 'init', 'retina_image_sizes');

Wordpress's naming convention is filename-width x height.jpg. But I need them to be named in another fashion ( filename-originalwidth x originalheight@2x.jpg)

If I upload a picture, and the thumbnail has a size of 100x100, for example, I want the images to be named:

example-100x100.jpg
and
example-100x100@2x.jpg

I found ways to process pictures and save them under another name, but that is too much. This question explains, how to change the filename, but, not how to include with and height information. I tried to get it to work, but I only get a single file instead of seven and it throws some errors (probably because it tries to overwrite the file).

How can I change the filename in the above described fashion? Is the add_attachment hook the right one?

share|improve this question
    
The link and code in the other question is quite good. But it's sadly not complete. There's the edit_attachment as well as the add_attachment hook which should get considered. When you already queried a file, you can simply use the native PHP function filesize() to extract the exact size. The rest can be done via a global or via the function get_intermediate_image_size(). Sadly it doesn't give you anything you want. I already proposed a change (incl. patch) some time ago on WordPress Trac. –  kaiser Jun 10 '13 at 13:24
    
filesize() returns the files size in byte. I'm talking about width and height. –  Lord_Mord Jun 11 '13 at 8:46
    
Ehm, yeah. Meant getimagesize(). –  kaiser Jun 11 '13 at 9:59

1 Answer 1

up vote 0 down vote accepted

I did it in a different way. I just had to update the code from Gerasimos Tsiamalos Retina Plugin to Wordpress 3.5., using image editor instead of image resize.

This is how it looks like:

function nothing_image_make_retina_size($file, $width, $height, $crop=false) {
    if ( $width || $height ) {
        $resized_file = wp_get_image_editor($file);
        if ( ! is_wp_error( $resized_file ) ) {
            $resized_file->resize( $width*2, $height*2, $crop );
            $filename = $resized_file->generate_filename( $width . 'x' . $height . '@2x'  );
            $resized_file->save($filename);
        }
        if ( !is_wp_error($resized_file) && $resized_file && $info = getimagesize($filename) ) {
            $filename = apply_filters('nothing_retina_image_make_intermediate_size', $filename);
            return array(
                'file' => wp_basename( $filename ),
                'width' => $info[0],
                'height' => $info[1],
            );
        }
    }
    return false;
}

function nothing_generate_retina_image_metadata( $metadata, $attachment_id ) {
    $attachment = get_post( $attachment_id );   
    $file = get_attached_file($attachment_id);
    $old_metadata = $metadata;
    foreach ($metadata as $k => $v) {
        if (is_array($v)) {
            foreach ($v as $key => $val) {
                if (is_array($val)) {
                    nothing_image_make_retina_size($file, $val['width'], $val['height'], true);
                } 
            } 
        } 
    }
    return $old_metadata;
}
add_filter('wp_generate_attachment_metadata', 'nothing_generate_retina_image_metadata', 10, 2);

function nothing_delete_retina_images( $attachment_id ) {
    $nothing_metas = wp_get_attachment_metadata( $attachment_id );
    $nothing_updir = wp_upload_dir();
    $nothing_path = pathinfo($nothing_metas['file']);
    $nothing_path_name = $nothing_path['dirname'];
    $nothing_updir = wp_upload_dir();
    foreach ($nothing_metas as $nothing_meta => $nothing_meta_val) {
        if ($nothing_meta === "sizes") {
            foreach ($nothing_meta_val as $nothing_sizes => $nothing_size) {
                $nothing_original_filename = $nothing_updir['basedir'] . "/" . $nothing_path_name . "/" . $nothing_size['file'];
                $nothing_x2_filename = substr_replace($nothing_original_filename, "@2x.", strrpos($nothing_original_filename, "."), strlen("."));
                if (file_exists($nothing_x2_filename)) {
                    unlink($nothing_x2_filename);
                }
            }           
        }       
    }
}
add_filter('delete_attachment','nothing_delete_retina_images');
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.