File Uploader
CKEditor add-on
TinyMCE add-on
Purchase logo
Buy in bundle

Install File Uploader plugin to CKEditor

Installation process for CKEditor is typical. Follow the below steps, and install is complete.
If you use the PHP loader, you most likely won't need any actions to configure the server part. For a specific configuration or if you use another version of the server loader, please refer to steps to install on a server.

  1. Unpack archived files directly to ckeditor/plugins.
  2. Turn on the plugin in ckeditor/config.js:
    config.extraPlugins = 'jsplusFileUploader';
  3. Add these buttons to the toolbar definition:
    • jsplusUpload
      Opened File Uploader dialog
    • jsplusUploadUrl
      Uploading file by URL
    • jsplusUploadImage
      Uploading images using the File Uploader dialog and inserting their originals
    • jsplusUploadPreview
      Uploading images using the File Uploader dialog and inserting their thumbnails with links
    • jsplusUploadFile
      Uploading files using the File Uploader dialog and inserting links to them
    • jsplusFastUploadImage
      Quick uploading of images and inserting their originals
    • jsplusFastUploadPreview
      Quick uploading of images and inserting their thumbnails
    • jsplusFastUploadFile
      Quick uploading of files and inserting links to them
    See sample CKEditor toolbar configuration to find out more about this step.
  4. Now you can use your installed plugins. Do not forget to sure that browser cache was cleared.

Configuration

Optionally, you can configure the plugin for your needs. A number of parameters are available for that. Parameters are a key-value structure that's passed along with the main config of CKEditor.

You can specify this parameters in standard CKEditor configuration file ckeditor.js:


  config.jsplusFileUploader = {
    key1: "value1",
    key2: true
  };
        

If you do not use config.js or prefer not to change it, you can pass these parameters as the second argument of function CKEDITOR.replace which you use for CKEditor initialization. For example:


  CKEDITOR.replace("textAreaId", {jsplusFileUploader: {key: "value"}});
        

For Drupal 8 users we recommend to configure all parameters via control panel if CMS (all options of the plugins are located on configuration page of CKEditor).

Explore the list of available options to see what settings are available to you.