Using Timthumb to Resize Images from CKEditor

Question

I am using CKEditor to do basic text and image input into my website. I have noticed that it is quite sporadic in it's method of generating HTML for images when you add them. (Sometimes it might use height and width tags, other times it might use CSS).

I use Timthumb for on the fly image resizing on a number of other websites and find it very useful. I use a mod_rewrite rule in my .htaccess file to allow me to create domains like http://localhost/images/800x600/image.jpg and achieve resizing.

I would like to somehow incorporate this into CKEditor. I cannot find how to do this looking through the documentation so I have tried post-processing the data produced by CKEditor using Regex, however as mentioned before CKEditor seems to be too sporadic to be able to get this to work all the time.

Anyone else done this before? How did you achieve it?

Answer 1

I've done this in Grails. It's quite painful because of the random usage of html attributes and css. I ended up using an html parser, iterating over the images (dom nodes) and resizing those who has been resized. After that the html attributes and/or css styles has to be updated. It took quite some time to get it right as there are so many things that can go wrong.