FCKEditor installation and configuration tutorial

Http://ckeditor.com/download)Download the latest control version. That is, fckeditor.net_2.6.3.zipand fckeditor_2.6.6.zip. Fckeditor.net_2.6.3.zip

The compressed package mainly contains the fckeditor control source code and demo. The fckeditor_2.6.6.zip package contains all the script files and some functional pages required by the control. The following sections describe how to use these files and some usage tips.

Fckeditor is easy to install and can be completed in three steps.

Step 1: unzip fckeditor.net_2.6.3.zip, find the file library fredck. fckeditorv2.dll, and reference it to the project, as shown in Figure 1.1.

Figure (1.1)

Step 2: decompress fckeditor_2.6.6.zip and reference the decompressed folder fckeditor to the web project. Alternatively, you can change the folder name and reference it to the web

Project. Figure 1.2

 

 

Figure (1.2)

Step 3 is how to deploy the control to the desired page. Create an asp tutorial x page and add a reference to the fckeditor page, that is, "<% @ register assembly =" fredck. fckeditorv2 "namespace =" fredck. fckeditorv2 "tagprefix =" fckeditorv2 "%>" to add the control <fckeditorv2: fckeditor id = "fckeditor1" runat = "server"

Width = "860px" height = "400px" basepath = "~ /Fckeditor/"> </fckeditorv2: fckeditor>. It is recommended that you configure the basepath path of the control to the path of the script folder added in step 2. As shown in Figure 1.3.

 

Figure (1.3)

This fckeditor is configured and can be used on the page. The result is as follows: 1.4. If you want to get the value in the control, you only need to call the value attribute of the control in the background code.

Figure (1.4

Configure it.

The fckeditor control is a configurable control. in the js script file, as shown in figure 2. 1. in this file, we can control all the tools of the control shown in Figure 1.4. We can only display the required tool columns, you can also set the default language used for the control.

 

The following describes the detailed configuration of the fckeditor control:

 

1) fckconfig. customconfigurationspath = ''; // customize the path and name of the configuration file

2) fckconfig. editorareacss tutorial = fckconfig. basepath + 'css/fck_editorarea.css '; // path of the style sheet file in the text editing area

3) fckconfig. editorareastyles = ''; // style sheet style in the text editing area

4) fckconfig. toolbarcombopreviewcss = ''; // preview css in the toolbar.

5) fckconfig.doc type = ''; // Document type

6) fckconfig. basehref = ''; // the base address of the relative link

7) fckconfig. fullpage = false; // whether to allow editing of the entire html file or only the content between the bodies

8) fckconfig. startups tutorial howblocks = false; // whether to enable "Display Module"

9) fckconfig. debug = false; // whether to enable the debugging window function

10) fckconfig. allowquerystringdebug = true; // whether to enable the web page query debugging function

11) fckconfig. skinpath = fckconfig. basepath + 'Skins/default/'; // fckeditor skin path

12) fckconfig. skineditorcss = ''; // The css path of the editor's skin

13) fckconfig. skindialogcss = ''; // The css path of the dialog window skin

14) fckconfig. preloadimages = [fckconfig. skinpath + 'images/toolbar.start.gif ', fckconfig. skinpath + 'images/toolbar.buttonarrow.gif']; // preinstalled images

15) fckconfig. pluginspath = fckconfig. basepath + 'ins ins/'; // plug-in path

16) fckconfig. autogrowmax = 400; // The maximum height limit that can be automatically increased in the text editing area. When setting this attribute, you must set the value of // fckconfig. plugins. add ('autogrow'); remove the annotation of the attribute.

17) fckconfig. autodetectlanguage = true; // whether to automatically detect the language

18) fckconfig. defaultlanguage = 'en'; // Default Language

19) fckconfig. contentlangdirection = 'ltr'; // Default text direction. Optional, "ltr/rtl", that is, left-to-right or right-to-left

20) fckconfig. processhtmlentities = true; // process html objects

21) fckconfig. includelatinentities = true; // including Latin

22) fckconfig. includegreekentities = true; // including Greek

23) fckconfig. processnumericentities = false; // process a digital entity

24) fckconfig. additionalnumericentities = ''; // additional numeric entity

25) fckconfig. fillemptyblocks = true; // whether to fill in an empty block

26) fckconfig. formatsource = true; // whether to automatically format the code when switching to the code View

27) fckconfig. formatoutput = true; // whether to automatically format the code when outputting the content

28) fckconfig. formatindentator = ''; // specifies the characters used to indent the code in the source code format.

29) fckconfig. emailprotection = 'none'; // detect email links

30) fckconfig. emailprotectionfunction = 'Mt (name, domain, subject, body) '; // detect email links

31) fckconfig. startupfocus = false; // whether the focus is in the editor when it is enabled, that is, whether the time Mark on the page is stuck on fckeditor

32) fckconfig. forcepasteasplaintext = false; // whether to force the paste into plain text content

33) fckconfig. autodetectpastefromword = true; // whether to automatically detect file pasting from word. Only Internet Explorer is supported.

34) fckconfig. showdropdialog = true; // whether the drop-down menu is displayed

35) fckconfig. forcesimpleampersand = false; // whether the & symbol is not converted to an xml object

36) fckconfig. tabspaces = 0; // Press the tab key to specify the number of time frame hops. The default value is zero.

37) fckconfig. showborders = true; // whether to merge borders

38) fckconfig. sourcepopup = false; // whether to display

39) fckconfig. toolbarstartexpanded = true; // start the fckeditor toolbar to show by default

40) fckconfig. toolbarcancollapse = true; // whether to collapse or expand the toolbar

41) fckconfig. ignoreemptyparagraphvalue = true; // whether to ignore empty paragraph values

42) fckconfig. floatingpanelszindex = 10000; // floating panel index

43) fckconfig.html encodeoutput = false; // whether to output html encoding

44) fckconfig. templatereplaceall = true; // whether to replace all templates

45) fckconfig. templatereplacecheckbox = true; // whether to display the actual content in the template window

46) fckconfig. toolbarlocation = 'in'; // toolbar location

47) fckconfig. toolbarsets ["default"] // Configure the buttons in the default toolbar for background editing.

48) fckconfig. toolbarsets ["basic"] // Configure the basic toolbar with a button, suitable for foreground editing

49) fckconfig. entermode = 'p'; // The tag is automatically generated by pressing the enter key when editing the text. <p> </p>

50) fckconfig. shiftentermode = 'Br '; // The tag is automatically generated by pressing shift + enter when editing the text. <br/>

51) fckconfig. keystrokes // custom keyboard shortcut

52) fckconfig. contextmenu // define the right-click menu content

53) fckconfig. browsercontextmenuonctrl = false; // whether the context menu of the browser is displayed by right-clicking the ctrl key in the editing area

54) fckconfig. browsercontextmenu = false; // whether to allow right-clicking in the editing area to display the context menu of the browser

55) fckconfig. enablemorefontcolors = true; // whether to disable more color options

56) fckconfig. fontcolors // text color list

57) fckconfig. fontformats // text format list

58) fckconfig. fontnames // font list

59) fckconfig. fontsizes // font size list

60) fckconfig. stylesxmlpath = fckconfig. editorpath + 'fckstyles. XML'; // location of the xml file in the css style list

61) fckconfig. templatesxmlpath = fckconfig. editorpath + 'fcktemplates. XML'; // the xml file location of the template

62) fckconfig. spellchecker = 'WSC'; // spell checker

63) fckconfig. iespelldownloadurl = 'http: // www.iespell.com/download.php '; // download the spelling checker URL

64) fckconfig. spellerpagesserverscript = 'server-scripts/spellchecker. Php'; // path of the spelling checker script

65) fckconfig. firefoxspellchecker = false; // firefox browser spelling check

66) fckconfig. maxundolevels = 15; // The maximum number of unrecoverable times

67) fckconfig. disableobjectresizing = false; // whether the user is prohibited from adjusting the image and table size

68) fckconfig. disablefftablehandles = true; // disable table tool

69) fckconfig. linkdlghidetarget = false; // whether to hide the target tag of the link window

70) fckconfig. linkdlghideadvanced = false; // whether to hide the advanced tag of the link window

71) fckconfig. imagedlghidelink = false; // whether to hide the link label of the image window

72) fckconfig. imagedlghideadvanced = false; // whether to hide the advanced tag of the image window

73) fckconfig. flashdlghideadvanced = false; // whether to hide the advanced tag of the flash window

74) fckconfig. protectedtags = ''; // add html format

75) fckconfig. bodyid = ''; // you can specify the editor id.

76) fckconfig. bodyclass = ''; // sets the editor class.

77) fckconfig. defaultstylelabel = ''; // sets the style of the text editor. The default value is blank document.

78) fckconfig. defaultfontformatlabel = ''; // you can specify the default format.

79) fckconfig. defaultfontlabel = ''; // set the default font

80) fckconfig. defaultfontsizelabel = ''; // set the default font size.

81) fckconfig. defaultlinktarget = ''; // you can specify _ blank, _ self _ parent, and _ top as the default link target)

82) fckconfig. cleanwordkeepsstructure = false; // whether to directly paste the file into the word format

83) fckconfig. removeformattags // whether to delete the corresponding format when deleting text

84) fckconfig. removeattributes // whether to delete the corresponding style when deleting text

85) fckconfig. customstyles // style menu

86) fckconfig. corestyles // Set the fckeditor core style

87) fckconfig. indentlength = 40; // The length of the indentation in the editor.

88) fckconfig. indentunit = 'px '; // unit of indentation in the editor

89) fckconfig. indentclasses = []; // fckeditor allows css indentation.

90) fckconfig. justifyclasses = []; // fckeditor allows the use of css text

91) var _ filebrowserlanguage = 'php'; // language used by the file browser

92) var _ quickuploadlanguage = 'php'; // The language used for quick Upload

93) var _ filebrowserextension = _ filebrowserlanguage = 'Perl '? 'CGI ': _ filebrowserlanguage; // file browser extension

94) var _ quickuploadextension = _ quickuploadlanguage = 'Perl '? 'CGI ': _ quickuploadlanguage; // Quick Upload extension

95) fckconfig. linkbrowser = true; // whether to allow browsing the server when a link is inserted

96) fckconfig. linkbrowserurl // view the server url when a link is inserted

97) fckconfig. Linkbrowser1_wwidth // link the window width of the target browser

98) fckconfig. linkbrowserwindowheight // link the window height of the target browser

99) fckconfig. imagebrowser = true; // whether to disable the image file browsing server function

100) fckconfig. imagebrowserurl // url of the image file browser server

101) fckconfig. Imagebrowser1_wwidth // image browser window width

102) fckconfig. imagebrowserwindowheight // image browser window height

103) fckconfig. flashbrowser = true; // whether to disable the flash browsing server function

104) fckconfig. flashbrowserurl // url of the flash browser server

105) fckconfig. Flashbrowser1_wwidth // flash browser window width

106) fckconfig. flashbrowserwindowheight // flash browser window height

107) fckconfig. linkupload = true; // whether to enable the file upload function

108) fckconfig. linkuploadurl // specify the address of the default file to be uploaded

109) fckconfig. linkuploadallowedextensions // sets the extension of the file to be uploaded.

110) fckconfig. linkuploaddeniedextensions = ""; // you can specify the extension used to upload script files.

111) fckconfig. imageupload = true; // whether to enable the image upload function

112) fckconfig. imageuploadurl // specify the address of the default image file to be uploaded

113) fckconfig. imageuploadallowedextensions // you can specify the extension used to upload image files.

114) fckconfig. imageuploaddeniedextensions = ""; // you can specify the extension used to upload an image script file.

115) fckconfig. flashupload = true; // whether to enable the flash Upload function

116) fckconfig. flashuploadurl // address of the flash file to be uploaded

117) fckconfig. flashuploadallowedextensions // you can specify the extension used to upload a flash file.

118) fckconfig. flashuploaddeniedextensions = ""; // you can specify the extension used to upload flash script files.

119) fckconfig. smileypath // Insert the path of the emoticon icon

120) fckconfig. smileyimages // file name of the emoticon icon

121) fckconfig. smileycolumns = 8; // number of columns displayed in the emoticons window

122) fckconfig. Smiley1_wwidth = 320; // display width of the emoticon window. This window will be adjusted due to changes in the emoticon file.

123) fckconfig. Smiley1_wheight = 210; // The height of the emoticons window. This window will be adjusted due to changes in the emoticons file.

124) fckconfig. backgroundblockercolor = '# ffff'; // The background color in the pop-up window of the editor.

125) fckconfig. backgroundblockeropacity = 0.50; // the transparency of the background when the editor pops up.

126) fckconfig. mswebbrowsercontrolcompat = false;

127) fckconfig. preventsubmithandler = false;