no hay problema, si pero como veo que no quiere esa forma no se si la usara, así que hasta que responda me quedo con la idea solo como una idea xD.
-----
Bueno ya logre hacer lo que tu quieres el problema es que no logro colocar el selector, como es a esto me refiero que cuando le das click en la pestaña como tu le llamas, las opciones me salen en la parte de fuente y el botón queda seleccionado. así que hasta que vea como arreglar eso espera a ver quien lo resuelve primero.
-----
ve al editor.js y busca
// An array of video services to be shown (youtube, vimeo, etc)
this.videos = new Object();
this.videos["dailymotion"] = this.options.lang.video_dailymotion;
this.videos["googlevideo"] = this.options.lang.video_googlevideo;
this.videos["metacafe"] = this.options.lang.video_metacafe;
this.videos["myspacetv"] = this.options.lang.video_myspacetv;
this.videos["vimeo"] = this.options.lang.video_vimeo;
this.videos["yahoo"] = this.options.lang.video_yahoo;
this.videos["youtube"] = this.options.lang.video_youtube;
agrega después
// este sera tu array donde colocaras los valores
this.Tab = new Object();
this.Tab["http://imagen.jpg"] = "header";
this.Tab["http://imagen.jpg"] = "body";
aquí puedes agregar más arreglos esto es a tu gusto.
después busca
{type: 'button', name: 'video', insert: 'video', image: 'television.gif', dropdown: true, title: this.options.lang.title_video, options: this.videos},
y agrega despues
{type: 'button', name: 'Tab', insert: 'Tab', image: 'tuimagen.gif', dropdown: true, title: 'Varios', options: this.Tab}
si deseas no agreges nada en el titulo así se mostrara como el de vídeos.
ahora busca busca
insertIMG: function()
{
image = prompt(this.options.lang.enter_image, "http://");
if(image)
{
this.performInsert("[img]"+image+"[/img]", "", true);
}
},
y agrega después
insertTab: function(type)
{
this.performInsert("[img]"+type+"[/img]", "", true);
this.setDropDownMenuActiveItem($('editor_item_Tab'), 0);
},
busca
insertMyCode: function(code, extra)
{
this.restartEditorSelection();
switch(code)
{
case "list":
this.insertList(extra);
break;
case "url":
this.insertURL();
break;
case "image":
this.insertIMG();
break;
case "email":
this.insertEmail();
break;
case "video":
this.insertVideo(extra);
break;
y agrega después
case "Tab":
this.insertTab(extra);
break;
ahora ve a el estilo (stylesheet.css) del editor por defecto o el diseño de office.
busca
.messageEditor .toolbar_button_video {
position: relative;
}
agrega después
.messageEditor .toolbar_button_Tab {
position: relative;
}
y ahora solo agrega la imagen del botón y ya esta.
a mi me funciono perfecto, no se si da error en otros navegadores ya que solo lo he probado en google chrome.
Cualquier cosa me avisan