Days
Hours
Minutes
Seconds
x

New Froala Editor v4.4 is here – Learn More

Skip to content

Filestack Plugin

Empower users to utilize Filestack's robust features in their editing experience, ensuring a faster, more reliable file upload process along with advanced image and file transformation capabilities.


Plugin options:

filestackOptions.filestackAPI
String - Default: ""
Your Filestack API key. To get your Filestack API, create a free Filestack account.
filestackOptions.uploadToFilestackOnly
Boolean - Default: false
Toggle between Basic and Filestack-only modes. When enabled, images, videos, and files can be uploaded exclusively through Filestack.
filestackOptions.pickerOptions
Object - Default: {}
Configuration options for the Filestack File Picker. See available options in the Filestack documentation.

Plugin events:

filestack.uploadedToFilestack (response)
Triggered after successful file upload to the Filestack server.
filestack.uploadFailedToFilestack (response) Triggered after the file upload to the Filestack server fails.
filestack.filestackPickerOpened (response) Triggered when Filestack Picker is opened.
filestack.filestackPickerClosed (response) Triggered when Filestack Picker is closed.

Add Plugin to your code:

Plugin name: filestack

Plugin JS Script: ../js/plugins/filestack.min.js

Or from CDN https://cdn.jsdelivr.net/npm/froala-editor@latest/js/plugins/filestack.min.js


Dependence :

To ensure the plugin works properly, include the following Filestack File Picker and Transformation UI scripts and stylesheets in your web application:

  <script src="https://static.filestackapi.com/filestack-js/3.x.x/filestack.min.js"></script>
  <script src="https://static.filestackapi.com/filestack-drag-and-drop-js/1.1.1/filestack-drag-and-drop.min.js"></script>
  <script src="https://static.filestackapi.com/transforms-ui/2.x.x/transforms.umd.min.js"></script>
  <link rel="stylesheet" href="https://static.filestackapi.com/transforms-ui/2.x.x/transforms.css" />

Example :

Try the Filestack plugin here.