In the previous section we have shown how to register a custom editor in CoreMedia Studio, but registering only one type may often not be sufficient. Therefore, it is also possible to register different configurations and make use of them in different parts of the Studio.

To achieve this, simply add an additional module to the @coremedia-blueprint/studio-client.main.ckeditor5 package (just like the existing ckeditorDefault.ts module). You can now customize the editor configuration of this new module as you wish.

This module can then be imported in your ckeditor.ts, which exports a more advanced initEditor function:

import { createDefaultCKEditor } from "./ckeditorDefault";
import { createCustomCKEditor } from "./ckeditorCustom";

export default function initEditor(type:string = CKEditorTypes.DEFAULT_EDITOR_TYPE):(domElement:HTMLElement) => Promise<ClassicEditor> {
  switch (type) {
    case CKEditorTypes.DEFAULT_EDITOR_TYPE:
      return (domElement) => createDefaultCKEditor(domElement);
    case "custom":
      return (domElement) => createCustomCKEditor(domElement);
    ...
  }
};

This is where the type parameter comes into play and determines which editor configuration to return. You can then register all different editors in a Studio plugin like shown in Section 9.6.6.3, “Registering Editor Configurations in Studio”.