Example of Overview in ASP.NET Core Markdown Editor Control

Markdown Editor

Overview

This example illustrates how to preview Markdown changes within the Rich Text Editor. You can input or modify the display text, apply formatting, and observe the Markdown preview alongside. This capability is enabled by utilizing the splitter component, which effectively separates the Rich Text Editor from the preview section.

Markdown Preview

In Rich Text Editor, you click the toolbar buttons to format the words and the changes are visible immediately. Markdown is not like that. When you format the word in Markdown format, you need to add Markdown syntax to the word to indicate which words and phrases should look different from each other

Rich Text Editor supports markdown editing when the editorMode set as markdown and using both keyboard interaction and toolbar action, you can apply the formatting to text.

We can add our own custom formation syntax for the Markdown formation, sample link.

The third-party library Marked is used in this sample to convert markdown into HTML content

The Rich Text Editor provides the ability to instantly preview Markdown changes through the preview functionality. To achieve this, the sample utilizes the third-party library Marked.js to convert Markdown into HTML content.