BronsonQuick edited this page Nov 24, 2014 · 12 revisions
Clone this wiki locally

Usage with WordPress

Using WP Thumb with WordPress is incredibly simple - just pass any of the arguments listed below as the $size parameter of any of core WordPress image functions.

Show the post thumbnail as a 100px by 100px image.

the_post_thumbnail( 'width=100&height=100&crop=1' );

Show an attachment at a custom size

wp_get_attachment_image_src( $id, 'width=560&height=200&crop=1' );

Usage in WordPress Themes

WP Thumb has some a UI for WordPress that can be activated using the add_theme_support functions.

To add the 'Crop From' UI add the following code in your after_theme_setup action:

add_theme_support( 'wpthumb-crop-from-position' );

To add the 'Apply Watermark' UI add the following code in your after_theme_setup action:

add_theme_support( 'wpthumb-watermarking' );

Direct Usage

wpthumb( $source_image, $args );

wpthumb( 'http://www.google.com/logo.png', 'width=100&height=100&crop=1' );


width: `int` - Width of the target canvas
height: `int` - Height of the target canvas
resize: `bool` (true) - Whether to resize the source image to the target canvas size
crop: `bool` (false) - Whether to crop the source image to the exact target canvas size
crop_from_position: `string` ("center, center") - The anchor point of the source image, used when cropping. [top, right, bottom, left, center] specified in the order `horizontal, vertical`
cache: `bool` (true) - Whether to use a previously cached version on the resized image (generally only disable when testing)
default: `string` - A fallback source image to be used if the source image is not found / unreachable. Useful for "Image Unavailable" image etc.
jpeg_quality: `int` (80) - Quality to be used for resizing JPG images
resize_animations: `bool` (true) - Whether to resize animated GIFs, resizing animations will only capture the first frame of the animation
return: `string`: ("url") - What form to return the cache image in. [url, path]
background_fill: `string` - Automatically fill excess space on the canvas with colours from the source image. 'crop' and 'resize' must be `true` to use this option. ["solid"] See Background Fill
watermarking_options: `array` - Options for an overlayed watermark image. You must pass $args as an array, as 'watermarking_options' must be specified using an array. See Watermarking Options


Create a 300px by 200px image, cropped from the top left, but still resizing until the smallest dimention hits the canvas edge.

wpthumb( 'photo.jpg', 'width=300&height=200&crop=1&crop_from_position=left,top' );

Specify a fallback image if the source image does not exist. As we pass a URL in the args, we use an array instead of a WordPress style string argument list. This is to avoid possible non escaped "&" or "=" charectors in the URL.

wpthumb( '404.png', array( 'width' => 400, 'default' => 'http://bit.ly/foo.jpg?foo=bar&1=1' );