Skip to main content



Defines the logic of displaying custom statistics

array customStats;

var richtext = new dhx.Richtext("richtext_container", {    customStats: [        {            name: "chars"        },        {            name: "words"        },        {            name: "sentences",            cb: function(text) {                var rawSentences = text.split(/[.?!]+/);                var count = 0;                for (var i=0; i<rawSentences.length; i++) {                    if (rawSentences[i].length > 0) {                        count += 1;                    }                }                return count;            }        }    ],    toolbarBlocks: ["default", "stats"]});

Related samples: Custom stats


Each field of statistical data represents an object with two properties:

  • name - (string) the name of the field that should be displayed
  • callback - (function) a function that implements the logic of counting entries of the specified field


The working mode of the RichText editor

string mode;

Values: "default","document"

var richtext = new dhx.RichText("richtext_container", {     mode:"document"});

Default value: "default"

Related samples: RichText. Modes


Specifies blocks of buttons that will be shown in the Richtext toolbar

array toolbarBlocks;

// default toolbar blocksvar richtext = new dhx.RichText("richtext_container", {     toolbarBlocks:["undo", "style", "decoration", "colors",         "align", "link"]});

Default value: ["undo", "style", "decoration", "colors", "align", "link"]

Related samples: RichText. Initialization


Full toolbar#

The full toolbar contains several more blocks: "clear", "fullscreen", and "stats":

var richtext = new dhx.RichText(document.body, {    // full toolbar    toolbarBlocks: [        "undo", "style", "decoration", "colors", "align",         "link", "clear", "stats", "fullscreen"    ]});

Related samples: RichText. Full Toolbar

Short toolbar definition#

The default set of buttons can be specified via the "default" definition in the toolbarBlocks array, like this:

var richtext = new dhx.RichText(document.body, {    // full toolbar    toolbarBlocks: ["default", "clear", "stats", "fullscreen"]});

Custom toolbar#

It is also possible to create a custom toolbar by setting desired blocks in the random order:

var richtext = new dhx.RichText(document.body, {    toolbarBlocks: ["clear", "colors", "align","decoration",         "undo", "fullscreen","link"    ]});

Related sample: Toolbar Blocks