Keyboard support in Blazor Markdown Editor Component

18 Mar 20256 minutes to read

You can use the following keyboard shortcuts when the Rich Text Editor is set to EditorMode as Markdown.

These shortcuts provide quick access to toolbar functions for managing menus and dialogs.

Actions	Windows	Mac
Focus on toolbar	`Alt` + `F10`	`⌥` + `F10`
Close dropdowns/menu and dialogs	`Esc`	`Esc`

Content editing and formatting

These shortcuts help in efficiently editing and formatting text content.

Actions	Windows	Mac
Select all content	`Ctrl` + `A`	`⌘` + `A`
Insert a hard line break (a new paragraph)	`Enter`	`Enter`
Make text bold	`Ctrl` + `B`	`⌘` + `B`
Italicize text	`Ctrl` + `I`	`⌘` + `I`
Apply strikethrough	`Ctrl` + `Shift` + `S`	`⌘` + `⇧` + `S`

Inserting

These shortcuts allow for the quick insertion of tables, links, and images.

Actions	Windows	Mac
Open the insert table dialog	`Ctrl` + `Shift` + `E`	`⌘` + `⇧` + `E`
Create link	`Ctrl` + `K`	`⌘` + `K`
Open the insert image dialog	`Ctrl` + `Shift` + `I`	`⌘` + `⇧` + `I`

Text manipulation

These shortcuts help in modifying text case and applying superscript or subscript.

Actions	Windows	Mac
Convert text to uppercase	`Ctrl` + `Shift` + `U`	`⌘` + `⇧` + `U`
Convert text to lowercase	`Ctrl` + `Shift` + `L`	`⌘` + `⇧` + `L`
Apply superscript	`Ctrl` + `Shift` + `=`	`⌘` + `⇧` + `=`
Apply subscript	`Ctrl` + `=`	`⌘` + `=`

Lists

These shortcuts enable the creation of ordered and unordered lists.

Actions	Windows	Mac
Create an ordered list	`Ctrl` + `Shift` + `O`	`⌘` + `⇧` + `O`
Create an unordered list	`Ctrl` + `Alt` + `O`	`⌘` + `⌥` + `O`

Clipboard operations

These shortcuts facilitate copying, cutting, and pasting content.

Actions	Windows	Mac
Copy the selected content	`Ctrl` + `C`	`⌘` + `C`
Cut the selected content	`Ctrl` + `X`	`⌘` + `X`
Paste the copied or cut content	`Ctrl` + `V`	`⌘` + `V`

Undo & redo

These shortcuts allow for undoing and redoing recent changes.

Actions	Windows	Mac
Undo	`Ctrl` + `Z`	`⌘` + `Z`
Redo	`Ctrl` + `Y`	`⌘` + `Y`

Other actions

These shortcuts provide additional functionalities like fullscreen mode.

Actions	Windows	Mac
Toggle full screen mode	`Ctrl` + `Shift` + `F`	`⌘` + `⇧` + `F`

@using Syncfusion.Blazor.RichTextEditor

<SfRichTextEditor EditorMode="EditorMode.Markdown" Value="@MarkdownValue"></SfRichTextEditor>

@code{

    private string MarkdownValue { get; set; } = @"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. You can add our own custom formation syntax for the Markdown formation, [sample link](https://ej2.syncfusion.com/home/). The third-party library <b>Marked</b> is used in this sample to convert markdown into HTML content.";

}

Blazor RichTextEditor with Key Configuration