Install file manager
NPM package
React
Vue
Angular
JS snippet
N1ED
TinyMCE
FAQ
Use with API
Integration sample
Manual toolbar sample
Integration sample (with API)
CKEditor 4
CKEditor 5
Froala
Drupal 10
Drupal 9
Drupal 8
Joomla 4
Joomla 3
Changelog
Server side
PHP Composer package
PHP include files
Cloud storage
Amazon S3
Azure Blob
Multiple users
API reference
Open file manager
Select image with a preview
Manage image gallery
Select multiple files
Browse a folder
Upload files
Open image editor
Custom image editing

Install file manager plugin for TinyMCE

1

Download

Get the file manager plugin for your TinyMCE 6 (v. 4 and 5 are also supported):

Download Flmngr plugin
2

Unpack

Unpack the archive with plugin into plugins/ directory this way:

tinymce/
  plugins/
     file-manager/
        plugin.js
        plugin.min.js
3

Enable

Find the place in HTML/JavaScript code where you load TinyMCE and enable the file manager add-on in initialization parameters:

tinymce.init({
    plugins: "image,link,file-manager",
    Flmngr: {
        apiKey: "FLMNFLMN", // Default free key
                            // Get free own API key to use wish a visual configurator:
                            //   https://flmngr.com/dashboard 
    }
    // Toolbar is configured automatically
});
4

Install the backend

Now you need to install PHP script somewhere on your server. Behind the link, there is a manual on how to do it and link the backend with Flmngr TinyMCE plugin.

✓

Ready to use

Customize

TinyMCE file manager control panel

We recommend you to register a free own API key to configure Flmngr visually using Dashboard. Or you can configure it by passing API parameters directly. There is also a short FAQ related to TinyMCE plugin.

Dashboard

Samples

There is a sample of TinyMCE with the file manager installation and using its API:

API

If you need to use Flmngr outside of TinyMCE on the same page, you can get its object and call from JavaScript to ask it to pick files, upload an image, etc.

Use from API