Getting Started

Migration to Filepicker v2

Filepicker Architecture

File Upload

File Export (Save To)

Responsive Images

Image Transformations

Document Transformations

Video Transformations




Filepicker Integrations


Filepicker Viewer


Supported Cloud Drives

Filepicker Recipes

Filepicker SDKs (new)

Knowledge Base

Register for an API key

Getting started with Filepicker

With Filepicker, your website suddenly got a whole lot more powerful - import content from Dropbox, save a photo back to Facebook, all without having to deal with OAuth or server-side APIs.

If you have an existing S3 bucket whose contents you would like to connect with Filepicker, take a look at our S3 Import Tool.


First things first, you need to Register for an API key

To integrate Filepicker files into your site, the first thing to do is include the library. Copy and paste this script into your page just before the </body> tag.

Javascript Library
<script type="text/javascript"

Filepicker client library is also available as a bower dependency via:

$ bower install filepicker-js

And npm registry :

$ npm install filepicker-js --save

For advanced users, if you want to load the javascript in a non-blocking fashion, you can use this instead:

<script type="text/javascript">
(function(a){if(window.filepicker){return}var b=a.createElement("script");b.type="text/javascript";b.async=!0;b.src=("https:"===a.location.protocol?"https:":"http:")+"//";var c=a.getElementsByTagName("script")[0];c.parentNode.insertBefore(b,c);var d={};d._queue=[];var e="pick,pickMultiple,pickAndStore,read,write,writeUrl,export,convert,store,storeUrl,remove,stat,setKey,constructWidget,makeDropPane".split(",");var f=function(a,b){return function(){b.push([a,arguments])}};for(var g=0;g<e.length;g++){d[e[g]]=f(e[g],d._queue)}window.filepicker=d})(document);