In order to handle the fact that users may upload some very big images I would like to use phpthumb to resize images on the fly based on the width and height provided in the image popup. So for example a user may upload a photo that is 1024x768 pixels and 1mb in file size. Now if they change the width and height to something smaller people viewing the article with the image in are still downloading the 1mb file. What I would like to do is change the image code inserted from, for example:
<img src="/images/news/wilmslow-dark.jpg" width="205" height="60" alt="description" />
to
<img src="/phpthumb/phpThumb.php?src=/images/news/wilmslow-dark.jpg&w=205&h=60" width="205" height="60" alt="description" />
basically changing the image src by preceeding it with "/phpthumb/phpThumb.php?src=" and adding in the width and height into that src url based on the width and height inputted into the popup.
How can I do this?
<img src="/images/news/wilmslow-dark.jpg" width="205" height="60" alt="description" />
to
<img src="/phpthumb/phpThumb.php?src=/images/news/wilmslow-dark.jpg&w=205&h=60" width="205" height="60" alt="description" />
basically changing the image src by preceeding it with "/phpthumb/phpThumb.php?src=" and adding in the width and height into that src url based on the width and height inputted into the popup.
How can I do this?
Re: Change code inserted for image
How can I define that the width and height attributes of an image tag should be appended as query variables instead of tag attributes?
Re: Change code inserted for image
However, the width and height variables contain the image's original size, not the custom size set in the popup window.
What would be the syntax to retrieve the custom size?
Re: Change code inserted for image
In CKFinder these variable are easily changed with the following code:
http://docs.cksource.com/CKFinder_2.x/D ... ion/Images
Customer and Community Manager, CKSource
Follow us on: Facebook, Twitter, LinkedIn
If you think you found a bug in CKEditor, read this!
Re: Change code inserted for image
Re: Change code inserted for image
Here's a solution (finally):
Add the following to your config.js:
This code is run whenever the CKEditor generates the actual HTML, which happens when you either view the source by clicking the "Source" button, or by performing an HTTP POST of that page.
A small warning, though. The code above will keep appending the width and height query strings for each click on the "Source" button, or for each postback, so you might want to add some extra logic to filter out the width and height query strings before appending them to the src attribute.