cargar una imagen e insertarla directamente en CKEditor

Question

Me gustaría crear el mismo tipo de función que tumblr tiene para cargar imágenes y luego insertarlas directamente en el editor WYSIWYG.

Estaba planeando usar uploadify para cargar la imagen, entonces no estoy seguro del método para insertarlo en CKEditor.

¿Alguien ha hecho algo similar o sabe de un complemento que podría hacer esto? Idealmente, me gustaría que inserte la imagen donde sea que el cursor de texto se colocó por última vez.

Upload an image and directly insert it into a text area http://www.freeimagehosting.net/uploads/06217dcebb.png

Gracias de antemano,

Tim

Answer 1

CKEDITOR.instances['instanceName'].insertHtml('<img src="your image">'); 

Answer 2

estoy usando buen complemento para CKeditor http://www.ckuploader.com

Answer 3

correcta es:

CKEDITOR.instances['instanceName'].insertHtml('<img src="your image"/>'); 

Answer 4

Estoy usando dropzone como cargador de imágenes. He agregado un botón debajo de cada imagen para que cuando se haga clic en ella se inserte una imagen en la posición del cursor en CKEditor. Por favor, vea el ejemplo siguiente:

myDropzone.on("addedfile", function(file) { 
    // Hookup image insert button 
    file.previewElement.querySelector('.insert').onclick = function() { 
     var element = CKEDITOR.dom.element.createFromHtml('<img src="' + $SCRIPT_ROOT + '/api/files/' + file.id + '?filter=image"/>'); 
     CKEDITOR.instances.body.insertElement(element); 
    }; 
});