Ckeditor3.0.1 Image Upload Function

Ckeditor3.0.1 Image Upload Function

Ckeditro itself does not have the upload function, it needs to use the component ckfinder http://ckfinder.com/

It's a. Net version.

Easy Configuration

Ckeditor. Replace ('text box for which you want to enable the editor ',
{
Filebrowserbrowseurl: '/ckfinder/ckfinder.html', // enable the browsing Function
FilebrowserimagebrowseurL: '/ckfinder/ckfinder.html? Type = images ',
FilebrowserflashbrowseurL: '/ckfinder/ckfinder.html? Type = flash ',
Filebrowseruploadurl: '/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = files ',
FilebrowserimageuploadurL: '/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = images ',
FilebrowserflashuploadurL: '/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = flash'
}
); Of course, you can also use the method described last time.

Configure in config. js

Config. filebrowserbrowseurl = "/ckfinder/ckfinder.html ";
Config. filebrowserimagebrowseurL = "/ckfinder/ckfinder.html? Type = images ";
Config. filebrowserflashbrowseurL = "/ckfinder/ckfinder.html? Type = flash ";
Config. filebrowseruploadurl = "/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = Files "; 
Config. filebrowserimageuploadurL = "/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = images ";
Config. filebrowserflashuploadurL = "/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = flash ";

All of the above are acceptable.

After configuration, modify config. ascx in ckfinder.

Returns true in checkauthentication (). Otherwise, the upload fails and verification is required.

In setconfig (), the baseurl path is the upload path. modify it.

Remember to reference the BLL file in ckfinder.

I. ckeditor 3.0.1 simplified

Before simplification: 4.52 m Simplified: 853 K
1. Delete the _ samples and _ source folders, which are sample files and uncompressed sources respectively.Program
2. Delete all language files under EN. js except the zh-cn.js under the Lang folder. Delete as needed
3.delete changes.html(update later versions, install.html(installation instructions, license.html (license ).
4. Delete unnecessary skins in the skins directory. I usually use V2 (simple. Simple) // If only V2 is retained, you must specify the skin in config. js.

Ii. ckeditor 3.0.1 file configuration path
1./ckeditor. js Core File, which needs to be loaded
2./config. js   Configuration file, parameter configuration is completed here
3./plugins/smiley/images emojis.

3. ckeditor application (. NET environment)
  1. Reference JS scripts
  <SCRIPT type = "text/JavaScript" src = "ckeditor/ckeditor. js"> </SCRIPT>
  2. Replace the corresponding control with the editor.Code
  <Asp: textbox id = "textbox1" runat = "server" rows = "10" textmode = "multiline"> </ASP: textbox>
  <SCRIPT type = "text/JavaScript"> ckeditor. Replace ('textbox1') </SCRIPT>

Iv. ckeditor configuration (config. js configuration file)
    Description of config. js Parameters

// Whether to update the data in the element automatically when a form containing the editor is submitted
Config. autoupdateelement = true

// The Z-index value of the Editor
Config. basefloatzindex = 10000

// Set whether to use an absolute directory or a relative directory.
Config. basehref =''

// Set the shortcut keys from top to bottom: Get focus, element focus, text menu, undo, redo, redo, Link, bold, italic, and underline
Config. keystrokes =
[
   [Ckeditor. Alt + 121, 'toolbarfocal '],
   [Ckeditor. Alt + 122, 'elementspathfocal '],

   [Ckeditor. Shift + 121, 'textmenu '],

   [Ckeditor. CTRL + 90, 'undo '],
   [Ckeditor. CTRL + 89, 'redo '],
   [Ckeditor. CTRL + ckeditor. Shift + 90, 'redo '],

   [Ckeditor. CTRL + 76, 'link'],

   [Ckeditor. CTRL + 66, 'bold '],
   [Ckeditor. CTRL + 73, 'italic '],
   [Ckeditor. CTRL + 85, '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. california = '0000000, 8b4513, 2f4f4f, California, 4b0082, 000,800, b22222, a52a2a, daa520, 696969, California, 0000cd, California, f00, ff8c00, ffd700, 006400, 0ff, 00f, ee82ee, clerk, ffa07a, ffa500, FFFF00, 00ff00, afeeee, add8e6, dda0dd, clerk, fff0f5, faebd7, clerk, f0fff0, f0ffff, f0f8ff, comment, 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 '});

// Set the language configuration on the interface to 'zh-cn '.
Config. defaultlanguage = 'en ';

// 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%22%3e'

// 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 into 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; 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: <HTML> <body> Config. fullpage = false

// Editor height
Config. Height = 200

// 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

// Select "ZH-CN" as the actual language on the interface"
Config. Language = 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, textfield, 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 ignore.

// 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 HTML content corresponding to the background Language
Config. protectedsource. Push (/<\? [\ S] *? \?> /G ); // PHP code
Config. protectedsource. Push (// G ); // ASP code
Config. protectedsource. Push (/(] +> [\ s | \ s] *? <\/ASP: [^ \>] +>) | (] + \/>)/Gi ); // ASP. NET code
Empty by default

// Whether plugins/resize/plugin. js can be changed.
Config. resize_enabled = true

// Change the maximum size of plugins/resize/plugin. js
Config. resize_maxheight = 3000;

// Change the maximum size of plugins/resize/plugin. js
Config. resize_maxwidth = 3000;

// Plugins/resize/plugin. js
Config. resize_minheight = 250;

// Change the minimum size of plugins/resize/plugin. js
Config. resize_minwidth = 750;

// When input: Shift + enter is the inserted tag
Config. shiftentermode = ckeditor. enter_p; // Optional: ckeditor. enter_br or ckeditor. enter_div

// Optional interface package
Config. Skin = 'default ';

// Optional emoticon replacement character plugins/smiley/plugin. js.
Config. smiley_descriptions = [
   ':)', ':(', ';)', ': D',':/',': P ',
   '','','','','','',
   '',';(','','','','',
   '', ': Kiss',''];

// Plugins/smiley/plugin. js
Config. smiley_images = [
   Comment ',
   Comment ',
   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 ';

// Use the toolbar plugins/toolbar/plugin. js
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']
];

// Can the toolbar be scaled down? plugins/toolbar/plugin. js.
Config. toolbarcancollapse = true

// INS/toolbar/plugin. js
Config. toolbarlocation = 'top'; // Optional: Bottom

// Whether to expand plugins/toolbar/plugin. js by default in the toolbar
Config. toolbarstartupexpanded = true;

// Undo record step count plugins/Undo/plugin. js
Config. undostacksize = 20

// Editor width plugins/Undo/plugin. js
Config. width = ""

Insert Image

Ckeditor. Instances. content. inserthtml (" ");

Set Value and Value

Set Value

Ckeditor. Instances. content. setdata ("Qianyi network"); // content is the first parameter value of ckeditor. replace.

Or

VaR editor = ckeditor. Replace ("content ");
Editor. setdata ("Qianyi network ");

Set the editor skin and width and height

<Textarea Cols = "90" rows = "10" id = "content" name = "content"> cftea </textarea>
<SCRIPT type = "text/JavaScript" src = "ckeditor/ckeditor. js"> </SCRIPT>
<SCRIPT type = "text/JavaScript">
<! --
   Ckeditor. Replace ("content ",
     {
         Skin: "Kama", width: 700, height: 300
     });
// -->
</SCRIPT>

 

This article from the csdn blog, reproduced please indicate the source: http://blog.csdn.net/lulu_jiang/archive/2010/04/27/5532345.aspxaspx