Criar botoes na resposta avançada e rápida

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Atendido / Resolvido Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 25.04.14 21:24

  • Descrição:
bem existem alguns codigos em meu forum que criaam algumas coisas nas respostas e topicos e tem que pegar o codigo e colocar na resposta avançada ou rapida e isso e meio cansativo então eu queria criar botoes na resposta rapida e avaçada que quando clicassem jogassem esses codigos que no caso seriam 

[bspoiler] [/bspoiler]
<a href="seu link" target="_blank" class="button tamanho cor">Titulo</a>
<div id="sucesso">Sua Mensagem</div>
<div id="alerta">Sua Mensagem/div>
<div id="inform">Sua Mensagem</div>
<div id="aviso">Sua Mensagem</div>
<div id="texto">Sua Mensagem</div>

1 botão para cada um desses códigos 

e possível fazer isso?

  • Informações:
Fórum:http://demoncheats.maisforum.com/Versão:PUNBB
Tipo:Erros diversosTags:Criar,botoes,resposta,avançada,rápida



Última edição por DEMORUTO666 em 03.05.14 0:39, editado 1 vez(es)
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por Shek em 27.04.14 11:41

Olá!

Leia o conteúdo do Spoiler a seguir:
TUTORIAL:

Criar botoes na resposta avançada e rápida  Newsletter

Tópicos & Mensagens


Facilite o trabalho de sua equipe de moderação adicionando mensagens pré-definidas de alertas no SCeditor, o editor de mensagens.


--> Tutoriais, dicas e astúcias <--
Mensagens de aviso na caixa de resposta rápida



- Gerenciar as páginas JavaScript:
Precisamos definir um código JavaScript que mudará o link do botão Novo tópico em um determinado subfórum. Por isso, vamos acessar as páginas JavaScript do fórum.

Painel de Controle ->> Módulos ->> HTML & JAVASCRIPT ->> Gestão dos códigos JavaScript
Criar botoes na resposta avançada e rápida  Painel13

Criar botoes na resposta avançada e rápida  110111Criar botoes na resposta avançada e rápida  398853 Título Correspondente ao nome da página JavaScript/jQuery que será criada.
Criar botoes na resposta avançada e rápida  110210Criar botoes na resposta avançada e rápida  398853 Localização São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. No nosso caso, aplicaremos nos tópicos.
Criar botoes na resposta avançada e rápida  110310Criar botoes na resposta avançada e rápida  398853 Código JavaScript Campo destinado para receber o código JavaScript criado anteriormente.
Criar botoes na resposta avançada e rápida  110410Criar botoes na resposta avançada e rápida  398853 Habilitar o gerenciamento dos códigos JavaScript Ao selecionar a opção sim, estará ativando a função páginas Javascript no seu fórum. Se selecionar não, as páginas serão desabilitadas no fórum.


- Código JS a ser utilizado:
Você poderá aplicar o seguinte código:
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]");
        });
        });
      });

Caso queira modificar o código, use o Ctrl + F e busque pelos nomes de cada caixa:
Informação
Aviso
Alerta


- Adicionar o CSS:
Em seguida, acesse Painel de Controle > Visualização > Imagens e Cores > Cores > Folha de estilos CSS > e adicione este código CSS:
Código:
.sucesso, .alerta, .aviso, .infos {
padding: 8px 8px 8px 40px;
width: 99%;
text-shadow: 0 1px 0 #FFFAF1;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
font-weight: bold;
border-radius: 3px 3px 3px 3px;
}
.sucesso {
background: url('http://cdn3.iconfinder.com/data/icons/fatcow/32x32_0020/accept.png') no-repeat 6px #effeb9;
border: 1px solid #9ac601;
color: #4F8A10;
}
.alerta {
background: url('http://cdn1.iconfinder.com/data/icons/nuvola2/32x32/actions/messagebox_warning.png') no-repeat 6px #fccac3;
border: 1px solid #db3f23;
color: #D8000C;
}
.aviso {
background: url('http://cdn3.iconfinder.com/data/icons/fatcow/32x32_0400/error.png') no-repeat 6px #ffeaa9;
border: 1px solid #f9b516;
color: #9F6000;
}
.infos {
background: url('http://cdn1.iconfinder.com/data/icons/musthave/24/Information.png') no-repeat 6px #d1e4f3;
border: 1px solid #4d8fcb;
color: #00529B;
}


  • Resultado:
    Criar botoes na resposta avançada e rápida  Result54
Atenciosamente,
Shek

Tópico movido de 'Questões sobre aparência' para 'JavaScript e jQuery'


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18439
Pontos Ativos : 22248

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 27.04.14 16:39

esse mesmos códigos já existem em meu forum e eles criam esses avisos > https://i.imgur.com/67M07YQ.png

quando eu tentei colocar de novo esse JS e essa CSS ele na verdade so editou as imagens dos ja existentes e não criou novos que no caso seriam essas > https://i.imgur.com/52hPAoi.png
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 02.05.14 21:47

up
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por Shek em 02.05.14 21:58

Olá!

Eu não compreendi sua pergunta então, pois, pensei que fosse isto que queres: https://i.servimg.com/u/f58/15/88/72/83/result54.jpg Enfim, tente com este tópico: https://ajuda.forumeiros.com/t91096-

Atenciosamente,
Shek


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18439
Pontos Ativos : 22248

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 02.05.14 22:23

e isso que tem nesse tópico so 2 coisinhas

1- ali tem 3 botoes eu queria colocar 7 tem como editar o codigo pra por 7 botoes?
2- entra aqui > http://webforum.maisforum.com/t3-regras-do-forum e ve quando aperta o botao Teste1 ele envia mais mensagens do que devia ele e bugado tem como arrumar?
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por Shek em 02.05.14 22:29

ali tem 3 botoes eu queria colocar 7 tem como editar o codigo pra por 7 botoes?
Em que local? No SCeditor? Se for, leia o tópico que eu lhe passei: https://ajuda.forumeiros.com/t91096-
e ve quando aperta o botao Teste1 ele envia mais mensagens do que devia ele e bugado tem como arrumar?
Que botão "teste1"? Eu não o encontro. Em choque 


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18439
Pontos Ativos : 22248

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 02.05.14 22:41

esse codigo

Código:
$(window).load(function() {
    var settings = {
       img : 'http://i.imgur.com/UAAeJ2R.png',
       title : 'Unidades Protoss'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
        $('.sceditor-button-subscript').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-Protoss" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
        $('body').append('<div id="PrListAV" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div><strong>Unidades:</strong><br /><table><tbody><tr><td><div id="sonda" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/FQ4Y9fS.png"  /> Sonda</div></td><td><div id="fanaticus" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/NOJSSlc.png"  /> Fanáticus</div></td><td><div id="tormento" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/4DaovsG.png"  /> Tormento</div></td><td><div id="sentinela" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/IZSLtIe.png"  /> Sentinela</div></td><td><div id="vigia" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/UcWGKF9.png"  /> Vigia</div></td></tr><tr><td><div id="imortal" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/sLOylPG.png"  /> Imortal</div></td><td><div id="prisma" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/IkmgAX2.png"  /> Prisma de dobra</div></td><td><div id="colosso" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/f78EFOk.png"  /> Colosso</div></td><td><div id="fenix" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/r2OL2A4.png"  /> Fênix</div></td><td><div id="destrui" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/TUFjxCP.png"  /> Destruidora</div></td></tr><tr><td><div id="supremo" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/ypw3g5u.png"  /> Templário supremo</div></td><td><div id="trevas" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/RkejOEr.png"  /> Templário das trevas</div></td><td><div id="arconte" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/Ay3JDwD.png"  /> Arconte</div></td><td><div id="transpo" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/3kROq1N.png"  /> Transportadora</div></td><td><div id="nave" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/KDAp3il.png"  /> Nave-mãe</div></td></tr><tr><td><div id="nucleo" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/OXuz7D1.png"  /> Núcleo da Nave-mãe</div></td><td><div id="oraculo" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/FZ6Wkbl.png"  /> Oráculo</div></td><td><div id="tempesto" class="listItem" style="cursor:pointer;"><img src="http://i.imgur.com/2tF3b3w.png"  /> Tempesto</div></td></tr></tbody></table></div>');

      
      $('.sceditor-button-Protoss').click(function() {
          var display = $('#PrListAV').css('display');
          if (display == 'none') {
             var Y = $(this).offset().top;
             var X = $(this).offset().left;
             $('#PrListAV').show().offset({top:Y + 25,left:X});
          }
           else { $('#PrListAV').hide(); }
       });
        
       $('#sonda').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/2KJe2Qm.png[/IMG]',''); });
       $('#fanaticus').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/Eyrey4f.png[/IMG]',''); });
       $('#tormento').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/gKUlayN.png[/IMG]',''); });
       $('#sentinela').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/MkazrMC.png[/IMG]',''); });
       $('#vigia').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/aFLzPzf.png[/IMG]',''); });
       $('#imortal').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/LuBqmX2.png[/IMG]',''); });
       $('#prisma').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/2gs5P90.png[/IMG]',''); });
       $('#colosso').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/AxMyJWy.png[/IMG]',''); });
       $('#fenix').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/UrqE8Qh.png[/IMG]',''); });
       $('#destrui').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/wiWsKXc.png[/IMG]',''); });
       $('#supremo').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/2vA3x1I.png[/IMG]',''); });
       $('#trevas').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/WYNsJ9Y.png[/IMG]',''); });
       $('#arconte').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/WcSXunS.png[/IMG]',''); });
       $('#transpo').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/6ERxuXL.png[/IMG]',''); });
       $('#nave').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/DYHRCjP.png[/IMG]',''); });
       $('#nucleo').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/Az7a7f7.png[/IMG]',''); });
       $('#oraculo').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/UlEpReB.png[/IMG]',''); });
       $('#tempesto').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[IMG]http://i.imgur.com/J2zAome.png[/IMG]',''); });
       $('#PrListAV').click(function() {      event.preventDefault();
     $("#PrListAV").hide("slow"); });     }
});

nao funciona

codigo depois de eu editar (o 1 codigo citado no tpc)
Código:
$(window).load(function() {
    var settings = {
      img : 'http://illiweb.com/fa/admin/icones/small_ico/configuration.png',
      title : 'Botoes extras'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
        $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
        $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="itens_fa" class="listItem" style="cursor:pointer;">Teste1</div><div id="M2" class="listItem" style="cursor:pointer;">Mensagem Verde</div><div id="M3" class="listItem" style="cursor:pointer;">SpoilerB</div></div>');
     
     
      $('.sceditor-button-message').click(function() {
          var display = $('#messageList').css('display');
          if (display == 'none') {
            var Y = $(this).offset().top;
            var X = $(this).offset().left;
            $('#messageList').show().offset({top:Y + 25,left:X});
          }
          else { $('#messageList').hide(); }
      });
       
      $('#itens_fa').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 1',''); });
$('#itens_fa').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 2',''); });
$('#itens_fa').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 3',''); });
      $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('<div id="sucesso">Sua Mensagem</div>',''); });
      $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('[bspoiler] [/bspoiler]',''); });
      $('.listItem').click(function() { $(this).parent().hide(); });
    }
});

esse botao Teste1 > https://i.imgur.com/k9obNB7.png
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por Shek em 02.05.14 22:52

Substitua seu código por este:
Código:
$(window).load(function() {
    var settings = {
      img : 'http://illiweb.com/fa/admin/icones/small_ico/configuration.png',
      title : 'Botoes extras'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
        $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
        $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="M1" class="listItem" style="cursor:pointer;">MENSAGEM 1</div><div id="M2" class="listItem" style="cursor:pointer;">MENSAGEM 2</div><div id="M3" class="listItem" style="cursor:pointer;">MENSAGEM 4</div> <div id="M5" class="listItem" style="cursor:pointer;">MENSAGEM 5</div><div id="M6" class="listItem" style="cursor:pointer;">MENSAGEM 6</div><div id="M7" class="listItem" style="cursor:pointer;">MENSAGEM 7</div></div>');
     
     
      $('.sceditor-button-message').click(function() {
          var display = $('#messageList').css('display');
          if (display == 'none') {
            var Y = $(this).offset().top;
            var X = $(this).offset().left;
            $('#messageList').show().offset({top:Y + 25,left:X});
          }
          else { $('#messageList').hide(); }
      });
       
      $('#M1').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 1',''); });
     $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 2',''); });
     $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 3',''); });
     $('#M4').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 4',''); });
     $('#M5').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 5',''); });
     $('#M6').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 6',''); });
     $('#M7').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('MENSAGEM 7',''); });
      $('.listItem').click(function() { $(this).parent().hide(); });
    }
});


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18439
Pontos Ativos : 22248

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Atendido / Resolvido Re: Criar botoes na resposta avançada e rápida

Mensagem por 'Ripper em 03.05.14 0:38

perfeito vlw xD
'Ripper

'Ripper
Usuário avançado

Masculino
Inscrito dia : 22/02/2014
Mensagens : 353
Pontos Ativos : 517

http://webgamescommunity.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum