Hello Friends....
Welcome to this Blog...This Blog is specially for the .Net Developers where all developers can discuss the .Net and Sql Articles.
"And will you succeed? Yes! You will indeed!(98 and 3/4 percent guaranteed)."

Monday, January 24, 2011

Embed Tiny Editor in Your Web Application:

1. First of all open your Web page in your application in which you want to embed the
Editor.

2. This editor is know as Tiny Editor which has nice features by which the user can enter his/her text in stylish way by embedding smileyes, embed photos.

3. We can set font family, Font Size, Cut, Copy, Paste and many other functions are there by which the text can be represented in a better way.


4. Now Steps to embed the Tiny Editor in you web page are:

a: Drag and Drop Textbox and give id to id name RichTextBox.

b: Set the Property of Textbox:-TextMode Property to Multiline.

c: Drop one Label to page, we transfer the text from RichText Box to Label when we store the text to database.

d: Put this Code in your Head Tag:

 <script type="text/javascript" src="tinymce/jscripts/tiny_mce/tiny_mce.js"></script>

<script type="text/javascript">
   tinyMCE.init(
    {
        mode : "textareas",
        theme : "advanced",
        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_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : false,
        template_external_list_url : "js/template_list.js",
        external_link_list_url : "js/link_list.js",
        external_image_list_url : "js/image_list.js",
        media_external_list_url : "js/media_list.js"
    });
</script>

This code include the path of Java Script File of tiny editor.
5. Download the Tiny Editor from the path which I am giving you below:

Link:  http://tinymce.moxiecode.com/download/download.php

6. Put the Downloaded Folder into you Website. This Folder contains all editor files including JS File.

We have given the link of the Editor JS File in 4(d) Point.

7. Now Run your Webpage and see Tiny Editor Placed there.



Enjoy Your Coding:

IF any Query then you can ask me here only.

4 comments:

  1. hows they work....
    and also what the benfit to us...

    ReplyDelete
  2. Re:mahindersigh:

    u can use this editor in .net based websites. When you make any website in asp.net then try this if you need editor..i have given you the steps of making this editor.

    ReplyDelete
    Replies
    1. There is a Html Text editor in AJAX for same purpose which contains for features that this

      Here is link :
      http://www.asp.net/web-forms/tutorials/ajax-control-toolkit/htmleditor/how-do-i-use-the-html-editor-control-cs

      Thanks

      Delete
  3. yes vaibhav there is HTML text editor in Ajax ..but this is an another approach .....

    ReplyDelete