Those who have followed my blog will be aware that I posted an article earlier this year about extending the Rich Text Editor. That showed that the Rich Text Editor used an extension of a dojo class, ibm.domino.widget.layout.DominoRichText, and could be extended by defining various dojoAttributes, for example fontName as Arial, extraPlugins as [“createLink”,”|”] to add a button to create a link and a separator.
First of all, I must prefix this article with the acknowledgement that most of the information about extending the editor does not come from my own investigation and experimentation. It’s based upon a response by Teresa Monahan of IBM to a query I posted on the 8.5.2 Managed Beta Forum earlier this year. However, that was the beta, and as all articles on the beta covered, there are never any guarantees that beta functionality will be included in the Gold product. So I’ve confirmed that all the information Teresa supplied for the beta is still correct for 8.5.2 GA.
As with 8.5.1, though, extending the CKEditor is done by adding Dojo attributes. The simplest is toolbarType. This allows three toolbars with differing levels of functionality. They are Slim, Medium, or Large. Medium is the toolbarType that is implemented by default, so unless you’re overriding the basic toolbarType in a theme, there is no need to define the toolbarType as Medium.
However, on occasion you may wish to override the toolbar. For example, all toolbars include a button for emoticons, and you may wish to remove that from some applications. If you wish to do so, you can create your own toolbar by adding the Dojo attribute toolbar. This should be defined in SSJS as an array of plugins you want to make available, e.g.:
var myToolbar=”[[‘Font’,’FontSize’], n”;
myToolbar += “[‘Preview’,’Bold’,’TextColor’,’BGColor’],n”;
myToolbar += “[‘Italic’,’Underline’,’Strike’,’-‘,’Subscript’,’Superscript’]]”;
Within the main array, [‘Font’,’FontSize’] creates a group of buttons. The next array creates a new group of buttons. A separator to start a new group can also be defined explicitly with the ‘-‘ toolbar option. You can find out the various plugins available by inspecting the DOM in, for example, Firebug. Alternatively, they are listed in the CKEditorWrapper.js. If including a plugin that is not in the 3 basic toolbarTypes, you need to make sure the plugin is loaded by using the extraPlugins dojoAttribute.
I have not tested this, but you can also control the functionality of the enter key with the enterMode dojoAttribute. The available values are:
1 – a new paragraph is created, the default functionality.
2 – a
tag is inserted.
3 – a new
There are also three alternate skins available, to be found in dominohtmlckeditorskins. These can be changed by defining the skins dojoAttribute to, e.g. kama, office2003, or v2. Additional skins can be created using the same format as the ones provided or reviewing this documentation (albeit a little out-of-date). Bear in mind that there is currently a limitation that all skins need to be in the same folder as the three available skins.