RichFaces new TinyMCE Editor

JSF RichFaces released a new HTML/Rich Text editor on their latest version (3.3).Frankly, it is about time… It definitely took them a while. But better later than never…

The editor is a wrapper for the JavaScript WYSIWYG editor open source project.

Using the editor is very simple, assuming your project already using JSF RichFaces:

<rich:editor id="article" width="700" height="400"
    value="#{myBean.text}" required="true">
</rich:editor>

It is also possible to control the editor properties in the same manner TinyMCE editor is manipulated, buy simply adding editor specific properties. For example, in order to position the toolbar on the “top” and align the buttons to the left:

<rich:editor id="article" theme="advanced" viewMode="visual"
  width="700" height="400" value="#{myBean.text}" required="true">
  <f:param name="theme_advanced_toolbar_location" value="top" />
  <f:param name="theme_advanced_toolbar_align" value="left" />
</rich:editor>