JBoss.orgCommunity Documentation
In the WYSIWYG widget section, you already know about a set of default toolbars (CompleteWCM, Default, BasicWCM, Basic, SuperBasicWCM). In this section, you will learn how to create a RichText editor with custom buttons.
Just edit the configuration file and modify or add new items to the configuration file of the RichText editor is located in: apps/resource-static/src/main/Webapp/eXoConfig.js
Take a look at the eXoConfig.js file to see a definition of a custom toolbar named "MyCustomToolbar":
FCKConfig.ToolbarSets["MyCustomToolbar"] = [
['Source','Templates','-','FitWindow','ShowBlocks'],
['Cut','Copy','PasteText','-','SpellCheck','-','Undo','Redo'],
['WCMInsertGadget','Flash','Table','SpecialChar', 'WCMInsertContent'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyFull','-','OrderedList','UnorderedList','-','TextColor','BGColor','-','RemoveFormat'],
['Link','WCMInsertPortalLink','Unlink','Anchor'],
'/',
['Style','FontFormat','FontName','FontSize']
] ;
Every toolbar set is composed of a series of "toolbar bands" that are grouped in the final toolbar layout. The bands items move together on new rows when resizing the editor.
Every toolbar band is defined as a separated JavaScript array of strings. Each string corresponds to an available toolbar item defined in the editor code or in a plugin.
Put the desired button names in square bracket ("[" & "]") and separate them by commas to create a toolbar band. You can look at the above code to know all the possible toolbar item. If the toolbar item does not exist, a message will be displayed when loading the editor.
Include a separator in the toolbar band by putting the "-" string on it.
Separate each toolbar brands with commas.
Use slash ("/") to tell the editor that you want to force the next bands to be rendered in a new row and not following the previous one.
The last toolbar band must have no comma after it.