Skip to content

uploadcare/uploadcare-redactor

Repository files navigation

File Uploader by Uploadcare

This is a plugin for Imperavi Redactor providing it to work with Uploadcare Widget.

GitHub release  Uploadcare stack on StackShare

Demo

Check out the basic demo for:

Requirements

Imperavi Redactor 2, 3 or X.

Install

Download the latest plugin archive from the release branch or releases page.

Extract the downloaded archive to the plugin directory of your Redactor installation.

Then, place the plugin in your page after embedding redactor.js:

<!-- redactor js -->
<script src="/your-folder/redactor.js"></script>

<!-- plugin js -->
<script src="/your-folder/plugins/uploadcare.redactor.min.js"></script>

Usage

Add uploadcare to the list of your Redactor plugins. Set your public key. Public keys are used to identify a target Uploadcare project your uploads will go to.

Redactor X

RedactorX('#editor', {
  plugins: ['uploadcare'],
  uploadcare: {
    buttonIconEnabled: true,
    publicKey: 'YOUR_PUBLIC_KEY',
  }
})

Redactor 3

$R('#editor', {
  plugins: ['uploadcare'],
  uploadcare: {
    buttonIconEnabled: true,
    publicKey: 'YOUR_PUBLIC_KEY',
  }
})

Redactor 2

$('#editor').redactor({
  plugins: ['uploadcare'],
  uploadcare: {
    buttonIconEnabled: true,
    publicKey: 'YOUR_PUBLIC_KEY',
  }
})

Configuration

Plugin configuration

To apply a custom configuration, initialize the plugin providing additional options:

UPLOADCARE_LOCALE = 'ru' /* set locale if you wish */

$R('#editor', {
  plugins: ['uploadcare'],
  callbacks: {
    uploadcareShow: function() { console.log.apply(undefined, arguments) },
    uploadcareDone: function() { console.log.apply(undefined, arguments) },
    uploadcareCancel: function() { console.log.apply(undefined, arguments) },
  },
  uploadcare: {
    /* set your public API key here */
    publicKey: 'demopublickey',
    /* set crop options when handling images */
    crop: 'free,1:1',
    /* show icon instead of "Uploadcare" */
    buttonIconEnabled: true,
    /* feel free to add more “object key” options here */
  }
})

Widget configuration

Uploadcare Widget can be deeply customized to suit your UX/UI. You can define allowed upload sources, implement file validation, and more.

Use our live widget sandbox as a starting point and consider checking out the docs on widget configuration and its JavaScript API.

Security issues

If you think you ran into something in Uploadcare libraries which might have security implications, please hit us up at [email protected] or Hackerone.

We'll contact you personally in a short time to fix an issue through co-op and prior to any public disclosure.

Feedback

Issues and PRs are welcome. You can provide your feedback or drop us a support request at [email protected].