Tinymce-JavaScript WYSIWYG visual editor

tinymce-JavaScript WYSIWYG visual editor.
Home: http://tinymce.moxiecode.com/
API documentation: http://tinymce.moxiecode.com/js/tinymce/docs/api/index.html
documentation: http://wiki.moxiecode.com/index.php/TinyMCE:Index
Chinese manual: http://www.inpeck.com/TinyMceManual/
compressed version (for production environments ): http://wiki.moxiecode.com/index.php/TinyMCE:Compressor
1. features:
1 ). easy to integrate
2 ). customizable
3 ). browserfriendly
4 ). lightweight
5 ). ajax compatible
6 ). international
7 ). open source

2. compressed version (gzip) installation (for production environments ):
1) download tinymce compressor. net
Http://nchc.dl.sourceforge.net/project/tinymce/TinyMCE%20Compressor%20.NET/2.0.2/tinymce_compressor_net_2_0_2.zip
2) Copy tiny_mce_gzip.js and tiny_mce_gzip.aspx to the directory tiny_mce (containing tiny_mce.js.
3). Copy icsharpcode. sharpziplib. DLL to the Web application.ProgramBin directory.
4). Remove the current script tag <SCRIPT type = "text/JavaScript" src = "tinymce/jscripts/tiny_mce/tiny_mce.js"> </SCRIPT>
5) Add a new gzip script tag <SCRIPT type = "text/JavaScript" src = "tinymce/jscripts/tiny_mce/tiny_mce_gzip.js"> </SCRIPT>.
6) adding a new gzip version of the initialization call will tell the compressed file in the output.

Example of initialization:
The example below will pack both themes and all plugins into one file/steam. remove the things you don't need or add you custom plugins to the settings below. remember that the tinymce_gz.init call must be placed in it's own script tag.
<SCRIPT type = "text/JavaScript" src = "tinymce/jscripts/tiny_mce/tiny_mce_gzip.js"> </SCRIPT>
<SCRIPT type = "text/JavaScript">
Tinymce_gz.init ({
Plugins: 'style, layer, table, save, advhr, advimage, advlink, emotions, iespell, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras ',
Themes: 'simple, advanced ',
Ages: 'en ',
Disk_cache: True,
Debug: false
});
</SCRIPT>
<SCRIPT type = "text/JavaScript">
Tinymce. INIT ({
... Your normal init ..
});
</SCRIPT>
Note:
1). To remove a plugin, remember to remove it both from tinymce_gz.init and tinymce. init.
2). To add a plugin, remember to add it both to the tinymce_gz.init and the tinymce. init CILS.

3. Initialization Configuration parameters:
Http://wiki.moxiecode.com/index.php/TinyMCE:Configuration
All configuration parameters are placed in tinymce. INIT () JavaScript calls.
Mode: "textareas"
Textareas: After the page is loaded, convert all textareas elements into an editor.
Specific_textareas: omitted
Exact: Convert the determined elements into the editor. Specified by the elements option. It can be a divs or textareas element.
None: Do not convert any element. Later, you can call tinymce.exe ccommand ("mceaddcontrol", true, "ID") on the page. The function converts the elements to the editor.
Example:
Tinymce. INIT ({
...
Mode: "exact ",
Elements: "elm1, elm2"
});
<Textarea id = "elm1 "...

Reference: http://www.iwms.net/n2065c17.aspx
The Chinese font in the editor is too small:
Modify: the first line of the jscripts \ tiny_mce \ themes \ Advanced \ skins \ Default \ content.css file:
Body, TD, pre {color: #000; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 13px; margin: 8px ;}
Font-size: the attribute value. If you use another topic, modify the corresponding file.

4. Chinese Language Pack
The Language Pack downloaded from the tinymce official website,
After installation, it is a traditional Chinese version.

I was so upset that I had to convert it again.

If necessary, click tinymce Simplified Chinese pack to download the package.

If the Chinese font size of tinymce is not displayed properly, you can search for font-size: 10px in all CSS files under the tinymce directory, and replace font-size: 11px with font-size: 12 PX; the Chinese font can be displayed normally.

 Here you can download to tinymce3 Chinese package http://services.moxiecode.com/i18n Download Note, is to first check the front box, and then press the Download button below, rather than the XML.
I made a simplified Chinese package because tinymce requires that the language code must comply with the ISO 639-1 international coding standard. The Chinese code can only be Zh, it is not in simplified or traditional Chinese format. In order not to overwrite the original traditional package, I also played a small slide, wrote the Language Pack code as CH, and passed it on. Hey hey, CH stands for the "Chamorro/Chamoro" language. It is estimated that the Xia Moro people haven't used tinymce for the time being. If you want to use a simplified Chinese package, let's go to the Chamorro language on that page. Haha.
During installation, extract the files in the downloaded compressed package to the Javascript/tiny_mce directory and prompt that the file with the same name can be overwritten.
During use, add a line of language: "CH" to the tinymce initialization statement tinymce. init on the page.

Complete button Configuration:

Tinymce. INIT ({
// Basic options:
Mode: " Textareas " ,
Theme: " Advanced " ,
Language: " ZH " , // Chinese Language Pack
Plugins: " Safari, spellchecker, pagebreak, style, layer, table, save, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template, imagemanager, filemanager " ,

// Theme options)
Theme_advanced_buttons1: " Save, newdocument, |, bold, italic, underline, strikethrough, |, justifyleft, justifycenter, justifyright, justifyfull, |, styleselect, formatselect, fontselect, fontsizeselect " , // Button in the second line of the toolbar | it is a button Separator
Theme_advanced_buttons2: " Cut, copy, paste, pastetext, pasteword, |, search, replace, |, bullist, numlist, |, outdent, indent, BLOCKQUOTE, |, undo, redo, |, link, unlink, anchor, image, cleanup, help, code, |, insertdate, inserttime, preview, |, forecolor, backcolor " , // Button in the third row of the toolbar
Theme_advanced_buttons3: " Tablecontrols, |, HR, removeformat, visualaid, |, sub, sup, |, charmap, emotions, iespell, media, advhr, |, print, |, LTr, RTL, |, fullscreen " , // Button in the third row of the toolbar
Theme_advanced_buttons4: " Insertlayer, moveforward, movebackward, absolute, |, styleprops, spellchecker, |, cite, abbr, metrics, Del, INS, attribs, |, visualchars, nonbreaking, template, BLOCKQUOTE, pagebreak, |, insertfile, insertimage " , // Button in the fourth row of the toolbar
Theme_advanced_toolbar_location: " Top " , // Position of the tool button bar,
Theme_advanced_toolbar_align: " Left " , // Horizontal Alignment of tool button bar
Theme_advanced_statusbar_location: " Bottom " , // Editor status bar position
Theme_advanced_resizing: True, // Set whether the editor size can be changed
Theme_advanced_fonts: "=; Arial = Arial, Helvetica, sans-serif; comic Sans MS = Comic Sans MS, sans-serif; Courier New = Courier New, courier; tahoma = tahoma, Arial, Helvetica, sans-serif; Times New Roman = Times New Roman, times; verdana = verdana, Geneva; webdings = webdings; wingdings = wingdings, ZKP dingbats ", // set the font
Theme_advanced_resize_horizontal: false // you can specify whether to change the size horizontally.
});