Generate fixed image sizes for different pages, eliminate sizes during upload

Users shouldn’t have to know anything about image sizes. Just have them upload as-large-as-needed images and your job is to get WordPress to do the rest.

When a user uploads an image, WordPress will generate as many images as you’ve declared with add_image_size().

An example from the codex for your functions.php file:

if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'category-thumb', 300, 9999 ); //300 pixels wide (and unlimited height)
    add_image_size( 'homepage-thumb', 220, 180, true ); //(cropped)
}

On the templating side, there a few different ways to get those image sizes out. the_post_thumbnail() is probably the most common.

the_post_thumbnail('category-thumb');
// or
the_post_thumbnail('homepage-thumb');

would get both image sizes we set up a second ago.

You’ll notice after reading the codex that some sizes are cropped. If you upload 1000×500 image and ask add_image_size to create a square image, something has to go. WordPress will do this from the center by default but you can also allow users to create these themselves for better art direction. http://wordpress.org/plugins/post-thumbnail-editor/ is an example plugin, there are a few more. http://codecanyon.net/item/theia-smart-thumbnails/3160252 also looks really interesting. Instead of setting the crops for each, the user clicks on the ‘interesting’ part of the photo and the plugin (supposedly) generates all crops so that the focal point remains in the image.

Edit:
Some other options for on-the-fly image resizing. Note, I haven’t tried any of these:
https://github.com/syamilmj/Aqua-Resizer
https://gist.github.com/seedprod/1367237
http://wordpress.org/plugins/image-resizer-on-the-fly/

Leave a Comment