CKEditor5 Markdown

The CKEditor5 Markdown module extends the CKEditor5 editor in Drupal with a toolbar button that allows editors to paste Markdown content and have it automatically converted to HTML inside the editor.

When clicked, the button opens a dialog where users can paste or type Markdown. On confirmation, the Markdown is parsed using the
marked library (with GitHub-Flavored Markdown support enabled) and inserted into the editor as formatted HTML.

Why this module?

CKEditor5 provides an official Paste Markdown feature that automatically detects Markdown content in the clipboard and converts it on paste. However, that feature is still experimental and has known limitations:

• Not all Markdown constructs are reliably detected or converted. Some text
  blocks may pass through without transformation.
• The auto-detection heuristics can interact unexpectedly with other plugins
  (e.g. Paste from Office, Paste from Google Docs, Autoformatting), potentially
  causing conflicts or inconsistent behaviour depending on the active plugin
  set.

This module takes a deliberate, explicit approach: editors trigger the
conversion intentionally via a toolbar button, avoiding clipboard sniffing and
its associated edge cases.

Requirements

• Drupal 10.3 or higher, or Drupal 11.
• The core ckeditor5 module.

Installation

Install the module using Composer:

composer require drupal/ckeditor5_markdown

Then enable it via the Drupal admin UI or with Drush:

drush en ckeditor5_markdown

Configuration

1. Go to Administration > Configuration > Content authoring > Text formats
   and editors.
2. Edit the text format that uses CKEditor5.
3. In the Toolbar section, drag the Paste Markdown button into the
   active toolbar.
4. Save the configuration.

Usage

1. Place the cursor in the editor where you want to insert content.
2. Click the Paste Markdown button (Markdown icon) in the toolbar.
3. Paste or type Markdown content in the dialog that appears.
4. Click Insert. The Markdown is converted to HTML and inserted at the
   cursor position.

Press Escape or click outside the dialog to cancel without inserting.

Important: CKEditor5 filters the HTML it accepts based on the plugins and features enabled in its configuration. This module converts Markdown to HTML, but CKEditor will silently strip any elements that are not permitted by the active plugin set. For example, # Heading 1 will only be inserted as an <h1> element if the Heading plugin is enabled and <h1> is configured as an allowed heading level. Review your CKEditor5 toolbar and plugin settings to ensure that the HTML elements corresponding to the Markdown you intend to use are enabled.

Third-party libraries

This module relies on the following third-party JavaScript library:

The library is bundled into the compiled asset at js/build/markdownPaste.js
via Webpack. To rebuild after modifying source files:

npm install
npm run build