The editor on RichMarkdown is RichTextEditor

The writing area on RichMarkdown — toolbar, tables, links, images, undo — is RichTextEditor, a JavaScript WYSIWYG editor from the same team. If you need a rich text editor in your own website, CMS or web app, it is the same component you have just used.

What you saw on RichMarkdown

• A custom toolbarHighlight, inline code, task list and code block are our own buttons, added through the editor's toolbar configuration and command events.
• Our paste and keyboard rulesGoogle Docs and Word cleanup, and Obsidian-style Markdown shortcuts, hook into the editor's events without changing the editor itself.
• Your colours, light and darkThe editing surface uses this site's own stylesheet; the toolbar follows the system dark mode.
• Phone-readyA shorter toolbar is used on small screens.

Add it to your site

Copy the richtexteditor/ folder into your static files and add:

<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css" />
<script src="/richtexteditor/rte.js"></script>
<script src="/richtexteditor/plugins/all_plugins.js"></script>

<div id="myeditor"></div>
<script>
  var editor = new RichTextEditor("#myeditor");
  // read and write the content
  editor.setHTMLCode("<p>Hello</p>");
  console.log(editor.getHTMLCode());
</script>

Or install the npm package @richscripts/richtexteditor. Templates for ASP.NET Core MVC, Razor Pages and Blazor are also available. The documentation covers toolbars, image upload, localization and the JavaScript API.

Beyond what RichMarkdown uses

RichMarkdown only needs a small part of the editor. The full product also includes an AI toolkit (bring your own key), real-time collaboration, track changes, threaded comments, revision history, HTML and Markdown structured content, and translations for more than 70 languages. See the live demos or how it compares with TinyMCE, CKEditor, Froala and Tiptap.

FAQ