As most of
us know, the file, image or swf upload is disabled in the rich text editor
available as a part of the
Ajax support in ColdFusion 8. The FCKeditor,
the rich text editor integrated in ColdFusion 8, allows such an upload. By
default, this is disabled by ColdFusion to prevent security issues that might
arise. But you may still want to use this feature provided supported by
FCKeditor. This post will detail how this can be done in easy steps.
<cfform>
<cftextarea richtext=true
name="richtext01?/>
</cfform>
This will give out the
rich text editor as we know. More details about the usage of the tag can be
found here.
Now to enable
upload functionality.
Step 1 : Add the
entries to the toolbar in fckconfig.js
ImageButton, Link, Unlink,
Image, Flash
Add only the entries that are required iamong the above ones
onto the fckconfig.js present under /CFIDE/scripts/ajax/FCKeditor/
directory.
Here's how to add the
entires.
FCKConfig.ToolbarSets["Default"] =
[
['Source','DocProps','-','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','HiddenField'],
['ImageButton','Link','Unlink','Image','Flash'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Anchor'],
['Table','Rule','Smiley','SpecialChar','PageBreak'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow','-','About']
]
;
Step 2 : Set _FileBrowserLanguage and
_QuickUploadLanguage in fckconfig.js
Find _FileBrowserLanguage and
_QuickUploadLanguage properties and set them to cfm.
var _FileBrowserLanguage
= 'cfm';
var _QuickUploadLanguage = 'cfm';
Step 3 : Copy the cfm files into the directories under
FCKeditor
Download fckcfms.zip
Extract
it.
Copy config.cfm and connector.cfm under connectors/cfm into
/CFIDE/scripts/ajax/FCKeditor/editor/filemanager/browser/default/connectors/cfm/
directory.
Copy config.cfm and upload.cfm under upload/cfm into
/CFIDE/scripts/ajax/FCKeditor/editor/filemanager/upload/cfm/
directory.
Step 4 : Set the enabled
property to true in both the config.cfm files copied
browser/default/connectors/cfm/config.cfm
config.enabled =
true;
upload/cfm/config.cfm
config.enabled = true;
Step 5 : Create directories under the upload
directory.
The config.cfm under the upload directory has a
property called userFilesPath which points to the directory where the uploaded
files will be stored.
config.userFilesPath
= "/userfiles/";
Under this directory create folders Image, File
and Flash to support upload of image, file and flash files
respectively.
There are a whole lot of config properties in the two
config.cfm files which can be used to set everything from paths to file formats
supported.
And that's it! You can now start using the upload
functionality in the ColdFusion rich text editor.
Thanks to Terry at it-werks.com for locating this tip.