Skip to main content

Initialization

This guide will give you detailed instructions on how to create RichText on a page to enrich your application with features of the RichText editor. Take the following steps to get a ready-to-use component:

  1. Include the RichText source files on a page.
  2. Create a container for RichText.
  3. Initialize RichText with the object constructor.

Including source files​

Download the package and unpack it into a folder of your project.

To create RichText, you need to include 2 source files on your page:

  • richtext.js
  • richtext.css

Make sure that you set correct relative paths to the source files:

index.html
<script type="text/javascript" src="./codebase/richtext.js"></script>  
<link rel="stylesheet" href="./codebase/richtext.css">

Creating container​

Add a container for RichText and give it an ID, for example "root":

index.html
<div id="root"></div>

Initializing RichText​

Initialize RichText with the richtext.Richtext constructor. The constructor takes two parameters:

  • an HTML container (the ID of the HTML container)
  • an object with configuration properties. See the full list here
index.html
// create RichText
const editor = new richtext.Richtext("#root", {
    // configuration properties  
});

Configuration properties​

note

The full list of properties to configure RichText can be found here.

Example​

In this snippet you can see how to initialize RichText with the initial data: