Automatic Image resizer for WYSIWYG Editor output?

A common issue when building Content Management Systems for end-users using WYSIWYG Editors like CKEditor is that users can upload images within the editor, embed them, and then resize them.

After saving the content, the embedded (original) image URLs need to be replaced by their properly resized counterparts. Imagine a 3000 x 3000 photograph u开发者_StackOverflow中文版ploaded by a user, manually resized in the WYSIWYG editor to 300 x 300 Pixels - it needs to be resized automatically to prevent a huge source file from being loaded.

The task is pretty straightforward, and I've implemented it a number of times (albeit with regular expressions, which is why I'm looking for a replacement :) - walk through the DOM, search for images, see whether the size of the image source file differs from that specified in the img tag and if it does, replace the original image by an automatically resized one.

There are a few small quirks along the way (some WYWSIYG editors prefer to use width="300", others the width: 300px CSS version etc.).

My question is, is there a ready-made, high-quality PHP solution that does this well, and takes the quirks into account?

Try use this image resizer: http://shiftingpixel.com/2008/03/03/smart-image-resizer/

I've use this in my development, you can upload your image file and generate cache file based on whatever size or cropped portion for optimal performance without actually change your original image file.

example:

<img src="/image.php/coffee-bean.jpg?width=200&amp;height=200&amp;image=/wp-content/uploads/2008/03/coffee-bean.jpg" alt="Coffee Bean" />

you can download the image.php file at the site i mentioned above and pass the targetted image name as parameters into the image.php file and then it will generate cache file for it, please make sure your image folder permission is ready for execution and alteration.

as for me: i use tinymce editor with installed plugin ImageManager. so there at config php you can configure size of output thumbnail images. and if uploaded image bigger than that size you will see small thumb (css style for resized one you can configure too so you are able to use some jquery plugins to show big image. like thickbox)