One of the most useful features WordPress has is the ability to create custom image sizes from uploads. This takes the guesswork out of design, as it allows me to specify exactly the dimensions I need for my image. For a long time, WordPress had the ability to switch between a “soft crop”, which basically resizes the images without any actual editing, and “hard crop”, which physically cut photos down to the size you requested. Turns out, WordPress 3.0+ got rid of the hard crop, which allowed me to set the specific sizes, instead of just specifying a width and hoping for the best.
WPThumb brings it back to the way it was. Installing WPThumb will allow you utilize their built-in cropping library to get pixel-perfect thumbnail sizes.
WPThumb Instructions
Download and activate the plugin, either through your own site or from the WPThumb plugin page. There’s no settings to mess with; once WPThumb is installed, it’s activated.
Now, set a custom image size (this code goes in your functions.php file)…
add_image_size( 'homepage-thumb', 220, 180, true ); // 220 pixels wide by 180 pixels tall, hard crop mode
…and then call the image as needed (in your template – make sure it’s in the loop!)…
<?php the_post_thumbnail( 'homepage-thumb' ); ?>
And that’s all there is to it. WPThumb will start hard-cropping images automatically.
How does the cropping work?
Say you have an image that’s 600px by 400px. You set a crop size of 200 px by 200px. WordPress will:
- Shrink the image down proportionately to 300px by 200px (to the smallest size)
- Remove an even amount of pixels from the largest size to resize it. Since there’s 100px of extra image to get rid of, 50px will be removed from both the left and right sides.
More info:
http://codex.wordpress.org/Function_Reference/add_image_size
http://codex.wordpress.org/Function_Reference/the_post_thumbnail