Informações:
Autor: Daemon
Funcionalidade: Todas as Versões

---

neste tutorial iremos mostrá-lo como é simples e fácil, adicionar novos comandos ao editor,lembrando que é o terceiro topico que diz a mesma coisa, porém de modos diferentes... (sempre inovando e dando mais possibilidade)

Acesse:

Painel de Controle ☛ Modulos ☛ Html e Javascript ☛ Gestão dos codigos Javascript

Crie um novo Javascript com investimento em todas as paginas com esse codigo:

Código:

/*
* Código: Inserir novos comandos no editor.
* Data de criação: 26/12/2014.
* Autor: Daemon.
* Versão: 1.0.
* Acesse: http://bestskins.net
* Não distribuir, ou remover os créditos do autor.
*/

var add_BBCode = {
      '1': {bbcode: 'sucesso'},
      '2': {bbcode: 'aviso'},
      '3': {bbcode: 'infos'}
};

$(document).on('ready', function() {
var newDrop = '<div class="sceditor-dropdown sceditor-drop" style="display: none;">' +
              '  <div>' +
              '    <label unselectable="on">Inserir...</label>' +
              '    <select id="drop_value">' +
              '        <option value="" selected>--------------</option>' +
              '    </select>' +
              '  </div>' +
              '  <div>' +
              '    <label unselectable="on">Descrição (opcional):</label>' +
              '    <input type="text" id="desc_value" />' +
              '  </div>' +
              '  <div>' +
              '    <input type="button" class="button" value="Inserir" onclick="bbcode_drop()">' +
              '  </div>' +
              '</div>';
$('body').append(newDrop);
    $.each(add_BBCode, function(order, object) {
      bbcode = object.bbcode;
      $('#drop_value').append($('<option>', {
                    value: bbcode
      }).text(bbcode));
    });
$('<a class="sceditor-button" id="custom_command" onclick="toggle_dropbox(this)"><div style="background-image: url(http://i.imgur.com/EyQscqP.png);opacity: 1 !important;">CM</div></a>').insertBefore('.sceditor-button-quote');
});
function toggle_dropbox(bs) {
  var box = $('.sceditor-drop');
  if(box.is(':visible')) {
      box.hide();
  } else {
      box.css({
        'left': $(bs).offset().left,
        'top': $(bs).offset().top + $(bs).outerHeight(),
          'text-align': 'left'
      }).show();
  }
};
function bbcode_drop() {
    var box = $('.sceditor-drop');
    var bbcode = box.find('#drop_value').val();
    var nota = box.find('#desc_value').val();
    var editor = $('#text_editor_textarea').sceditor('instance');
    if(bbcode.length > 0) {
      if(nota.length > 0) {
        editor.insert('[table class="' + bbcode + '"][tr][td]' + nota + '[/td][/tr][/table]');
      } else {
        editor.insert('[table class="' + bbcode + '"][tr][td]','[/td][/tr][/table]');
      }
    }
    box.find('input[type="text"]').val('');
    box.hide();
};

Feito isto acesse:

Painel de Controle ☛ Visualização ☛ Imagens e Cores ☛ Cores ☛ Folha de Estilo

Adicione esse codigo CSS em sua folha de estilo:

Código:

.postbody .sucesso, .postbody .aviso, .postbody .infos {
width: 75%;
margin: 8px 0;
padding: 8px;
color: #fefefe;
-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.4);
-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.4);
-khtml-box-shadow: 0 1px 5px rgba(0,0,0,0.4);
box-shadow: 0 1px 5px rgba(0,0,0,0.4);
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-khtml-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border-style: solid;
border-width: 0;
position: relative;
font: 14px/20px Museo300Regular,Helvetica,Arial,sans-serif;
}
.postbody .infos {
background-color: #2fa9f6;
}
.postbody .sucesso {
background-color: #7EB62E;
}
.postbody .aviso {
background-color: #BE1B00;
}

Resultado: