Currently we've OOTB styles plugin configured for RTE in AEM 6.3, we need to add second styles plugin(duplicate styles plugin with name "sizes").
I tried to use the same script from styles which i found under the path
/libs/clientlibs/granite/coralui2/optional/rte/js/components/rte/plugins/StylesPlugin.js
but not working fine. Tried to use the same functions from StylesPluginImpl.js too.
TFS
Yep, you need to override CuiToolbarBuilder and CUI.rte.ui.cui.Toolkit.
1. Please use CUI.rte.ui.cui.Toolkit to invoke the customized
createToolbarBuilder: function (hint) {
return new CUI.rte.ui.cui.CuiToolbarBuilderExt(); // customized toobar
},
2. In CuiToolbarBuilderExt add your new plug-in's in toolbar and popovers
Eg: ICONS (if required), inline and fullscreen in CUI.rte.ui.cui.DEFAULT_UI_SETTINGS
3. Update or add your new template for the popover in /libs/clientlibs/granite/richtext/js/Coral.templates.js ( here its hard coded with styles id you might need to add your new plug in name.)
Note: you dont have to override this class or plugin, its a method so you can define it any other classes. I added in the bottom of the CuiToolbarBuilder.
Eg:
window["Coral"]["templates"]["RichTextEditor"]["styles_pulldown"] = (function anonymous(data_0
/**/) {
var frag = document.createDocumentFragment();
var data = data_0;
var el0 = document.createElement("coral-buttonlist");
el0.className += " rte-toolbar-list";
var el1 = document.createTextNode("\r\n");
el0.appendChild(el1);
var iterated_1 = data_0;
for (var i1 = 0, ni1 = iterated_1.length; i1 < ni1; i1++) {
var data_1 = data = iterated_1[i1];
var el3 = document.createTextNode("\r\n ");
el0.appendChild(el3);
var el4 = document.createElement("button","coral-buttonlist-item");
el4.setAttribute("is", "coral-buttonlist-item");
el4.setAttribute("data-action", "styles#"+data_1["cssName"]);
el4.textContent = data_1["text"];
el0.appendChild(el4);
var el5 = document.createTextNode("\r\n");
el0.appendChild(el5);
}
var el6 = document.createTextNode("\r\n");
el0.appendChild(el6);
frag.appendChild(el0);
var el7 = document.createTextNode("\r\n");
frag.appendChild(el7);
return frag;
});
Thanks!
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.