The current article will guide you through simple steps you need to take in order to insert a compact text editor into your application. All in all, you should complete just three steps:
- Include the RichText source files on a page.
- Create a container for RichText.
- Initialize RichText with the object constructor.
Including source files
Download the package and unpack it into a folder of your project.
To create dhtmlxRichText, you need to include 2 source files on your page:
Make sure that you set correct relative paths to these files:
The structure of the RichText package is the following:
- sources - the source code files of the library; they are easy-to-read and are mostly intended for debugging;
- codebase - the obfuscated code files of the library; they are much smaller and intended for use in production. Include these files in your apps when they are ready;
- samples - the code samples.
Add a container for RichText and give it an id, for example "richtext_container":
Initialize RichText with the
dhx.Richtext object constructor. The constructor has two parameters:
- the HTML container for RichText. The one we have created at the previous step.
- an object with configuration properties. See the full list below.
This is a list of properties that you can specify in the Richtext configuration object:
- mode - (string) the working mode of RichText. Can be either
- toolbarBlocks - (array) specifies blocks of buttons that will be shown in the Richtext toolbar
- customStats - (array) defines the logic of displaying custom statistics
You can set configuration options during initialization as the second parameter of the constructor:
Related sample: Modes