File Upload

is an open source library that provides drag'n'drop file uploads with image previews.

Please refer to to learn about plugin options

Step one

Include the stylesheet dropzone.css inside the <head> if it's not there already.

<link type="text/css" rel="stylesheet" href="assets/plugins/dropzone/css/dropzone.css">

Step two

Include the javascript file inside the <body>before core template script inclusions, if it's not there already.

<script src="assets/plugins/dropzone/dropzone.min.js" type="text/javascript"></script>

Step three

Add .dropzone to initialize dropzone plugin with default options.

<form action="/file-upload" class="dropzone">
    <div class="fallback">
        <input name="file" type="file" multiple />
    </div>
</form>

Last updated 6 years ago