Install N1ED plugin for CKEditor

Use Wizard

Easy install N1ED as plugin into your WYSIWYG editor, CMS or framework now and start creating perfect content.

Install now Run Wizard

CKEditor 4 with Bootstrap plugin installation The best way to enable Bootstrap (styles, grid, blocks and widgets) in your editor is to install N1ED plugin for CKEditor. The file manager, image editor and other handy tools are also included in this add-on.

Download Plugin

Get the N1ED plugin for your CKEditor 4:

Download plugin

Get Ready-to-Use build

CKEditor 4 + N1ED plugin pre-installed.
Zero configuration is required. Sample included.

Download

Skip next installation steps.
Use as an instant preview or copy it into your project.
Only link to your storage when you are ready.

Unpack

Unpack the archive with the plugin into the CKEditor plugins/ folder:

ckeditor/
    plugins/
        N1ED-editor/
            plugin.js
    skins/
        n1theme/
            ...

Hint: using the latest free version of CKEditor (4.22.1) is recommended.

Enable Plugin

Enable the N1ED add-on in the config:

Edit config.js

In your code (alternative)

CKEDITOR.editorConfig = function(config) {
    config.extraPlugins = "N1ED-editor";
    config.skin = "n1theme";                   // N1ED's own theme for CKEditor
    config.removePlugins = "iframe,magicline"; // N1ED has better support of this

    // Get your own key then
    config.apiKey = "N1ED24RR1234123412341234";
}

CKEDITOR.replace("editorId", {
    extraPlugins: "N1ED-editor",
    skin: "n1theme",                   // N1ED's own theme for CKEditor
    removePlugins: "iframe,magicline", // N1ED has better support of this

    // Get your own key then
    apiKey: "N1ED24RR1234123412341234",
});

Please avoid using spaces in extraPlugins if you have another plugins enabled. Use comma only as a separator.

The N1ED plugin is fully functional after this step. Next, you will need to link your file storage by installing the file manager backend on your server.

Install backend

Now you need to install the file manager server-side script on your server to enable file manager functionalities in your editor. Follow the instructions provided in the link to complete the setup.

✓