Olá, todos os dados fornecidos tinham erro de syntax em suas composições, estarei a forneceu o conserto dos mesmos:
Para sua JS, crie um módulo investido nos
tópicos:
Código:
jQuery(function(){
jQuery(function(){
jQuery('<a class="sceditor-button sceditor-button-sucesso" unselectable="on" title="Sucesso"><div unselectable="on" style="background-image:url(http://i.imgur.com/EISZPwN.png)">Sucesso</div></a>').insertBefore('.sceditor-button-size').click(function(){
jQuery('#text_editor_textarea').sceditor("instance").insertText("[table class=sucesso][tr][td]","[/td][/tr][/table]");
});
jQuery('<a class="sceditor-button sceditor-button-alerta" unselectable="on" title="Alerta"><div unselectable="on" style="background-image:url(http://i.imgur.com/lMsD0nE.png)">Alerta</div></a>').insertAfter('.sceditor-button-sucesso').click(function(){
jQuery('#text_editor_textarea').sceditor("instance").insertText("[table class=alerta][tr][td]","[/td][/tr][/table]");
});
jQuery('<a class="sceditor-button sceditor-button-aviso" unselectable="on" title="Aviso"><div unselectable="on" style="background-image:url(http://i.imgur.com/cI8SnOI.png)">Aviso</div></a>').insertAfter('.sceditor-button-alerta').click(function(){
jQuery('#text_editor_textarea').sceditor("instance").insertText("[table class=aviso][tr][td]","[/td][/tr][/table]");
});
jQuery('<a class="sceditor-button sceditor-button-info" unselectable="on" title="Informação"><div unselectable="on" style="background-image:url(http://i.imgur.com/40zM1qS.png)">Informação</div></a>').insertAfter('.sceditor-button-aviso').click(function(){
jQuery('#text_editor_textarea').sceditor("instance").insertText("[table class=infos][tr][td]","[/td][/tr][/table]");
});
});
});
A seguir, invista isto em sua folha CSS:
Código:
/*mensagens personalizadas*/
.infos {
background-color: #333333;
background-image: url("http://i1135.photobucket.com/albums/m622/Mazeko1/alertaaviso.png");
background-position: 10px center;
background-repeat: no-repeat;
border-style: solid;
border-width: 1px 1px 1px 4px;
color: white;
margin: 10px 0;
padding: 15px 10px 15px 60px;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5) !important;
border-radius: 0px 0px 0px 0px;
border-color: #000000;
padding: 50px;
}
.sucesso {
background-color: #ACD758;
background-image: url("http://i1135.photobucket.com/albums/m622/Mazeko1/Check.png");
background-position: 10px center;
background-repeat: no-repeat;
border-style: solid;
border-width: 1px 1px 1px 4px;
color: darkgreen;
margin: 10px 0;
padding: 15px 10px 15px 60px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) !important;
border-radius: 0px 0px 0px 0px;
border-color: #659B10;
padding: 50px;
}
.alerta {
background-color: #BDE5F8;
background-image: url("http://i1135.photobucket.com/albums/m622/Mazeko1/alertaaviso.png");
background-position: 10px center;
background-repeat: no-repeat;
border-style: solid;
border-width: 1px 1px 1px 4px;
color: darkcyan;
margin: 10px 0;
padding: 15px 10px 15px 60px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) !important;
border-radius: 0px 0px 0px 0px;
border-color: #31B7C7;
padding: 50px;
}
.aviso {
background-color: #FF5C5C;
background-image: url("http://i1135.photobucket.com/albums/m622/Mazeko1/X.png");
background-position: 10px center;
background-repeat: no-repeat;
border-style: solid;
border-width: 1px 1px 1px 4px;
color: darkred;
margin: 10px 0;
padding: 15px 10px 15px 60px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) !important;
border-radius: 0px 0px 0px 0px;
border-color: #D13333;
padding: 50px;
}
/*
Até mais.