New to KendoReactStart a free 30-day trial

Using Plugins

The React Editor, part of KendoReact, allows you to extend and customize its functionality and features by using plugins.

You can implement a plugin that renders a popup in the Editor and shows additional tools or supplementary information based on user selection.

Change Theme
Theme
Loading ...

Placeholders

You can use a plugin to provide a placeholder functionality for the Editor which is similar to the placeholder attribute of the HTML input element.

Change Theme
Theme
Loading ...

Read Only

A Read-Only functionality can be implemented using a plugin as well.

The following example demonstrates how to implement a plugin which provides Read-Only functionality.

Change Theme
Theme
Loading ...

Input Rules

Input rules provide an option for modifying the input of the user on the fly and represent pairs of matches and corresponding actions. When the user input matches an input rule, the typed text is transformed based on the action of that rule.

The following example demonstrates how to implement input rules and attach them to the Editor.

Input rules in the example:

  • Converts '- ' or '+ ' to a bullet list.
  • Converts '1. ' or another number to an ordered list.
  • Converts '# ', '## ', '### ', '#### ', '##### ', '###### ' into heading 1, 2, 3, 4, 5, and 6, according to the '#' characters count.
  • Converts three backticks '```' to a code block.
  • Converts '> ' into a blockquote.
  • Converts double dashes to an emdash.
  • Converts three dots to an ellipsis character.
  • Converts an URL to a link.
  • Converts '!image[https://image-path/something.png]' to image.
Change Theme
Theme
Loading ...