Home > Others

FCKeditor User Guide (fckeditor_2.6.3)

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞
To use the text editor, select FCKeditor. The following configuration describes the environment:
Windows XP
Myeclipse6.0ga
Fckeditor2.6.3
Fckeditor2.3 1. Download
Official download homepage: http://www.fckeditor.net/download/. fckeditor_2.6.3.zip is used.
And FCKeditor-2.3 version
2. Deployment
In this example, webroot is used as the application root path. The directory structure after deployment is shown in: 1、fckeditor_2.5.1.zip decompress and copy the FCKeditor folder to/webroot /.
2、fckeditor-2.3.zip unzip, copy commons-fileupload.jar and FCKeditor-2.3.jar to/webroot/WEB-INF/lib/
3. Modify the/webroot/WEB-INF/Web. xml file and add the following content:
  1. <Servlet>
  2. <Servlet-Name> connector </servlet-Name>
  3. <Servlet-class> com. fredck. FCKeditor. connector orservlet </servlet-class>
  4. <Init-param>
  5. <Param-Name> basedir </param-Name>
  6. <Param-value>/userfiles/</param-value>
  7. </Init-param>
  8. <Init-param>
  9. <Param-Name> debug </param-Name>
  10. <Param-value> true </param-value>
  11. </Init-param>
  12. <Load-on-startup> 1 </load-on-startup>
  13. </Servlet>
  15. <Servlet>
  16. <Servlet-Name> simpleuploader </servlet-Name>
  17. <Servlet-class> com. fredck. FCKeditor. uploader. simpleuploaderservlet </servlet-class>
  18. <Init-param>
  19. <Param-Name> basedir </param-Name>
  20. <Param-value>/userfiles/</param-value>
  21. </Init-param>
  22. <Init-param>
  23. <Param-Name> debug </param-Name>
  24. <Param-value> true </param-value>
  25. </Init-param>
  26. <Init-param>
  27. <Param-Name> enabled </param-Name>
  28. <Param-value> true </param-value>
  29. </Init-param>
  30. <Init-param>
  31. <Param-Name> allowedextensionsfile </param-Name>
  32. <Param-value> </param-value>
  33. </Init-param>
  34. <Init-param>
  35. <Param-Name> deniedextensionsfile </param-Name>
  36. <Param-value> PHP | php3 | PhP5 | phtml | ASP | aspx | ascx | JSP | CFM | CFC | PL | bat | exe | DLL | Reg | CGI </param- value>
  37. </Init-param>
  38. <Init-param>
  39. <Param-Name> allowedextensionsimage </param-Name>
  40. <Param-value> JPG | GIF | JPEG | PNG | BMP </param-value>
  41. </Init-param>
  42. <Init-param>
  43. <Param-Name> deniedextensionsimage </param-Name>
  44. <Param-value> </param-value>
  45. </Init-param>
  46. <Init-param>
  47. <Param-Name> allowedextensionsflash </param-Name>
  48. <Param-value> SWF | FLA </param-value>
  49. </Init-param>
  50. <Init-param>
  51. <Param-Name> deniedextensionsflash </param-Name>
  52. <Param-value> </param-value>
  53. </Init-param>
  54. <Load-on-startup> 1 </load-on-startup>
  55. </Servlet>
  57. <Servlet-mapping>
  58. <Servlet-Name> connector </servlet-Name>
  59. <URL-pattern>/FCKeditor/connector </url-pattern>
  60. </Servlet-mapping>
  62. <Servlet-mapping>
  63. <Servlet-Name> simpleuploader </servlet-Name>
  64. <URL-pattern>/FCKeditor/simpleuploader </url-pattern>
  65. </Servlet-mapping>
4. Modify/webroot/FCKeditor/fckconfig. js as follows:
  1. Fckconfig. linkbrowserurl = fckconfig. basepath + 'filemanager/Browser/default/browser.html? Connector =/FCKeditor/connector ';
  2. Fckconfig. imagebrowserurl = fckconfig. basepath + 'filemanager/Browser/default/browser.html? Type = Image & connector =/FCKeditor/connector ';
  3. Fckconfig. flashbrowserurl = fckconfig. basepath + 'filemanager/Browser/default/browser.html? Type = flash & connector =/FCKeditor/connector ';
  4. Fckconfig. linkuploadurl = '/FCKeditor/simpleuploader? Type = FILE ';
  5. Fckconfig. imageuploadurl = '/FCKeditor/simpleuploader? Type = image ';
  6. Fckconfig. flashuploadurl = '/FCKeditor/simpleuploader? Type = flash ';
Note::
(1) Steps 3 and 4 configure file browsing and uploading. The servlet <URL-pattern> in Web. xml must be consistent with the URL reference in fckconfig. js;
(2) the premise of normal operation in this example is that webroot is deployed as the root path. If a virtual path is set, the servlet cannot be found. Iv. Use

This example uses the most direct js method. The example contains web-INF/fckdemo. jsp:

  1. <% @ Page contenttype = "text/html; charset = GBK" %>
  2. <HTML>
  3. <Head>
  4. <Title> FCKeditor test </title>
  5. <SCRIPT type = "text/JavaScript" src = "FCKeditor/FCKeditor. js"> </SCRIPT>
  6. </Head>
  7. <Body>
  8. <Form action = "fckdemo. jsp" method = "Post">
  10. <%
  11. String content = request. getparameter ("content ");
  12. If (content! = NULL ){
  13. Content = content. replaceall ("/R/N ","");
  14. Content = content. replaceall ("/R ","");
  15. Content = content. replaceall ("/N ","");
  16. Content = content. replaceall ("/"","'");
  17. } Else {
  18. Content = "";
  19. }
  20. %>
  22. <Table width = 100%>
  23. <Tr>
  24. <TD colspan = 4 style = 'text-align: Center' width = 100% Height = 50px>
  25. <Span>
  26. <SCRIPT type = "text/JavaScript">
  27. VaR ofckeditor = new FCKeditor ('content'); // The input parameter is the name of the form element (input or textarea generated by FCKeditor ).
  28. Ofckeditor. basepath = 'fckeditor/'; // specify the root path of FCKeditor, that is, the path of FCKeditor. js.
  29. Ofckeditor. Height = '20140901 ';
  30. Ofckeditor. toolbarsets = 'Demo'; // specifies the toolbar. Note that toolbarsets
  31. Ofckeditor. value = "<% = content %>"; // Default Value
  32. Ofckeditor. Create ();
  33. </SCRIPT>
  34. </Span>
  35. </TD>
  36. </Tr>
  37. <Tr> <TD align = center> <input type = "Submit" value = "Submit"> </TD> </tr>
  38. <Tr> <TD> </tr>
  39. <Tr> <TD> values (saved to the database): </TD> </tr>
  40. <Tr> <TD style = "padding: 10px;"> <% = content %> </TD> </tr>
  41. </Table>
  43. </Form>
  44. </Body>
  45. </Html>

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 ):

  1. Autodetectlanguage = true/false automatic language Detection
  2. Basehref = "" Relative Link base address
  3. Contentlangdirection = "LTR/RTL" default text direction
  4. Contextmenu = string array, right-click the menu content
  5. Customconfigurationspath = "" custom configuration file path and name
  6. DEBUG = true/false whether to enable debugging. In this way, when fckdebug. Output () is called, the content is output in the debugging window.
  7. 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.
  8. Enablexhtml = true/false: Can I use XHTML to replace HTML?
  9. Fillemptyblocks = true/false use this function to replace empty block-level elements with spaces.
  10. Fontcolors = "" sets the text color list when the color picker is displayed
  11. Fontformats = "" set the name displayed in the text format list
  12. Fontnames = "" fontnames
  13. Fontsizes = "" font size in the font size list
  14. Forcepasteasplaintext = true/false force paste to plain text
  15. Forcesimpleampersand = true/false do not convert & symbol to XML Entity
  16. Formatindentator = "" specifies the characters used to indent the code in the source code format.
  17. Formatoutput = true/false: whether to automatically format the code when output content
  18. Formatsource = true/false whether to automatically format the code when switching to the Code view
  19. Fullpage = true/false: whether to allow editing of the entire HTML file or only the content between the bodies
  20. Geckousespan = true/false: whether to allow the span flag to replace the B, I, u flag
  21. Iespelldownloadurl = "" download the spelling checker URL
  22. Imagebrowser = true/false: whether to allow browsing of server functions
  23. Imagebrowserurl = "" the URL that runs when browsing the server
  24. Imagebrowserwindowheight = "" image browser window height
  25. Imagebrowser1_wwidth = "" image browser window width
  26. Linkbrowser = true/false: whether to allow browsing the server when a link is inserted
  27. Linkbrowserurl = "" browsing the server URL when inserting a link
  28. Linkbrowserwindowheight = "" link target browser window height
  29. Linkbrowserdomainwwidth = "" link target browser window width
  30. Plugins = Object Registration plug-in
  31. Pluginspath = "" plug-in folder
  32. Showborders = true/false merge border
  33. Skinpath = "" skin folder location
  34. Smileycolumns = 12 Number of columns in the graphic operator window
  35. Smileyimages = String Array array of image file names in the graphic character window
  36. Smileypath = "" folder path
  37. Smileywindowheight tumbler window height
  38. Smiley1_wwidth tumbler window width
  39. Spellchecker = "iespell/spellerpages" set the spelling checker
  40. When startupfocus = true/false is enabled, focus to the editor.
  41. Stylesxmlpath = "" set the location of the XML file that defines the CSS style list
  42. Tabspaces = 4 Number of space characters generated by the tab key
  43. Toolbarcancollapse = true/false: whether to enable or disable the toolbar.
  44. Toolbarsets = the toolbar set can be used for objects.
  45. Toolbarstartexpanded = true/false enable indicates whether to expand a toolbar.
  46. 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.

Reference: http://www.blogjava.net/fastunit/archive/2008/02/18/180525.html

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
ubuntu new user guide github user guide lightroom user guide echo user guide scikit learn user guide hue user guide photoshop elements user guide

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More