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 seem to be having this issue with all of the images on my site.

First I optimise a .jpg in Photoshop to approx 100k (it's a large header image), then I upload through Wordpress' media uploader as a Featured Image. Here's the code I use to output the image in my template file:

<?php if (has_post_thumbnail( $post->ID )): ?>
            <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
            <img src="<?php bloginfo('template_directory'); ?>/thumbs.php?src=<?php echo $image[0]; ?>&w=660&h=246&zc=1" alt="<?php the_title(); ?>" />
        <?php endif; ?>

Problem:

When I view the image in the browser, it seems to have a file size of approx 900k. 9 times the size of the original file!

What is causing this increase in file size after uploading through Wordpress? Is it WP's media uploader or the timthumb.php script?

share|improve this question
    
I would avoid using the timthumb script at all costs. There is nothing it can do that the internal WordPress APIs cannot do already, especially where featured images are concerned –  Tom J Nowell Jan 8 '13 at 14:30

1 Answer 1

up vote 3 down vote accepted

Instead of using timthumb, use the internal image API.

Firstly, specify the custom size you're wanting to use by using add_image_size:

Usage:

<?php add_image_size( $name, $width, $height, $crop ); ?>

So you would put this in your themes functions.php:

add_image_size( 'large_post_image_header', 660,246,true);

Then, instead of:

<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
<img src="<?php bloginfo('template_directory'); ?>/thumbs.php?src=<?php echo $image[0]; ?>&w=660&h=246&zc=1" alt="<?php the_title(); ?>" />

You can specify instead this:

<?php
if ( has_post_thumbnail() ) {
    the_post_thumbnail( 'large_post_image_header' );
} else {
    // show a default image or something
}
?>

For posts that already have an existing featured image, you will need to regenerate the thumbnails and extra image sizes using a plugin ( only needs to be done once ) before the new image size will work properly.

You may even wish to install the WP-Thumb plugin to make the API even more powerful, letting you add image filters, control the cropping positions, rotate, it even has a timthumb style standalone usage too for theme files

http://hmn.md/introducing-wp-thumb/

Final step would be to take timthumb.php and burn it with the fire of a thousand suns. Afterwards pat yourself on the back, you're now using best practices and you've future proofed yourself against a whole myriad of potential security and maintenance issues ( and slimmed down your codebase too =p ).

share|improve this answer
1  
In addition to what that was detailed in this respond, you could have a look at my answer at a different question where I show how to lower the image filesize and everything related to that process: wordpress.stackexchange.com/questions/76781/… –  Christine Cooper Jan 8 '13 at 15:24

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.