2010-04-08 58 views
4

使用WYSIWYG編輯器如CKEditor爲最終用戶構建內容管理系統時的一個常見問題是,用戶可以在編輯器中上傳圖像,嵌入它們,然後調整它們的大小。WYSIWYG Editor輸出的自動圖像調整大小?

保存內容後,嵌入的(原始)圖像URL需要被其正確調整大小的對應項替換。想象一下用戶上傳的3000 x 3000張照片,在所見即所得編輯器中手動調整大小爲300 x 300像素 - 它需要自動調整大小以防止巨大的源文件被加載。

該任務是非常簡單的,我已經實現了很多次(雖然使用正則表達式,這就是爲什麼我正在尋找一個替代品:) - 瀏覽DOM,搜索圖像,查看是否圖像源文件的大小與img標記中指定的大小不同,如果是,則用自動調整大小的文件替換原始圖像。

一路上有幾個小怪癖(一些WYWSIYG編輯喜歡使用width="300",其他的width: 300px CSS版本等)。

我的問題是,是否有現成的高質量PHP解決方案能很好地完成這項工作,並考慮到這些怪癖?

回答

2

嘗試使用此圖像resizer: http://shiftingpixel.com/2008/03/03/smart-image-resizer/

我已經在我的開發中使用了這個功能,您可以上傳您的圖片文件並根據任何大小或剪裁部分生成緩存文件以獲得最佳性能,而無需實際更改原始圖片文件。

例如:

<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" /> 

你可以下載我上面提到的網站image.php文件並通過針對性的映像名稱參數到image.php文件,然後它會爲它生成緩存文件,請確保您的圖像文件夾權限已準備好執行和更改。

0

至於我:我使用tinymce編輯器與安裝插件ImageManager。所以在配置php你可以配置輸出縮略圖的大小。如果上傳的圖片大於這個尺寸,你會看到小拇指(CSS樣式的調整大小的一個,你可以配置太多,所以你可以使用一些jquery插件來顯示大圖像像厚盒子)