RichTextEditor Demo
Home Pricing

## Basic Example

This example contains the buttons needed for the most common use cases.

Hello world!

### Demo Code:

    import { createRichTextEditor } from "ts-rich-text-editor";

    const editor = await createRichTextEditor("#div_editor1", {
      toolbar: "basic",
    }, {
      basePath: "/richtexteditor",
    });

    <!--Include the JS & CSS-->
    <link rel="stylesheet" href="/richtexteditor/rte_theme_default.css" />
    <script type="text/javascript" src="/richtexteditor/rte.js"></script>
    <script type="text/javascript" src='/richtexteditor/plugins/all_plugins.js'></script>
    <div id="div_editor1">
    	<p>Hello world!</p>
    	<p><img src='/images/editor-image.png' /></p>
    </div>

    <script>
    	var editor1cfg = {}
    	editor1cfg.toolbar = "basic";
    	var editor1 = new RichTextEditor("#div_editor1", editor1cfg);
    </script>

### Customize Editor

In this example, we use the following code to load editor instance.

        var editor1cfg = {}
        editor1cfg.toolbar = "basic";
        var editor1 = new RichTextEditor("#div_editor1", editor1cfg);

Basic toolbar definition(RTE_DefaultConfig.toolbar_small) can be found in rte.js.

If you want to reorder toolbar buttons or remove some of them, check the following link.

Toolbar Configuration