Uploader Options

All Uploader options are set via a data-attribute on the hidden input tag.

For example, to create a square Uploader with width="300", height="300", that accepts only image files, the hidden input would look something like this:

< input class="simple-file-upload" data-width="300" data-height="300" data-accepted="image/*" type="hidden" name="user[avatar_url]" id="user_avatar_url" />

Single Uploader
Data-Attribute Function Accepted Values Documentation
data-width Sets the width of the uploader on your page String Customize
data-height Sets the height of the uploader on your page String Customize
data-resize-width Cropped width of image before upload String Resize
data-resize-height Cropped height of image before upload String Resize
data-resize-method How the image is resized "contain" or "crop" (defaults to contain) Resize
data-maxFileSize The maximum file size the user can upload String (in mB) File Acceptance
data-accepted The type of files the user can upload String File Acceptance
data-tag A tag to organize files String (case sensitive) Tagging Files
data-preview Whether or not to show a preview image after upload "true" or "false" (defaults to true) File Previews
Multiple File Uploader

If data-multiple="true", a button will replace the hidden input and the uploader will open in a modal. All of the below attributes apply to this configuration.

Data-Attribute Function Accepted Values Documentation
data-multiple Allows for multiple file uploading "true" or "false" Multiple File Uploading
data-maxFileSize The maximum file size the user can upload String (in mB) File Acceptance
data-accepted The type of files the user can upload String File Acceptance
data-tag A tag to organize files String (case sensitive) Tagging Files
data-button-text Change the button text String (defaults to "Add Files") Multiple File Uploading
data-max-files Maximum number of files that can be uploaded Integer or String value (defaults to 20) Multiple File Uploading
data-remove-links Whether or not to include remove links on files "true" or "false" Multiple File Uploading