After switching my blog to Wordpress I needed a simple solution which allowed me to flexibly post images in different sizes without having to hassle with different filenames, paths etc.
The plugin is actually just a port of a plugin/snippet I wrote for MODx a while ago (see here). It scans your content’s source code for <img> tags with width and height attributes and passes them to phpThumb, a great PHP image editing library, which handles the resizing and editing of the image. Additionally, by passing parameters to phpThumb using a query string, it’s possible to edit the image in several ways (take a look at phpThumb’s demos).
The simplest way to get resized images is to specify width/height attibutes in your HTML. Autothumb will use the given values and remove the attributes from your page’s output. When you take a look at the URLs of the following example images, you will see that the <img>-tag’s src-attribute points to a file called image.php in the plugin’s directory. This file takes the image source and several other parameters and passes them to phpThumb, which will generate and output the final image (of course images will be cached).
To prevent evil people playing with the query string and letting your server generate tons of different images, the plugin generates a hash which is a combination of the query string and a secret password you set in phpThumb’s config file. So every call with different parameters (even the same image with different sizes) has another unique hash and it’s not possible to generate new images without knowing the secret password.
Basic Examples
As an example, I will take this photo I found on Flickr:
![]()
<img src="http://example.com/path/to/image.jpg" alt="" width="600" />
Of course, this also works with the height attribute or with both attributes combined.
![]()
<img src="http://example.com/path/to/image.jpg" alt="" height="200" />
![]()
<img src="http://example.com/path/to/image.jpg" alt="" width="150" height="200" />
Advanced examples
You can use all phpThumb functions and filters (see phpThumb demo page and readme) depending on your server’s configuration (GD version, ImageMagick, …) by passing them as query string:
http://example.com/path/to/image.jpg?param1=value1¶m2=value2&. . .
The only difference to the demo page: when using filters, make sure that you use curly brackets {} instead of square ones []. Multiple filters like ?fltr{}=sep&fltr{}=blur|5 do not work with this release, but I will see to update it as soon as possible.. With version 0.2 multiple filters are working as shown on phpThumb’s demo page. No need to use curly brackets (altough they still work) anymore.
Crop / Zoom Crop
![]()
<img src="http://example.com/path/to/image.jpg?zc=1" alt="" width="400" height="150" />
![]()
<img src="http://example.com/path/to/image.jpg?zc=1" alt="" width="120" height="120" />
Blur filter
![]()
<img src="http://example.com/path/to/image.jpg?fltr[]=blur|2" alt="" width="400" />
Sepia
![]()
<img src="http://example.com/path/to/image.jpg?fltr[]=sep" alt="" width="400" />
Combined Filters (new in 0.2)
![]()
<img src="http://example.com/path/to/image.jpg?fltr[]=lvl|*|2&fltr[]=hist|rgb||||BR|100&fltr[]=hist|*||||BL|100" alt="" width="400" />
For more examples just visit the phpThumb page linked above.
Usage in templates
As the plugin operates only on the_content, you have to call the function manually if you want to use it in your templates. Syntax is the following:
string getphpthumburl( string $imageUrl, string $phpThumbParams )
An example:
<img src="<?php echo getphpthumburl('/wp-content/uploads/image.jpg', 'h=90&w=90&zc=1'); ?>" alt="my resized image" />
Installation
- Download the .zip file and extract it.
- Upload the plugin to your /wp-content/plugins/ directory and make sure your web server has write access to the cache folder and the config file.
- Activate the plugin.
- Go to Settings - Autothumb and set a password for PHPThumb. This is important to prevent abuse of the script.
- Have fun!
Upgrading
Just delete the old plugin directory, upload the new one and reactivate the plugin.
Changelog
0.1
- first release
0.2
- added possibilty to use multiple filters
- updated to phpThumb version 1.7.9 (beta)
- some minor bugfixes
0.3
- added option panel for PHPThumb’s high security password (thanks to Ben)
Download
Please keep in mind that this is the first second version of the plugin and that it’s not thorougly tested. However, as I wrote at the beginning of this article, I’m using it without any problems since I switched my blog to Wordpress.
You can grab the latest version of the plugin from the wordpress repository.
Pingback
03.12.2008 09:00
Scattered » Blog Archive » Twitter Updates for 2008-12-02
[...] works, it’s going to help us a ton. I was using phpThumb but this plugin takes it further, http://maff.ailoo.net/projects/autothumb/ [...]