Update to CKEditor 5 v30.x

When updating your CKEditor 5 installation, ensure all the packages are the same version to avoid errors.

For custom builds, you may try removing the package-lock.json or yarn.lock files (if applicable) and reinstalling all packages before rebuilding the editor. For best results, make sure you use the most recent package versions.

# Update to CKEditor 5 v30.0.0

Released on September 29, 2021.

For the entire list of changes introduced in version 30.0.0, see the release notes for CKEditor 5 v31.0.0.

Below are the most important changes that require your attention when upgrading to CKEditor 5 v30.0.0.

Starting from v30.0.0, the EditorConfig#toolbar.viewportTopOffset configuration is deprecated.

The new EditorConfig#ui.viewportOffset option allows to set viewportOffset from every direction.

const config = {
    ui: {
        viewportOffset: { top: 10, right: 10, bottom: 10, left: 10 }
    }
}

Here is the exact change you need to introduce for proper integration with the new EditorConfig#ui.viewportOffset configuration change:

// Before v30.0.0.
ClassicEditor
    .create( ..., {
        // ...
        toolbar: {
            items: [ ... ],
            viewportTopOffset: 100
        }
    } )

// Since v30.0.0.
ClassicEditor
    .create( ..., {
        // ...
        toolbar: {
            items: [ ... ]
        },
        ui: {
            viewportOffset: {
                top: 100
            }
        }
    } )

Every day, we work hard to keep our documentation complete. Have you spotted outdated information? Is something missing? Please report it via our issue tracker.

With the release of version 42.0.0, we have rewritten much of our documentation to reflect the new import paths and features. We appreciate your feedback to help us ensure its accuracy and completeness.

Update to CKEditor 5 v30.x

# Update to CKEditor 5 v30.0.0

# Viewport (toolbar) offset configuration change