When to use
CKEditor 5 is the most innovative WYSIWYG editor for your websites, so the Flmngr file manager definitely supports it.
The CKEditor 5 file manager plugin is available for easy implementation, and we also provide a ready-to-run CKEditor 5 build for those who want to avoid the CKEditor 5 build process.
The file manager seamlessly integrates into CKEditor 5 and adds its button to the toolbar. Inserted images are then managed with the standard CKEditor 5 image tools and the image editor that is part of Flmngr.
How it works
Initialize CKEditor 5 with Flmngr added as a plugin, and specify its API key using the Flmngr.apiKey parameter.
All other configuration can be set directly here as well, or by using the visual Dashboard linked to your API key that Flmngr provides.
How to start using
This code sample is useful when you use CKEditor 5 — one of the most innovative WYSIWYG HTML editors.
You can install the CKEditor 5 file manager plugin or a ready-to-use CKEditor 5 build with the file manager.
This gives you seamless integration of CKEditor 5 with the file manager, along with a well-documented Flmngr API for use outside the editor.
ClassicEditor.create(document.querySelector("#editor"), {
Flmngr: {
apiKey: "FLMN24RR1234123412341234", // default free key
urlFileManager: "https://fm.flmngr.com/fileManager", // demo server
urlFiles: "https://fm.flmngr.com/files" // demo file storage
}
}).then(
(editor) => {
}
).catch((error) => {
console.log(error);
});<h2 class="mb-3">Flmngr: CKEditor 5 file manager</h2>
<textarea id="editor" style="height:300px"></textarea>body {
padding: 20px;
background-color: #F4F4F4;
}
h2 {
font-weight: bold;
}
.ck-editor .ck-editor__main .ck-content {
min-height: 250px;
}