Criar botoes na resposta avançada e rápida

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

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

Mensagem por 'Ripper em Sex 25 Abr 2014 - 17: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 Sex 2 Maio 2014 - 20:39, editado 1 vez(es)
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

Mensagem por Shek em Dom 27 Abr 2014 - 7:41

Olá!

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


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

Título Correspondente ao nome da página JavaScript/jQuery que será criada.
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.
Código JavaScript Campo destinado para receber o código JavaScript criado anteriormente.
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:
Atenciosamente,
Shek

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


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17153
Pontos Ativos : 21414

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

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

Mensagem por 'Ripper em Dom 27 Abr 2014 - 12:39

esse mesmos códigos já existem em meu forum e eles criam esses avisos > http://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 > http://i.imgur.com/52hPAoi.png
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

Mensagem por 'Ripper em Sex 2 Maio 2014 - 17:47

up
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

Mensagem por Shek em Sex 2 Maio 2014 - 17:58

Olá!

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

Atenciosamente,
Shek


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17153
Pontos Ativos : 21414

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

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

Mensagem por 'Ripper em Sex 2 Maio 2014 - 18: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?
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

Mensagem por Shek em Sex 2 Maio 2014 - 18: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: http://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 


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17153
Pontos Ativos : 21414

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

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

Mensagem por 'Ripper em Sex 2 Maio 2014 - 18: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 > http://i.imgur.com/k9obNB7.png
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

Mensagem por Shek em Sex 2 Maio 2014 - 18: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(); });
    }
});


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17153
Pontos Ativos : 21414

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

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

Mensagem por 'Ripper em Sex 2 Maio 2014 - 20:38

perfeito vlw xD
avatar

'Ripper
Usuário avançado

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

Ver perfil do usuário http://webgamescommunity.forumeiros.com/

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

- Tópicos similares

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