How to Use TinyMCE (Rich Text Editor) in Asp. Net

Source: Internet
Author: User

Currently, FCKEditor is widely used for Web pages. The implementation principle is to add an iframe to the place where you want to add FCKEditor and direct its src to FCKeditor/editor/fckeditor.html? To implement the editing area.

It seems a little bloated as a whole. So I found another HTML editor, including FreeTextBox and TinyMCE. Here I will introduce TinyMCE. This is a JS-based Editor, which is described as follows:

TinyMCE is a platform independent web based Javascript html wysiwyg editor control released as Open Source under LGPL by Moxiecode Systems AB. it has the ability to convert html textarea fields or other HTML elements to editor instances. tinyMCE is very easy to integrate into other Content Management Systems.

Advantages (my first impression ):

1. The generated code is concise, and the default skin is simple and clear;
2. Easy to use in Asp. Net without too many settings.
The use of Asp. Net is actually quite simple, but it takes about 1 ~ 2 hours, so write it down here to help people who encounter the same problem

Download TinyMCE (http://tinymce.moxiecode.com/download.php) from the official website and copy the jscripts directory to your website directory.

Assume that the editor is required for a certain part of your a. aspx page, add

<Asp: TextBox ID = "brand" TextMode = "MultiLine" runat = "server"/>

Add the following content to the header:

<Script src = "../js/tiny_mce/tiny_mce_src.js" type = "text/javascript"> </script>
<Script language = "javascript" type = "text/javascript">
TinyMCE. init ({
Mode: "textareas ",
Theme: "simple"
});
</Script>

Run the page to see an editor, and you can use brand. text to get the value (You may see an error prompt, then you only need. add ValidateRequest = "false" to the <% @ Page at the beginning of aspx)

Of course, if you have multiple textareas on your page, you may only want to replace one with an editor, then the above mode line is changed:

Mode: "exact", elements: "corresponding ID"
For other usage instructions, go to the official website.
Collection of related resources: TinyMCE Chinese manual http://www.inpeck.com/TinyMceManual/

Several useful plug-ins in tinymce: http://joom.org.ru/home/article/14-tinymce-plugin.html

Online Editor TinyMCE 3 Simplified Chinese Language Pack: http://www.metalstar.net /? D = 86

Tinymce small Chinese fonts solution http://www.humker.com/2008/03/07/tinymce-chinese-font-size

 

Related Article

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.

A Free Trial That Lets You Build Big!

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

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

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

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