Example of Insert Emoticons in React Rich Text Editor Component


This sample shows how to add your own commands to toolbar of the Rich Text Editor. The emoticons symbol is added to the toolbar to insert emoticons symbols in the editor. Click the smiley to show the emoticons list, and then choose the emoticon to be inserted in the editor.

More Details...


The Rich Text Editor allows you to configure your own commands to its toolbar using toolbarSettings property. The command can be plain text, icon, or HTML template. You can also define the order and group where the command should be included. Bind the action to the command by getting its instance.

Injecting Module

Rich Text Editor component features are segregated into individual feature-wise modules. To use Rich Text Editor feature, we need to inject Toolbar, Link, Image, HtmlEditor, QuickToolbar modules into the services.