télécharger une image et l'insérer directement dans CKEditor

Question

Je voudrais créer le même type de fonction que tumblr a pour télécharger des images, puis les insérer directement dans l'éditeur WYSIWYG.

Je prévoyais d'utiliser uploadify pour télécharger l'image, alors je ne suis pas sûr de la méthode d'insertion dans le CKEditor.

Quelqu'un at-il fait quelque chose de similaire ou connaissez-vous un plugin qui pourrait faire cela? Idéalement, je voudrais qu'il insère l'image partout où le curseur a été placé pour la dernière fois.

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

Merci à l'avance,

Tim

Answer 1

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

Answer 2

J'utilise le plugin agréable pour CKeditor http://www.ckuploader.com

Answer 3

correcte est:

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

Answer 4

J'utilise dropzone comme téléchargeur d'image. J'ai ajouté un bouton en dessous de chaque image de telle sorte que lorsqu'on clique dessus, une image est insérée à la position du curseur dans CKEditor. S'il vous plaît voir l'exemple ci-dessous:

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); 
    }; 
});