Usage of FCKeditor

FCKeditor is an open-source project on sourceforge.net. It mainly implements the online web editor function and enables web programs to have powerful editing functions such as MS Word. Official Website for http://www.fckeditor.net, server support ASP. Net, ASP, ClodFusion, PHP, Java and other languages, and support IE 5 +, Mozilla, Netscape and other mainstream browsers.

Download fckeditor from the official website. Note that there are two packages: The main file and the jsp integration package.

1. Decompress fckeditor_2.3.2.zip (main FCKeditor file) and copy the FCKeditor directory to the root directory of the website.

(Note the following:FckeditorChangeFCKeditor(TAG calls are in upper case by default, while js calls are in lower case. This is not clear)

2. Decompress fckeditor-2.3.zip, (jsp, FCKeditor Integration package), role: This is the JSP Integration Pack for using FCKeditor inside a java server page without the complexity of using a Java scriptlets or the javascript api.

3. Copy the servlet-mapping definition in the FCKeditor-2.3/web/WEB-INF/web. xml to the web. xml file of your project.
Modify

<Servlet-mapping>
<Servlet-name> Connector </servlet-name>
<Url-pattern>/editor/filemanager/browser/default/connectors/jsp/connector </url-pattern>
</Servlet-mapping>

<Servlet-mapping>
<Servlet-name> SimpleUploader </servlet-name>
<Url-pattern>/editor/filemanager/upload/simpleuploader </url-pattern>
</Servlet-mapping>

Is

<Servlet-mapping>
<Servlet-name> Connector </servlet-name>
<Url-pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector </url-pattern>
</Servlet-mapping>

<Servlet-mapping>
<Servlet-name> SimpleUploader </servlet-name>
<Url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader </url-pattern>
</Servlet-mapping>

4, The FCKeditor-2.3/web/WEB-INF/lib directory under the 2 JAR package:FCKeditor-2.3.jar, The commons-fileupload.jar is copied to the lib folder of your own project (Note that if there is a commons-fileupload.jar In the upload project with spring ssh) there is no need to copy.

(Note that in some online posts, the source code src \ com \ fredck \ FCKeditor \ * in the jsp integration package is integrated into the project, so this time does not need FCKeditor-2.3.jar, you can look at this is a thing .)

5. Add:

// Add at the beginning of the file
<% @ Taglib uri = "http://fckeditor.net/tags-fckeditor" prefix = "FCK" %>

This usage has not been noticed that I am using <% @ taglib uri = "/WEB-INF/FCKeditor. tld" prefix = "FCK" %>

/WEB-INF/FCKeditor. tld this file is of course necessary.
// Add the desired location
<FCK: editor id = "content" width = "100%" height = "500 basePath ="/FCKeditor /"
ImageBrowserURL = "/FCKeditor/editor/filemanager/browser/default/browser.html? Type = Image & Connector = connectors/jsp/connector"
LinkBrowserURL = "/FCKeditor/editor/filemanager/browser/default/browser.html? Connector = connectors/jsp/connector"
FlashBrowserURL = "/FCKeditor/editor/filemanager/browser/default/browser.html? Type = Flash & Connector = connectors/jsp/connector"
ImageUploadURL = "/FCKeditor/editor/filemanager/upload/simpleuploader? Type = Image"
LinkUploadURL = "/FCKeditor/editor/filemanager/upload/simpleuploader? Type = File"
FlashUploadURL = "/FCKeditor/editor/filemanager/upload/simpleuploader? Type = Flash ">
Here is the content to be edited. You can directly accept the output parameters (for example, <% = content %> ).

</FCK: editor>

//////////////////////////////////////// //

 When using FCKeditor, you may not be able to browse The Server. The error message is: The Server didn't send back a proper XML response.

The reason is that the server does not have an xml parser,
Solution: To http://apache.justdn.org/xml/xalan-j/binaries/
Download xalan-j_2_7_0-bin-2jars.zip
Decompress the package and copy xalan. jar and serializer. jar to the lib directory of the application. OK.

 

I am using tomcat 6.0, but this error is not reported. It may contain its own

//////////////////////////////

Start the server test .... After success, the FCKeditor will be reduced.

1. Delete all folders starting with "_" in the FCKeditor directory and subdirectory
2. Only fckconfig. js, FCKeditor. js, fckstyles. xml, and fcktemplates. xml are retained in the root directory of fckeditor.
3. Clear the files and folders in the editor/filemanager/upload directory.
4. You can also delete the skin files under the editor/skins directory, leaving only the default skin (if you do not need to change the skin)
5. you can also delete the files in the editor/lang directory and retain only en. js, fck1_agemanager. js, zh-cn.js, zh. js files (English, simplified Chinese, traditional Chinese should be enough :))

Finished. Is it refreshing now?

Other problems:
When used in struts + spring + hibernate, the image upload function may report:
The output format must have a' {http://xml.apache.org/xalan=content-handler' property!
If the error occurs, try removing xalan *. jar under the WEB-INF/lib directory.

Security Questions:

If FCKEditor can be used by common users at the front end, pay attention to related security issues. Do not use the default ToolBar when using FCKEditor at the front end,
To remove the Add image, flash, and image domain buttons
In fckconfig. js, about 78 rows are configured with values in those arrays, just like a function on the interface. You can force each group of values to try out what they represent. : P

The fckeditorinstallation is complete. For detailed configuration, see the examples in the web/_ samples directory in the fckeditor-2.3.zip folder (jsp, FCKeditor integration package.

///////////////////////////////////////

Three methods to call FCKeditor
<% --
Three methods to call FCKeditor
1. FCKeditor custom tag (header file must be added <% @ taglib uri = "/TestFCKeditor" prefix = "FCK" %>)
2. script Language call (the script file <script type = "text/javascript" src = "/TestFCKeditor/FCKeditor/fckeditor. js"> </script> must be referenced)
3. FCKeditor API call (header files must be added <% @ page language = "java" import = "com. fredck. FCKeditor. *" %>)
-- %>

This is not clear and I have not studied it yet. The first type of tag that has been used in normal times is the first type.

11. FCKeditor File Upload Configuration

The configuration file of the FCKeditor editor is fckconfig. js, which has settings for various default attributes of the editor. The following are settings for uploading files when fckeditor is integrated with java (note that the editor does not automatically create a folder for file upload and must be manually added to the root directory of the project. modify the original values of the following attributes in the js file to the following settings:

FCKConfig.LinkBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Connector=connectors/jsp/connector" ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector" ;
FCKConfig.FlashBrowserURL =FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector" ;

FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File' ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;

Now, you can use the file upload function of FCKeditor.

//////////////////////

5. configuration file fckconfig. js

1. DefaultLanguage: default language, which can be changed to "zh-cn"

2. Custom toolbar: you can modify or add ToolbarSets, for example:

FCKConfig. ToolbarSets ["Demo"] = [
['Bold ', 'italic', '-', 'orderedlist', 'unorderedlist', '-', 'link', 'unlink ','-', 'textcolor', 'bgcolor', '-', 'style', '-', 'image', 'flash', 'table']
];
3. EnterMode and ShiftEnterMode: line feed of "Carriage Return" and "Shift + carriage return". The optional mode is prompted for comments.

4. EditorAreaCss: editing area Style File

5. Other parameters (for conversion ):

AutoDetectLanguage = true/false automatic language Detection
BaseHref = "" Relative Link base address
ContentLangDirection = "ltr/rtl" default text direction
ContextMenu = string array, right-click the menu content
CustomConfigurationsPath = "" custom configuration file path and name
Debug = true/false whether to enable debugging. In this way, when FCKDebug. Output () is called, the content is Output in the debugging window.
When EnableSourceXHTML = true/false is TRUE, when the code page is switched from the visual interface to the code page, the HTML is processed as XHTML.
EnableXHTML = true/false: Can I use XHTML to replace HTML?
FillEmptyBlocks = true/false use this function to replace empty block-level elements with spaces.
FontColors = "" sets the text color list when the color picker is displayed
FontFormats = "" set the name displayed in the text format list
FontNames = "" FontNames
FontSizes = "" font size in the font size list
ForcePasteAsPlainText = true/false force paste to plain text
ForceSimpleAmpersand = true/false do not convert & symbol to XML Entity
FormatIndentator = "" specifies the characters used to indent the code in the source code format.
FormatOutput = true/false: whether to automatically format the code when output content
FormatSource = true/false whether to automatically format the code when switching to the Code view
FullPage = true/false: whether to allow editing of the entire HTML file or only the content between the bodies
GeckoUseSPAN = true/false: whether to allow the SPAN flag to replace the B, I, U flag
IeSpellDownloadUrl = "" download the spelling checker URL
ImageBrowser = true/false: whether to allow browsing of server functions
ImageBrowserURL = "" the URL that runs when browsing the server
ImageBrowserWindowHeight = "" image browser window height
Imagebrowser1_wwidth = "" image browser window width
LinkBrowser = true/false: whether to allow browsing the server when a link is inserted
LinkBrowserURL = "" browsing the server URL when inserting a link
LinkBrowserWindowHeight = "" link target browser window height
Linkbrowserdomainwwidth = "" link target browser window width
Plugins = object Registration plug-in
PluginsPath = "" plug-in folder
ShowBorders = true/false merge border
SkinPath = "" skin folder location
SmileyColumns = 12 Number of columns in the graphic operator window
SmileyImages = String Array array of image file names in the graphic character window
SmileyPath = "" folder path
SmileyWindowHeight tumbler window height
Smiley1_wwidth tumbler window width
SpellChecker = "ieSpell/Spellerpages" set the spelling checker
When StartupFocus = true/false is enabled, FOCUS to the editor.
StylesXmlPath = "" set the location of the XML file that defines the CSS style list
TabSpaces = 4 Number of space characters generated by the TAB key
ToolBarCanCollapse = true/false: whether to enable or disable the toolbar.
ToolbarSets = the TOOLBAR set can be used for objects.
ToolbarStartExpanded = true/false enable indicates whether to expand a TOOLBAR.
UseBROnCarriageReturn = true/false when you press enter, whether to generate a BR mark or a P or DIV mark
6. Custom styles

The Style option in the toolbar is generated by the configuration file specified by fckconfig. js:

FCKConfig. StylesXmlPath = FCKConfig. EditorPath + 'fckstyles. xml ';
You can modify the fckstyles. xml custom style.