strapi-plugin-ckeditor5

    2.0.0-rc.2 • Public • Published

    Strapi CKEditor5 plugin

    Replace default Strapi markdown WYSIWYG editor with enhanced build of HTML CKEditor 5.

    strapi-plugin-ckeditor5

    👀 Live Demo

    Features

    • Enhanced build of CKEditor 5 with more capabilities then Classic Editor build
    • Extensive set of features for your rich content
    • Optional editor customization
    • Automatically upload Inserted images to Media Library (thanks to ckeditor5-strapi-upload-plugin)
    • Media Library button to insert stored images directly to the editor 🔥
    • Automatic translation of UI into selected in Strapi language 🔥 (Strapi v3)
    • Full screen mode 🔥

    How to try

    Check out 👀 live demo where you can test most of the features.

    How to install

    Strapi v4 (work in progress)

    Go to your Strapi project folder and execute

    npm i strapi-plugin-ckeditor5@latest

    Don't forget to rebuild Strapi

    npm run strapi build

    Strapi v3

    Go to your Strapi project folder and execute

    npm i strapi-plugin-ckeditor5@1.14.0

    Don't forget to rebuild Strapi

    npm run strapi build

    How to remove unused buttons (Strapi v3)

    See customization guide.

    How to customize editor (optional, Strapi v3)

    If you want to change appearance of the editor or remove unused buttons you can add a custom CKEditor configuration to override default settings:

    1. Go to your Strapi folder

    2. Copy template config file node_modules/strapi-plugin-ckeditor5/admin/src/config/ckeditor.js to extensions/ckeditor5/admin/src/config

    3. Set up extensions/ckeditor5/admin/src/config/ckeditor.js (see CKEditor configuration guide)

    4. Rebuild Strapi

    npm run strapi build

    Configuration example (Strapi v3)

    // ckeditor.js
    module.exports = {
        // Override toolbar config to leave a few buttons
        toolbar: {
            items: [
                "heading",
                "|",
                "bold",
                "italic",
                "link",
                "alignment",
                "|",
                "undo",
                "redo",
            ],
        },
    };

    Default configuration (Strapi v3)

    For information and inspiration: default editor configuration defined here.

    How to add more features to the editor

    If you want to see more features in this plugin feel free to request it in issues or create pull request in the ckeditor5-build-strapi-wysiwyg repo. Together we will build a comprehensive editor for common needs.

    Acknowledgement

    This plugin uses some code from official manual.

    Links

    ⭐️ Show your support

    Give a star if this project helped you.

    Install

    npm i strapi-plugin-ckeditor5

    DownloadsWeekly Downloads

    1,754

    Version

    2.0.0-rc.2

    License

    MIT

    Unpacked Size

    18.7 kB

    Total Files

    10

    Last publish

    Collaborators

    • roslovets