HtmlEditor

Demonstration and configuration of the Radzen Blazor HtmlEditor component.

Get and set the value link

As all Radzen Blazor input components the HtmlEditor has a Value property which gets and sets the value of the component. Use @bind-Value to get the user input.

All tools link

The Radzen HtmlEditor supports the following tools:

• RadzenHtmlEditorUndo - allows the user to undo the last action (result of other tool, typing or pasting).
• RadzenHtmlEditorRedo - allows the use to redo the last undone action.
• RadzenHtmlEditorSeparator - displays a vertical separator used to delimit group of similar tools.
• RadzenHtmlEditorBold - toggles the bold style of the selected text.
• RadzenHtmlEditorItalic - toggles the italic style of the selected text.
• RadzenHtmlEditorUnderline - toggles the underline style of the selected text.
• RadzenHtmlEditorStrikeThrough - toggles the strikethrough style of the selected text.
• RadzenHtmlEditorAlignLeft - toggles left text alignment.
• RadzenHtmlEditorAlignCenter - toggles center text alignment.
• RadzenHtmlEditorAlignRight - toggles right text alignment.
• RadzenHtmlEditorJustify - toggles justified text alignment.
• RadzenHtmlEditorIndent - indents the selected text.
• RadzenHtmlEditorOutdent - outdents the selected text.
• RadzenHtmlEditorUnorderedList - inserts unordered (bullet) list.
• RadzenHtmlEditorOrderedList - inserts ordered (numbered) list.
• RadzenHtmlEditorColor - sets the foreground color of the selected text.
• RadzenHtmlEditorBackground - sets the background color of the selected text.
• RadzenHtmlEditorRemoveFormat - removes the visual styling of the selected text.
• RadzenHtmlEditorSubscript - converts the selected text to subscript.
• RadzenHtmlEditorSource - edit the HTML source as text.
• RadzenHtmlEditorSuperscript - converts the selected text to superscript
• RadzenHtmlEditorLink - inserts a hyperlink.
• RadzenHtmlEditorUnlink - removes a hyperlink.
• RadzenHtmlEditorImage - allows the user to insert an image by either uploading a file or selecting a URL. Requires File upload to be implemented and the UploadUrl property of the HtmlEditor to be set.
• RadzenHtmlEditorFontName - set the font of the selected text.
• RadzenHtmlEditorFontSize - set the font size of the selected text.
• RadzenHtmlEditorFormatBlock - allows the user to format the selected text as heading or paragraph.
• RadzenHtmlEditorCustomTool - allows the developer to implement a custom tool.

Custom set of tools (text-editing only) link

Here is how to specify a custom set of tools.

Upload files link

Focus link

Radzen Blazor Components, © 2018-2023 Radzen.
Source Code licensed under MIT