CKEditor 5 can handle embedded media like images, which are backed by BLOB properties stored in content. A first step to support this is integrating the corresponding plugin as described in Section 10.2.8, “Images Plugin”.

Next, you need to configure content types in CoreMedia Studio, which can be referenced as embedded media by default, for example, on drag and drop from library.

To do so, two possible approaches exist, where the latter one is recommended:

editorContext.registerRichTextEmbeddableType Function

This will register a content type name to be regarded (by default) as embeddable media object. It requires to set a property to refer to for accessing the corresponding BLOB data, thus, it should refer to a BLOB property.

ConfigureDocumentTypes Class

As part of the general configuration of content types within CoreMedia Studio you may define a richTextImageBlobProperty which refers to a BLOB property of the corresponding content type. Setting this automatically marks the content type and its child types as being regarded as embeddable media.

Example 10.7, “Configuration of Embeddable Media in CKEditor 5” shows a typical usage of this configuration option.

To apply this configuration, adapt the BlueprintFormsStudioPlugin in CoreMedia Blueprint accordingly.

new ConfigureDocumentTypes({
  names: "CMPicture,CMImage",
  richTextImageBlobProperty: "data",
  /* ... */
}),

Linking to Embeddable Media Contents

If you want to link to the contents defined as embeddable, you have to apply an alternative approach to plain drag and drop. Instead, use the Link feature, that is, drag and drop to the link dialog. Find details regarding the Link feature for contents at Section 10.2.9, “Link Plugins”.