Adding Rich Text

     Hi Michael,

    Yes, it can be implemented via additional development.

    

    You can create a module (e.g. GlbExtendedHtmlEditModule) extending ESNHtmlEditModule with the template (tpl) from ExtendedHtmlEditModule:

define("GlbExtendedHtmlEditModule", ["ESNHtmlEditModule"], function() {
 Ext.define("Terrasoft.controls.GlbExtendedHtmlEditModule", {
 extend: "Terrasoft.ESNHtmlEdit",
 alternateClassName: "Terrasoft.GlbExtendedHtmlEdit",
 tpl: [
 //jscs:disable
 /*jshint quotmark: false */
 "<div id=\"{id}-html-edit\" class=\"{htmlEditClass}\" style=\"{htmlEditStyle}\">",
 "<div style=\"display: table-row;\">",
 "<div id=\"{id}-html-edit-toolbar\" class=\"{htmlEditToolbarClass}\">",
 "<div id=\"html-edit-toolbar-undo\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'undo' || tag == 'redo'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-font-family\" class=\"{htmlEditToolbarButtonGroupClass}\" style=\"{htmlEditFo" +
 "ntFamilyStyle}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'fontFamily'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-font-size\" class=\"{htmlEditToolbarButtonGroupClass}\" style=\"{htmlEditFont" +
 "SizeStyle}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'fontSize'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-font-style\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'fontStyleBold' || tag == 'fontStyleItalic' || tag == 'fontStyleUnderline'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-font-color\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'fontColor'\">",
 " <@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-highlight\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'hightlightColor'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-list\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'numberedList' || tag == 'bulletedList'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-justify\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'justifyLeft' || tag == 'justifyCenter' || tag == 'justifyRight'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-indent\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'outdentList' || tag == 'indentList'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-image\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'image'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-link\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'link'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-justify\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'htmlMode' || tag == 'plainMode'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-tools\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'maximized'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"{id}-html-edit-toolbar-table\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'table'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-addTemplate\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'addTemplate'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "<div id=\"html-edit-toolbar-addMacros\" class=\"{htmlEditToolbarButtonGroupClass}\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'addMacros'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "</div>",
 "</div>",
 "<div style=\"display: table-row;\">",
 "<div id=\"{id}-html-edit-htmltext\" class=\"{htmlEditTextareaClass}\">",
 "<textarea id=\"{id}-html-edit-textarea\" style=\"border: none\"></textarea>",
 "</div>",
 "<div id=\"{id}-html-edit-plaintext\" class=\"{htmlEditTextareaClass}\" style=\"margin-bottom: 24px;\">",
 "<tpl for=\"items\">",
 "<tpl if=\"tag == 'plainText'\">",
 "<@item>",
 "</tpl>",
 "</tpl>",
 "</div>",
 "</div>",
 "<span id=\"{id}-validation\" class=\"{validationClass}\" style=\"{validationStyle}\">" +
 "{validationText}</span>",
 "</div>"
 /*jshint quotmark: true */
 //jscs:enable
 ]
 });
});

And replace SocialFeed (ESN):

define("SocialFeed", ["GlbExtendedHtmlEditModule"], function() {
 return {
 diff: /**SCHEMA_DIFF*/[
 {
 "operation": "merge",
 "name": "SocialMessageEdit",
 "values": {
 "className": "Terrasoft.GlbExtendedHtmlEdit",
 }
 }
 ]/**SCHEMA_DIFF*/
 };
});

Please find the result example attached.

Thank you for choosing Creatio!

Bohdan Zdor,

Does this wok on Creatio hosted environments?

Michael Dorfman,

    Unfortunately, we do not have an experience of such functionality implementation.

     Though, it should work on Creatio hosted environments.



    Thank you.