How I can add multi TinyMCE editors with different config for each one?

I want to add multi TinyMCE editors an开发者_运维知识库d each one has its own configuration in one page?

How I can do it?

---

You could do something like this:

jQuery version:

$('textarea.editor1').tinymce(
{
    script_url : '../admin/tiny_mce/tiny_mce.js',
    theme : "simple",
    plugins : "", // put plugins here
    setup : function(ed) 
    {
         ed.onInit.add(function(ed)
        {

        });             
    }
});

$('textarea.editor2').tinymce(
{
    script_url : '../admin/tiny_mce/tiny_mce.js',
    theme : "simple",
    plugins : "", // put plugins here
    setup : function(ed) 
    {
         ed.onInit.add(function(ed)
        {

        });             
    }
});

Non-jQuery version:

tinyMCE.init(
{
    mode : "textareas",
    theme : "simple",
    editor_selector : "editor1"
});

tinyMCE.init(
   {
       mode : "textareas",
    theme : "simple",
    editor_selector : "editor2"

   });

---

This is easy to achieve. I use the jQuery lib to save code, but it is easy to create this code without jQuery. Supposed you have html elements (i.e. textareas) with ids "my_id1" and "my_id1", that you wish to get a tinymce for all you need to do is:

var config_tinymce_1 = {

        plugins :"save",

        theme_advanced_buttons1 : "bold,italic,underline,save",
        theme_advanced_buttons2 : "",
        ...
};


var config_tinymce_2 = {

        plugins :"save",

        theme_advanced_buttons1 : "save",
        theme_advanced_buttons2 : "",
        ...
};

$(document).ready(function(){
        init_obj_1 = {element_id:'my_id1', window: window};
        $.extend(true, init_obj_1, config_tinymce_1);
        tinyMCE.execCommand('mceAddFrameControl',false, init_obj_1);

        init_obj_2 = {element_id:'my_id2', window: window};
        $.extend(true, init_obj_2, config_tinymce_2);
        tinyMCE.execCommand('mceAddFrameControl',false, init_obj_2);
});