CKEditor 5 Media Management and Linking for Drupal 7

By on
The entity selection step of the Entity Embed CKEditor 5 modal dialog form.

Nickel City Creative now offers full CKEditor 5 Media Management and Linking for Drupal 7 support. Extended support clients have access to a suite of media management and linking projects with advanced CKEditor 5 for Drupal 7 integration powered by Media, Entity Embed and Linkit.

This group of popular Drupal 7 modules enables content authors to curate, embed, display and link to local content, files and remote media from services such as YouTube. Media provided the initial concepts for the Media Entity module, which was added to core in Drupal 8.4, while Entity Embed continues to be utilized for embedding both media and non-media entities in Drupal 10+. Linkit remains the autocomplete interface of choice for both internal and external linking and inspired entity linking in core.

Media Management and Linking in Drupal 7

Current Drupal 7 WYSIWYG media embedding and linking solutions are built around CKEditor 4 via the Editor, CKEditor and/or WYSIWYG modules. CKEditor 4 reached end of life in 2023 and is no longer receiving security coverage and updates. To keep your website safe, it is important to upgrade to the latest version of the editor, CKEditor 5. Continue to allow users to upload, browse, embed and link content using familiar processes and interfaces with Media, Entity Embed and Linkit for CKEditor 5.

Enhancements to Media, Entity Embed and Linkit

As part of the move to CKEditor 5, the Media, Entity Embed and Linkit modules have received a number of enhancements.

Selecting an entity to embed using the media browser in CKEditor 5.

The Media module's media browser replaces the Entity Embed selection process, allowing users to continue uploading, browsing and embedding media using a familiar process and interface. The browser receives visual improvements to match other modal dialogs.

Selecting an entity that has already been embedded using CKEditor 5.

Entity Embed succeeds the Media module's WYSIWYG capabilities by taking advantage of features, such as CKEditor 5's Widget API, in order to better handle rich content embedded in the editor. Instead of handling embedding directly, Media provides the interface for adding and selecting media to embed using Entity Embed. Existing content embedded via Media WYSIWYG is automatically converted to its Entity Embed equivalent on the fly, enabling a seamless transition. Media embedded using Entity Embed uses a token format that is forward compatible with modern Drupal 8+ solutions.

Configuring the display settings for an entity embedded using CKEditor 5.

Media management and linking features include:

  • Continued use of existing Linkit profiles, which now enhance the CKEditor 5 link button with autocomplete functionality.
  • Media browser styling improvements, matching Media's jQuery dialogs to those used by Entity Embed and the Dialog module.
  • A hassle free migration process from legacy media embedding to modern entity embedding.
    • Automatic conversion of media embed tags when displaying content, enabling them to be rendered by Entity Embed.
    • Automatic conversion of media embed tags when editing content, associating them with an embed button and enabling them to be edited using Entity Embed.
    • Automatic handling of overridden alt and text text.
  • Administration pages for configuring automatic upgrade settings.
  • Parity with the latest Drupal 10+ modules including alt + title support, captioning, alignment, file usage tracking, field formatter rendering with custom display settings and shortcuts to entity edit pages.

*Media, Entity Embed and Linkit for CKEditor 5 require CKEditor 5 for Drupal 7 which is also available from Nickel City Creative.

Tags: