CoreMedia Studio Manual, Version 7.5.45-10
7.5. Upgrading the CKEditor | 7.5.1. Upgrading RichTextArea Plugins from CKEditor 3 to 4

Update the version of jangaroo-libs to the latest version. This contains the source code for CKEditor 4.

Choose the CKEditor and CoreMedia plugins that should be loaded by applying the addCKEditorPluginsPlugin or removeCKEditorPluginsPlugin to a Studio plugin. Choose the buttons which will appear in the richtext toolbar by applying the additemsplugin or removeitemsplugin to the richtextpropertyfield. See Section 7.4.5.5, “Customizing Richtext Toolbar”. Below are tables of CKEditor and CoreMedia Richtext plugins loaded by default.

Event listening has changed in CKEditor 4, which may affect custom plugins. As the events to select menu items from a custom dropdown menu (e.g. custom styles) have changed, the richTextMenuCheckItem has been introduced to replace the menucheckitem in dropdown menus. If the menu has a base class, make sure to make this change there too.

CKEDITOR.dom.selection.getRanges() returns undefined if the selection has length 0. Code which uses this range should check if it exists before calling properties or methods on it.

CSS styles can no longer be added on a editor instance basis (e.g. editor.addCss()). As the CKEditor in the Studio is using a div container now instead of an iframe you cannot use the contentCss configuration of the CKEditor anymore, but have to load the CSS rules directly into the Studio (see the section called “Load external resources”).

Global themes are no longer supported and thus the global coremedia theme has been removed.

Skins can be copied from the standard CKEditor collection and customized for styling (dialogs). The coremedia skin is the default. It provides some adjustments for dialogs, so that they better integrate into the Studio UI.