WordPress Image Resizer Plugin

October 15th, 2007

wordpress-image-resizer-plugin.png
A common problem for our clients is that they’d like to display images which have been optimized for web display (500px wide, jpg compression, nice and crisp) but want to offer the full-resolution images for download also. However not everyone wants to boot up Photoshop, Automator, or their photo editor of choice to create the thumbnails and web-sized images. Here’s a WordPress plugin incorporating James Heinrich’s phpThumb() thumbnailing script. It automates the process:

  • Simply upload a large (huge) version of the image, put them in normal <img src="" /> tags. WPIR parses them out and generates 400px wide versions (configurable) in a <div class="images"></div> at the top of the post. You can style this to float:right; or whatever.
  • It also generates a <div class="presskit"></div> at the bottom of the post with links to the high-res originals. These do a force-download instead of opening in the browser window.
  • Exempt images from resizing: <img class="custom" src="foo" />
  • Puts a nice, slight unsharp mask filter to crispify the images after that muddy bicubic resampling.

    There are more details and specifics in the INSTALL file. The plugin does not create any new databases and all the resized images are cached in the plugin folder. Using ImageMagick as described in the INSTALL file is highly recommended.

    I’d like to have a full WP interface to allow different widths to be configured, perhaps by what kind of page they’re in, what category, or even just a field in the WordPress sidebar to specify pixel width. But this is a good start… anyone want to pitch in?

    Download the plugin: wp-image-resizer-0-7.zip (v0.7)

    (Documentation: install.txt)

    All versions:


    wp-image-resizer-0-7.zip (v0.7)

    wp-image-resizer.zip (v0.6)



    Popularity: 20% [?]

25 Responses to “WordPress Image Resizer Plugin”

  1. John Ditrich Says:

    What is algorithm resizing using in your program?

  2. sebastian Says:

    whats about a demo?

  3. Jeffrey Warren Says:

    Missed these comments… ok here goes:

    Resizing is done by James Heinrich’s phpThumb() (http://phpthumb.sourceforge.net/) and uses ImageMagick if it’s installed, or plain PHP GD if not. ImageMagick is super-highly recommended. It’s a basic bicubic resize with a slight sharpen to counteract the bicubic blurriness.

    It’s used extensively on the site http://environmentalhealthclinic.net, run by artist and technologist Natalie Jeremijenko.

  4. houserocker Says:

    thanks so much for this great and easy to use tool!!!

  5. Zaman Says:

    hi,
    I use WordPress Image Resizer Plugin.That is the best plugin i have ever seen.But I need a help.Plugin works well in my blog but it does not seperate pictures from each other.I gave all pictures vspace=”5” however it doesnt separete them.
    Can you help me? How can i seperate pictures from each other?
    I will wait your answer.My page is http://www.baz.az, you may look in my posts and you will understand what i said.
    Thanks
    Have good time
    Zaman Hasanov

  6. dt Says:

    Finally a plug in for designers! Thanks and I will try it out!

  7. Marlo Says:

    For my particular installation of Wordpress I had to add the directory /Wordpress/ to the following lines in the resizer.php file:

    What was

    $imgTag = “”;

    Became

    $imgTag = “”;

    And what was

    $presskit = $presskit.”[+] ”.$filename.””;

    Became

    $presskit = $presskit.”[+] ”.$filename.””;

  8. Marlo Says:

    ok well obviously i don’t know how to comment code correctly since the comment i left above looks like nonsense, but point being my Wordpress wasn’t installed in the root directory, it was installed in http://www.mydomain.com/wordpress/ so i had to change two of the paths in the resizer.php file to make the plugin work. just a tip for other newbies like me.

  9. Marlo Says:

    is there any way to not show the links to the high res press images at the end? i can’t figure out which code to comment out.

  10. web design Says:

    is there an example of the plugin live on the web? does it allow me to use it on a page with a portfolio?

  11. WordPress Image Resizer_Wordpress plugin Says:

    [...] Plugin Homepage [...]

  12. Jeffrey Warren Says:

    Ooh sorry folks, didn’t catch all these comments. I’ll try to address them all:

  13. Jeffrey Warren Says:

    Zaman: If you give your img tags a style attribute that may help:

    <img style="margin-right:5px;margin-bottom:10px;" src="lalalala.png" />

    OR

    <img style="margin:10px;" src="lalalala.png" />

  14. Jeffrey Warren Says:

    Be careful everyone when copy/pasting Marlo’s code; you must turn the “” quotations he’s used into pure " characters when you do… unfortunately the commenting system in WordPress converts them to smart quotes.

  15. Jeffrey Warren Says:

    Marlo: Sorry, yeah, I hadn’t considered subdirectories. That would be a nice feature. As for the presskit, for an easy fix, you should be able to add this line somewhere on the page:


    <style>#presskit {display:none;}</style>

    And that should hide it. It still gets generated but it’s a minimal inefficiency and nobody can click it or see it.

  16. Jeffrey Warren Says:

    webdesign: It’s tough to put up an example since it’s on the admin side of the interface… but do check out http://environmentalhealthclinic.net, it uses the plugin extensively.

  17. Alexandr Z. Says:

    is it able not to put thumbnails into the beginning of the post & just leave them instead of images?

  18. bluesofa Says:

    This has been a hugely frustrating 4 hours for me.

    I’ve got an install in a directory /oakclass/ on the domain.

    There’s no indication about how to actually fix the paths that Marlo mentioned

    The style fix doesn’t work for removing the press images (added to css file and to index.php template)

    This plugin promises much, and I’d love to get it working!

  19. bluesofa Says:

    OK, I get it a bit more now – afront end in WP would be great – but thanks for this so far!

    I work with kids and want to get 10 year olds blogging. They upload HUGE images to out site though, and I’d like something that would have the option to either resize when they upload, or simply resize in the post, leaving the image in the place it was found.
    WP also seems to add class=”whatever” stuff. Could the classes wheren it takes effect be selected too?

  20. Paul Says:

    Hey Warren,
    I was hoping to use your plugin for hotlinked images – I seldom have the patience to upload files in WordPress. However I would love to have a local cache of the image.
    I’ve been using iMax Width until now, but that somehow stopped when I changed webhost…

    Could this plugin be enabled to work like described?

    – resizing hotlinked images
    – making lokal cache

    Cheers

  21. Jeffrey Warren Says:

    Hi, folks – I’m sorry, i just don’t check this thread very often. In the future if you run into serious urgent trouble, find my address at vestaldesign.com/contact and ping me.

    bluesofa, if you’re still having trouble, please contact me.

    Paul, for hotlinked images… that’s a neat idea… i think WordPress 2.6 can “grab” images from a remote site… which would make hotlinking unnecessary. The images would then be “subject to” the wp-image-resizer plugin, and would be resized etc. as usual.

  22. image upload Says:

    thanks so much for this great plugin you helped me.

  23. Zoya Says:

    Just come and let … Classroom art – thanks!

  24. Daniel Says:

    Hi, great plugin!

    one question: I’ve noticed it resizes the images in the feed, too. Is there a way to keep the feed from being processed by the plugin? Or the feed is generated from the real pages, already filtered?

    Thanks a lot!

  25. Liongress Says:

    Hi, I found cool flash photo galleries plugin for WordPress. Named GRAND Flash Album Gallery – multi category flash skin based photo gallery with powerful admin. I used it in my blog. There are so many different settings. You can adjust the color scheme for your blog as you wish. There are many different skins. You can present your photo gallery in a wonderful way, there is a full-screen mode. This is a very cool plugin.

Leave a Reply