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.

The main problem here is about too large file size of image not image re-sizing

My wordpress website is like a web gallery which contains many images.

Initially, I just uploaded hundreds of images via wordpress media uploader without caring of its file size at all.

However, when i browse my website, it's too slow to load the homepage because the image file size is too large.

Since i don't want to modify images which are already uploaded, is it possible to create a filter or plugin to reduce image filesize (no dimension changes)or reduce its quality on the fly to make the website load faster?

P.S. Anyways, my last resort is to use photoshop to modify images and reduce its quality in order to reduce its file size.

Any suggestions?

share|improve this question
add comment

2 Answers 2

up vote 0 down vote accepted

It is possible to re-size images on the fly if you are comfortable programming in PHP. Judging from your question, I expect that your not there yet. If that is the case, you should check out the Regenerate Thumbnails plugin. With this plugin, you can change the images sizes you want in the media settings page and then re-size your images all at once, in groups or one at a time.

If you are comfortable programing, you need to check out the WP_Image_Editor class. There are several tutorials on the web that will help you get started.

Update: You say you are comfortable coding so here it goes. You will need a function that will grab the image, adjust the quality and stream it to the browser. I do something similar in a plugin I am working on.

You will need to create a new slug (in my case it was http://my.domain.com/thumbnail). Each image you want to adjust the quality on will use the url http://my.domain.com/thumbnail?imageurl=myimage.jpg. in functions.php you need to hook it with add_action( 'parse_request', 'yourfunction' );. Then:

function yourfunction ( $wp ) {
    if ( 'thumbnail' == $wp->query_vars['pagename'] ){
        $imagefilename = $_REQUEST['url']; // change to real path left to you
        $image = wp_get_image_editor( $imagefilename );
        $image->set_quality( $jpg_comp_level );
        $image->stream();
    }
}

Hope this helps

share|improve this answer
    
Hi, Chris. Thanks for your quick response. Actually, I'm a programer and can do php programing if it helps solve the issue. Anyway, I think you misunderstand my question. My problem is about image 'filesize' not 'Re-sizing' image. I'm looking at the method imagejpeg($im, NULL, 75); which may help me reduce image quality (hope it will load faster for users) but i haven't got clear idea for now. Any help? –  Atthapon Junpun-eak Mar 4 '13 at 7:15
    
Moreover, I don't want to touch the existing images by modifying them. My rough idea is when users browse my website, i will send the image with lower quality (compressed on demand) instead of sending them the actual image. –  Atthapon Junpun-eak Mar 4 '13 at 7:24
    
Thanks for your solutions, Chris and zac. ^_^ Both are good solutions to me! I'm deciding which one is the most suitable for me. I'll come back later on. –  Atthapon Junpun-eak Mar 4 '13 at 9:28
    
One thing to note here. I have done no verifying for security. A nonce and checking will need to be added to secure this solution. Best of luck. –  Chris Strutton Mar 4 '13 at 10:01
    
I decide to choose timthumb. Also I will take a close look at its security. Thanks –  Atthapon Junpun-eak Mar 4 '13 at 11:17
add comment

One idea is to use TimThumb to regenerate everything on the fly for you. This was a solution I used for my own photo site. You can control the size of the images and many other options by setting the parameters. For example where your images are output you could edit it to something like this :

<img src="<?php bloginfo('template_url'); ?>/scripts/timthumb.php?src=<?php echo get_post_meta($post->ID, 'my_post_type', true); ?>&w=60&h=60&zc=1" alt="<?php the_title(); ?>" />

This should accomplish what you need of faster loading as well as being able to serve different quality images without touching the originals.

I recently learned that there is some vulnerability with this script so if you go this route you may want to check out this plugin.

http://wordpress.org/extend/plugins/timthumb-vulnerability-scanner/

share|improve this answer
add comment

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.