html - Is there a way to run JavaScript snippet after inserting an image in CKEditor? -


i have interesting situation hope can me with. have custom email campaign system set client coded using cold fusion (but isn't relevant) anyway, see in campaign design bit ckeditor every section (if decide want more 1 section.) here's problem, clients don't specify widths on images, , use images widths 5k+. have in email template:

    <style type="text/css">         img {             max-width: 100% !important;             height: auto !important;         }     </style> 

which works great... except gmail, 1 of popular email clients.

what dreamed up: somewhere in ckeditor, nice if after image inserted rich text editor, snippet executed:

document.getelementsbytagname("img")[0].setattribute("max-width", "800px"); document.getelementsbytagname("img")[0].setattribute("height", "auto"); 

or

img.style.maxwidth = "800px"; img.style.height = "auto"; 

is possible? or spinning wheels? time , patience!

you're proposing patch problem because image oversized , should scaled correctly before it's sent out, if want way can write output filter ckeditor.
along this: (untested)

var dataprocessor = editor.dataprocessor,     htmlfilter = dataprocessor && dataprocessor.htmlfilter;  // htmlfilter : conversion internal data html output. htmlfilter.addrules( {     elements :     {         'img' : function( element ) {              element.attributes.style = 'max-width: 800px; height: auto';              return element;         }     } }); 

obviously correct solution scale down image max: 800px when save on system or before it's uploaded.


Comments