Front & Back Development

Tiny MCE ImageManager. Insert Uploaded Images Automatically

I am talking about:

Uploading and inserting images using ImageManager (TinyMCE plugin) in 3 clicks, instead of 4 and without search for your uploaded images inside the image file list. Images will be inserted in tinyMCE’s textarea automatically.

Ninja solution:

line 528: imagemanager-path/pages/im/js/imagemanager.js . Look for “onupload : function(){”

onupload : function(e) {
 if (e.files.length > 0 ){
  var s = t.currentWin.getArgs();selectedPaths=[];
  $(e.files).each(function(i, v) {
    selectedPaths.push(v.path); });
    relative_urls : s.relative_urls,
    document_base_url : s.document_base_url,
    default_base_url : s.default_base_url,
    no_host : s.remove_script_host || s.no_host,
    paths : selectedPaths,
    progress_message : $.translate("{#common.image_data}"),
    insert_filter : s.insert_filter,
    oninsert : function(o) {
      if (s.oninsert) {
        $(o.files).each(function(i, v) {
                t.focusedFile = v; o.focusedFile = v; s.oninsert(o);
  }); // end RPC.exec
} // end if
} // end onupload


Note: function(e){
Paste this code inside your onupload:function(){
That’s it.

Problems of this solution
– It’s not a plugin, so if you update your imagemanger, you will have to make this change again.
– If you don’t allow overwrite files, if you try to upload a file that is allready uploaded, this file won’t be uploaded neither inserted in tinymce’s textarea.
– Not tested on IE, just chrome,safari and firefox.

Two days ago, I would payed for this code. I Hope this will be usefull for you.

Beto López
"Full stack" web developer focused in maintenance and bug fixing.Wordpress, Prestashop, HTML, CSS, Javascript, Php and Mysql. Also open source collaborator. Linkedin y Twitter.

Leave your email and we'll contact you