Simple File Upload

Page Header

Customizing the widget

You can change almost everything about the widget's appearance. You can change the icon, the text color, the border color, and the background color.

File Previews

You can change whether or not the widget shows the file preview after the file is dropped. This is enabled by default. To disable this set preview: false on the input tag:

Javascript Snippet
 <input class="simple-file-upload" data-preview="false" type="hidden"
name="user[avatar_url]" id="user_avatar_url">
React
<SimpleFileUpload
    apiKey="YOURAPIKEY"
    preview="false"
    onSuccess={setFile}
/>
Size

You can change the size of the widget using the width and height parameter.

Javascript Snippet
<input class="simple-file-upload" data-width="50" data-height="50"
type="hidden" value="" name="user[avatar_url]" id="user_avatar_url">
React
  <SimpleFileUpload
    apiKey="YOURAPIKEY"
    width="300"
    height="300"
    onSuccess={setFile}
  >