Ckeditor + ckfinder Configuration

Ckeditor + ckfinder configuration usage
I. Usage:
1. Introduce ckeditor Core File ckeditor. js to the <Script type = "text/javascript" src = "ckeditor/ckeditor. js"> </script>
2. Insert the HTML control where the editor is used <textarea>
<Textarea id = "TextArea1" cols = "20" rows = "2" class = "ckeditor"> </textarea>
In the ASP. NET environment, server-side controls can also be used. <TextBox>
<Asp: TextBox ID = "tbContent" runat = "server" TextMode = "MultiLine" class = "ckeditor"> </asp: TextBox>
Add class = "ckeditor" to the control ".
3. Replace the corresponding control with the editor code.
<Script type = "text/javascript">
CKEDITOR. replace ('textarea1 ');
// If it is a server-side control used in the ASP. NET environment <TextBox>
CKEDITOR. replace ('tbcontent ');
// If the <TextBox> control is on the master page, write it like this
CKEDITOR. replace ('<% = tbContent. ClientID. Replace ("_", "$") %> ');
</Script>
4. Configure the Editor (these configurations do not matter by default)
Ckeditor configurations are concentrated in the ckeditor/config. js file. Below are some common configuration parameters:
// Interface language. The default value is 'en'
Config. language = 'zh-cn ';
// Set the width and height
Config. width = 400;
Config. height = 400;
// Editor style, which can be 'kama' (default), 'office2003 ', or 'v2'
Config. skin = 'v2 ';
// Background color
Config. uiColor = '# fff ';
// Toolbar (Basic 'basic ', all-around 'full', custom) plugins/toolbar/plugin. js
Config. toolbar = 'basic ';
Config. toolbar = 'full ';
This will work:
Config. toolbar_Full = [
['Source', '-', 'save', 'newpage', 'preview', '-', 'templates'],
['Cut ', 'copy', 'paste', 'pastetext ', 'pastefromword','-', 'print', 'spellchecker ', 'scayt'],
['Undo ', 'redo', '-', 'Find ', 'replace', '-', 'selectall', 'removeformat'],
['Form', 'checkbox', 'Radio ', 'textfield', 'textta', 'select', 'click', 'imagebutton ', 'hiddenfield'],
'/',
['Bold ', 'italic', 'underline', 'strike', '-', 'subscript', 'superscript'],
['Numberlist', 'bulletedlist', '-', 'outdent ', 'indent', 'blockquote'],
['Justifyleft', 'justifycenter', 'justifyright', 'justifyblock'],
['Link', 'unlink', 'anchor '],
['Image', 'flash', 'table', 'horizontalrule', 'smiley ', 'specialchar', 'pagebreak'],
'/',
['Styles ', 'format', 'font', 'fontsize'],
['Textcolor', 'bgcolor']
];
// Whether the toolbar can be shrunk
Config. toolbarCanCollapse = true;
// Position of the toolbar
Config. toolbarLocation = 'top'; // Optional: bottom
// Whether to expand the toolbar by default
Config. toolbarStartupExpanded = true;
// Cancel the INS/resize/plugin. js function of "drag to change size"
Config. resize_enabled = false;
// Change the maximum height
Config. resize_maxHeight = 3000;
// Change the maximum width
Config. resize_maxWidth = 3000;
// Change the minimum height
Config. resize_minHeight = 250;
// Change the minimum width
Config. resize_minWidth = 750;
// Whether to update the data in the element automatically when a form containing the editor is submitted
Config. autoUpdateElement = true;
// Set whether to use an absolute directory or a relative directory.
Config. baseHref =''
// The z-index value of the Editor
Config. baseFloatZIndex = 10000;
// Set the shortcut key
Config. keystrokes = [
[CKEDITOR. ALT + 121, 'toolbarfo'], // obtain the focus
[CKEDITOR. ALT + 122, 'elementspathfocus '], // element focus
[CKEDITOR. SHIFT + 121, 'textmenu '], // text menu
[CKEDITOR. CTRL + 90, 'undo '], // undo
[CKEDITOR. CTRL + 89, 'redo '], // redo
[CKEDITOR. CTRL + CKEDITOR. SHIFT + 90, 'redo '], //
[CKEDITOR. CTRL + 76, 'link'], // link
[CKEDITOR. CTRL + 66, 'bold '], // bold
[CKEDITOR. CTRL + 73, 'italic '], // italic
[CKEDITOR. CTRL + 85, 'underline'], // underline
[CKEDITOR. ALT + 109, 'toolbarcollapse']
]
// The shortcut key may conflict with the browser shortcut key plugins/keystrokes/plugin. js.
Config. blockedKeystrokes = [
CKEDITOR. CTRL + 66,
CKEDITOR. CTRL + 73,
CKEDITOR. CTRL + 85
]
// Set the INS/colorbutton/plugin. js.
Config. colorButton_backStyle = {
Element: 'span ',
Styles: {'background-color': '# (color )'}
}
// Set the foreground value plugins/colorbutton/plugin. js
Config. colorButton_colors = '000000000, 8B4513, 2F4F4F, 008080,41580, 4B0082, 000,800, B22222, A52A2A, DAA520,
006400, 40E0D0, rjcd, 800080, 808080, F00, FF8C00, FFD700, 008000, 0FF, 00F, EE82EE,
A9A9A9, FFA07A, FFA500, FFFF00, 00FF00, AFEEEE, ADD8E6, DDA0DD, D3D3D3, FFF0F5,
FAEBD7, FFFFE0, F0FFF0, F0FFFF, F0F8FF, E6E6FA, fff'
// Whether the plugins/colorbutton/plugin. js option is displayed when the color is selected
Config. colorButton_enableMore = false
// Set the default value of the foreground color of the block to plugins/colorbutton/plugin. js.
Config. colorButton_foreStyle = {
Element: 'span ',
Styles: {'color': '# (color )'}
};
// Add the CSS file to use the relative path and the absolute path of the website.
Config. contentsCss = './contents.css ';
// Text direction
Config. contentsLangDirection = 'rtl '; // left to right
// Do not leave the CKeditor configuration file empty.
CKEDITOR. replace ('myfied', {customConfig: './config. js '});
// INS/dialog/plugin. js
Config. dialog_backgroundCoverColor = 'rgb (255,254,253) '; // reference for setting
Config. dialog_backgroundCoverColor = 'white' // default
// The opacity value of the background should be: 0.0 ~ Plugins/dialog/plugin. js between 1.0
Config. dialog_backgroundCoverOpacity = 0.5
// The unit of the adsorption distance of the border when the element is moved or changed: pixel plugins/dialog/plugin. js
Config. dialog_magnetDistance = 20;
// Whether to reject the local spelling check and prompt is rejected by default. Currently, only firefox and safari support plugins/wysiwygarea/plugin. js.
Config. disableNativeSpellChecker = true
// Edit a table. For example, Add rows or columns. Currently, only firefox supports plugins/wysiwygarea/plugin. js.
Config. disableNativeTableHandles = true; // disabled by default
// Whether to enable the function of changing the size of images and tables. config. disableObjectResizing = true;
Config. disableObjectResizing = false // enabled by default
// Set the HTML document type
Config.doc Type = '<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN"
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "';
// Whether to render plugins/editingblock/plugin. js for the editing area
Config. editingBlock = true;
// The tag generated by press enter in the editor
Config. enterMode = CKEDITOR. ENTER_P; // Optional: CKEDITOR. ENTER_BR or CKEDITOR. ENTER_DIV
// Whether to use HTML entities to output plugins/entities/plugin. js
Config. entities = true;
// Define more INS/entities/plugin. js entities
Config. entities_additional = '#39'; // where # is replaced &
// Whether to convert some hard-to-display characters to the corresponding HTML character plugins/entities/plugin. js
Config. entities_greek = true;
// Whether to convert some Latin characters to HTML plugins/entities/plugin. js
Config. entities_latin = true;
// Whether to convert some special characters to ASCII characters such as "This is Chinese: Chinese." to "This is Chinese: & #27721; & #35821 ;."
Plugins/entities/plugin. js
Config. entities_processNumerical = false;
// Add new component
Config. extraPlugins = 'myplugin'; // non-default example only
// Use the highlighted plugins/find/plugin. js during search
Config. find_highlight = {
Element: 'span ',
Styles: {'background-color': '# ff0', 'color':' # 00f '}
};
// Default INS/font/plugin. js
Config. font_defaultLabel = 'arial ';
// You can add common Chinese characters to the character set during font Editing: plugins, ins, and INS/font/plugin. js.
Config. font_names = 'arial; Times New Roman; Verdana ';
// Default style of text plugins/font/plugin. js
Config. font_style = {
Element: 'span ',
Styles: {'font-family ':' # (family )'},
Overrides: [{element: 'font', attributes: {'face': null}]
};
// Default font plugins/font/plugin. js
Config. fontSize_defaultLabel = '12px ';
// Optional font size during font Editing: plugins/font/plugin. js
Config. fontSize_sizes
= '8/8px; 9/9px; 10/10 px; 11/11 px; 12/12 px; 14/14 px; 16/16 px; 18/18 px; 20/20 px; 22/22 px; 24/24 px; 26/26 px; 28/28 px; 36/36 px; 48/48
Px; 72/72 px'
// Set the style plugins/font/plugin. js for the font size.
Config. fontSize_style = {
Element: 'span ',
Styles: {'font-size': '# (size )'},
Overrides: [{element: 'font', attributes: {'SIZE': null}]
};
// Whether to forcibly copy the content to remove the format plugins/pastetext/plugin. js
Config. forcePasteAsPlainText = false // not removed
// Whether to force "&" to replace "& amp;" plugins/htmldataprocessor/plugin. js
Config. forceSimpleAmpersand = false;
// Format the address tag plugins/format/plugin. js
Config. format_address = {element: 'address', attributes: {class: 'styledaddress '}};
// Automatically format the DIV tag plugins/format/plugin. js
Config. format_div = {element: 'div ', attributes: {class: 'normaldiv '}};
// Automatically format the H1 tag plugins/format/plugin. js
Config. format_h1 = {element: 'h1 ', attributes: {class: 'contenttitle1 '}};
// Automatically format the H2 tag plugins/format/plugin. js
Config. format_h2 = {element: 'h2 ', attributes: {class: 'contenttitle2 '}};
// Automatically format the H3 tag plugins/format/plugin. js
Config. format_h1 = {element: 'h3 ', attributes: {class: 'contenttitle3 '}};
// Automatically format the H4 tag plugins/format/plugin. js
Config. format_h1 = {element: 'h4 ', attributes: {class: 'contenttitle4 '}};
// Automatically format the H5 tag plugins/format/plugin. js
Config. format_h1 = {element: 'h5', attributes: {class: 'contenttitle5 '}};
// Automatically format the H6 tag plugins/format/plugin. js
Config. format_h1 = {element: 'h6 ', attributes: {class: 'contenttitle6 '}};
// Automatically format the P tag plugins/format/plugin. js
Config. format_p = {element: 'P', attributes: {class: 'normalpara '}};
// Automatically format the PRE Tag plugins/format/plugin. js
Config. format_pre = {element: 'pre', attributes: {class: 'code '}};
// The names of tags separated by semicolons are displayed on the toolbar. plugins/format/plugin. js
Config. format_tags = 'P; h1; h2; h3; h4; h5; h6; pre; address; div ';
// Whether the complete html editing mode is used. For example, the source code of the complete html editing mode includes the following tags: Config. fullPage = false;
// Whether to ignore null characters in a paragraph. If not, the character will be "" indicating plugins/wysiwygarea/plugin. js
Config. ignoreEmptyParagraph = true;
// Whether the <a> label plugins/image/plugin. js
Config. image_removeLinkByEmptyURL = true;
// A group of tag names separated by commas (,). The names are displayed in the hierarchy nesting in the lower left corner of plugins/menu/plugin. js.
Config. menu_groups
= 'Clipboard, form, tablecell, tablecellproperties, tablerow, tablecolumn, table, anchor, link, image, flash, checkbox, radio, te
Xtfield, hiddenfield, imagebutton, button, select, textarea ';
// Latency when the sub-menu is displayed. Unit: ms plugins/menu/plugin. js
Config. menu_subMenuDelay = 400;
// When the "new" command is executed, the content in the editor is plugins/newpage/plugin. js
Config. newpage_html = '';
// Whether to format plugins/pastefromword/plugin. js when copying text from word
Config. pasteFromWordIgnoreFontFace = true; // The default format is ignored.
// Whether to use the Config. pasteFromWordKeepsStructure = false;
// Whether to remove the plugins/pastefromword/plugin. js format when pasting content from the word
Config. pasteFromWordRemoveStyle = false;
// Format the output HTML content based on the background language type. The default value is null.
Config. protectedSource. push (/<? [SS] *?> /G); // PHP Code
Config. protectedSource. push (// g); // ASP Code
Config. protectedSource. push (/(] +> [s | S] *? </Asp: [^>] +>) | (] +/>)/gi); // ASP. Net Code
// The label inserted when the input is shift + Enter
Config. shiftEnterMode = CKEDITOR. ENTER_P; // Optional: CKEDITOR. ENTER_BR or CKEDITOR. ENTER_DIV
// Optional emoticon replacement character plugins/smiley/plugin. js.
Config. smiley_descriptions = [
':)', ':(', ';)', ': D',':/',': P ',
'','','','','','',
'',';(','','','','',
'', ': Kiss',''];
// Plugins/smiley/plugin. js
Config. smiley_images = [
Comment ',
Else ', 'Shades _
Smile.gif ',
Comment ',
'Broken_heart.gif ', 'kiss.gif'];
// INS/smiley/plugin. js
Config. smiley_path = 'ins INS/smiley/images /';
// When the page is loaded, check whether the edit box immediately obtains the focus plugins/editingblock/plugin. js plugins/editingblock/plugin. js.
Config. startupFocus = false;
// How to edit the source code and wysiwyg plugins/editingblock/plugin. js when loading.
Config. startupMode = 'wysiwyg ';
// Check whether the border plugins/showblocks/plugin. js of the box is displayed during loading.
Config. startupOutlineBlocks = false;
// Whether to load the Style File plugins/stylescombo/plugin. js.
Config. stylesCombo_stylesSet = 'default ';
// Optional
Config. stylesCombo_stylesSet = 'mystyles ';
Config. stylesCombo_stylesSet = 'mystyles:/editorstyles/styles. js ';
Config. stylesCombo_stylesSet = 'mystyles: http://www.example.com/editorstyles/styles.js ';
// Start index value
Config. tabIndex = 0;
// When you type a TAB, the number of spaces passed by the editor. (& nbsp;) when the value is 0, the focus will be removed from the plugins/tab/plugin. js edit box.
Config. tabSpaces = 0;
// Default template plugins/templates/plugin. js.
Config. templates = 'default ';
// The template file plugins/templates/plugin. js.
Config. templates_files = ['ins INS/templates/default. js']
// When the template is used, check whether plugins/templates/plugin. js is selected in the "edit content will be replaced" box.
Config. templates_replaceContent = true;
// Subject
Config. theme = 'default ';
// Undo record step count plugins/undo/plugin. js
Config. undoStackSize = 20;
// Integrate CKFinder in CKEditor. Make sure that the ckfinder path is selected correctly.
// CKFinder. SetupCKEditor (null, '/ckfinder /');
Ii. Tips
1. Set the editor on the page instantly
<Script type = "text/javascript">
// Example 1: Set the toolbar to the basic toolbar and the height to 70
CKEDITOR. replace ('<% = tbLink. ClientID. Replace ("_", "$") %> ',
{Toolbar: 'Basic ', height: 70 });
// Example 2: the toolbar is of the custom type.
CKEDITOR. replace ('editor1 ',
{
Toolbar:
[
// Bold and italic. The underline goes through the line subscript to mark the word.
['Bold ', 'italic', 'underline', 'strike', 'subscript', 'superscript'],
// The number list Object List reduces indentation and increases indentation
['Numberlist', 'bulletedlist', '-', 'outdent ', 'indent'],
// Align left to center and align right to both ends
['Justifyleft', 'justifycenter', 'justifyright', 'justifyblock'],
// Unlink the hyperlink.
['Link', 'unlink', 'anchor '],
// A special character paging character for the horizontal expression in the flash table
['Image', 'flash', 'table', 'horizontalrule', 'smiley ', 'specialchar', 'pagebreak'],
'/',
// Font size in style format
['Styles ', 'format', 'font', 'fontsize'],
// Text color background color
['Textcolor', 'bgcolor'],
// Display the block in full screen
['Delimiter', 'showbucket', '-']
]
}
);
</Script>
Iii. Simplified ckeditor
When deployed on a Web server, the following folders and files can be deleted:
/_ Samples: Sample folder;
/_ Source: Uncompressed source program;
/Lang folder files except zh-cn.js, en. js (you can also retain files in other languages as needed );
Changes.html(update later, install.html( liclic, license.html (license) under the root directory );
The skin that is not required in the/skins directory is generally V2 (simple and simple). If you only retain V2, you must specify the skin in config. js.
These things are free of charge. Using fckeditor saves the reference of the class library fckdetior. dll and directly uses js !....... But at this time
The upload function is unavailable! In the past, fckefitor integrated and split his previous functions into two parts: ckeditor and ckfinder. The latter part requires money for the upload function !! Again
Search for it online. There is a method to crack it. Put ckfinder into the project root directory !! Added
<Script type = "text/javascript">
// If it is a server-side control used in the ASP. NET environment <TextBox>
Var editor = CKEDITOR. replace ('tbcontent ');
CKFinder. SetupCKEditor (editor, '/ckfinder/'); (ckfinder added based on ckeditor)
</Script>
The error page is uploaded! Then I paid a lot of twists and turns:
Ckfinder/config:
Public override bool CheckAuthentication ()
{
Return true;
}
Ckeditror/config. js:
CKEDITOR. editorConfig = function (config)
{
// Define changes to default configuration here. For example:
// Config. language = 'Fr ';
// Config. uiColor = '# AADC6E ';
Config. filebrowserBrowseUrl = location. hash + '../ckfinder/ckfinder.html ';
Config. filebrowserImageBrowseUrl = location. hash + '../ckfinder/ckfinder.html? Type = Images ';
Config. filebrowserFlashBrowseUrl = location. hash + '../ckfinder/ckfinder.html? Type = Flash ';
Config. filebrowserUploadUrl = location. hash + '../ckfinder/core/connector/aspx/connector. aspx?
Command = QuickUpload & type = Files ';
Config. filebrowserImageUploadUrl = location. hash + '../ckfinder/core/connector/aspx/connector. aspx?
Command = QuickUpload & type = Images ';
Config. filebrowserFlashUploadUrl = location. hash + '../ckfinder/core/connector/aspx/connector. aspx?
Command = QuickUpload & type = Flash ';
// Config. filebrowser1_wwidth = '201312 ';
// Config. filebrowserWindowHeight = '201312 ';
};
The color part is prone to errors. At first, I didn't put... (root directory)
After logging on, you will be here. After an error occurs, add... in front to start from the root directory of the project. Solve the error !! Last
It is cracked:
Here is a brief description of my cracking steps: (from others)
1. Use the firebug plug-in the FF browser;
2. Open the installed file browser and find that the ckfinder.html file is used;
3366in ckfinder.html, we found that an iframe is written into the cell <td id = "iO">, and src is core/pages/ckffiles.html;
4. Continue to open the iframe node. There is one <tr> NO id between the <tr id = "he"> and <tr id = "qu"> labels, the one who asks you to pay is here ~;
5. Open the core/pages/ckffiles.html source file and find that there is nothing between <tr id = "he"> and <tr id = "qu">, this <tr> is generated by code;
6. Next, you can find the answer in CKfinder's js. Fortunately, FCKeditor is still familiar with it and can be found directly under the ckfindercorejs folder;
7. Two js files under this folder are used for IE, and the other for other browsers. This is the same as FCKeditor;
8. Open ckfinder_gecko.js and search for "qu". eF = B. getElementById ('qu') soon;
9. Check later
If (1 = (dK. indexOf (AB. bW. substr (1, 1) % 5) & window. top [qC + '143141x74x69157x6e '] [qF + '163x74']. toLowerCase
(). Replace (s4 ,"")! = AB. eo. replace (s4, "") | AB. bW. substr (3, 1 )! = DK. substr (dK. indexOf (AB. bW. substr (0, 1) + dK. indexOf
(AB. bW. substr (2, 1) * 9) % (dK. length-1), 1) {en. call (window, qo) ;}; eF. appendChild (D );
The last appendChild section ~, It's almost here;
10. When there are a lot of conditions above, only en. call (window, qo) is executed; it's not what it is ~;
11. Delete en. call (window, qo); or * en. call (window, qo); *. Refresh the page to see if it is gone ~;
12. After modification, modify ckfinder_ie.js.
The whole CKfinder is simply cracked ~, If you think this is easy to use, you 'd better buy a serial number for some money. The official team can help you to save a lot of time.