Tuesday, January 8, 2008

Enable TinyMCE Plugins for Alfresco 2.1

Having tried the method described on the Alfresco Wiki to enable TinyMCE Plugins (i.e. fullscreen,paste,visualchar) to no avail, I came with a solution to enable plugins for the TinyMCE editor.

I downloaded the latest version of TinyMCE from http://tinymce.moxiecode.com/ extracted it to a temp folder and replaced the ALFRESCO_WAR/scripts/tiny_mce (keep in mind I installed Alfresco on Jboss) with TINY_MCE_HOME/jscripts/tiny_mce. Then created a custom appearance by adding the following to ALFRESCO_WAR/WEB-INF/classes/alfresco/web-client-config-wcm.xml

<widget xforms-type="xf:textarea"
appearance="custom"
javascript-class-name="alfresco.xforms.RichTextEditor">
<param name="plugins">fullscreen,table,paste,visualchars</param>
<param name="theme_advanced_buttons1">bold,italic,underline,strikethrough,separator,fontselect,fontsizeselect</param>
<param name="theme_advanced_buttons2">link,unlink,image,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,bullist,numlist,separator,undo,redo,separator,forecolor,backcolor</param>
<param name="theme_advanced_buttons3">cut,copy,paste,separator,pastetext,pasteword,separator,code,separator,fullscreen,separator,visualchars,separator,tablecontrols,separator</param>
<param name="force_p_newlines">true</param>
<param name="height">600</param>
</widget>

Then modified ALFRESCO_WAR/scripts/ajax/xforms.js look for the tinyMCE.init section at the end of the file and added plugins : "table,fullscreen,paste,visualchars",. After modifying the tinyMCE section should look like this:

tinyMCE.init({
theme: "advanced",
mode: "exact",
plugins : "table,fullscreen,paste,visualchars",
width: -1,
auto_resize: false,
force_p_newlines: false,
encoding: "UTF-8",
entity_encoding: "raw",
add_unload_trigger: false,
add_form_submit_trigger: false,
execcommand_callback: "alfresco_TinyMCE_execcommand_callback",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_buttons1: "",
theme_advanced_buttons2: "",
theme_advanced_buttons3: "",
urlconverter_callback: "alfresco_TinyMCE_urlconverter_callback"
});

Hope this was helpful. If anybody know another way to solve this issue, please let me know.

No comments: