Bem vindo, neste tutorial, o senhor irá aprender a criar um botão nas respostas rápidas que, ao ser clicados, lhes apareça uma selectbox pedindo o código da moderação que irá ser utilizada, pré-visualizações no final do tópico.

--> Tutoriais, dicas e astúcias <--
Botão para Alertas Moderativos

1º - Noção básica da função:
As páginas javascript ativas em seu fórum possibilita inserir scripts e jquery para personalizar seu fórum, contudo é importante saber que qualquer script encontrado na internet acabam por não surgir efeito nos fóruns.

Painel de controle -> Módulos -> HTML & JavaScript -> Gestão dos códigos JavaScripts

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. Pode ser na galeria, nos fóruns ou sub-fóruns. Vamos ver algumas opções: No índice : O código será aplicado ao índice do fórum. No portal : O código será aplicado ao Portal do fórum. Nos sub-fóruns (Fóruns) : O código será aplicado nos Fóruns e Sub-fóruns. Sobre os temas : O código será aplicado aos tópicos do fórum. Na galeria : O código será aplicado na sua Galeria de imagens. Em todas as páginas : O código será aplicado em todas as páginas do fórum.

Código JavaScript Campo destinado para receber os códigos JavaScript e jQuery.

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.

2º - Código JavaScript:
Abaixo, você deverá editar alguns pontos do código Javascript:

Código:

$(document).ready(function() {
  $('form#quick_reply[action="/post"]').prepend('<div id="alertas-visu" style="text-align: center;"><select onchange="$(\'#alertas-visu #pre-alert\').html($(this).find(\'option:selected\').attr(\'value\')).fadeIn();$(\'#alert-ok\').fadeIn();" id="sel-alert" style="font-family: Century Gothic!important;-webkit-appearance: none; -webkit-padding-end: 20px; -webkit-padding-start: 6px;background: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);background-position: right center;background-repeat: no-repeat;border: 1px solid rgba(0, 0, 0, 0.25)!important;border-radius: 2px!important;box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0.75);color: #444;margin: 0 1px 0 0;text-shadow: 0 1px 0 rgb(240, 240, 240);padding: 6px!important;width: 506px;margin-bottom: 25px;display: none;"><option value="">Selecione um Alerta</option><optgroup label="GRUPO DE ALERTAS">
<option value="HTML DO ALERTA">NOME DO ALERTA</option>
</optgroup><optgroup label="GRUPO DE ALERTAS">
<option value="HTML DO ALERTA">NOME DO ALERTA</option>
</optgroup><optgroup label="GRUPO DE ALERTAS">
<option value="HTML DO ALERTA">NOME DO ALERTA</option>
</optgroup></select><div style="margin-bottom: 30px;display: none;" id="pre-alert"></div><input type="button" id="alert-ok" value="OK" onclick="$(\'#text_editor_textarea\').val($(\'#sel-alert\').find(\'option:selected\').attr(\'value\'));" style="font-family: \'Century Gothic\' !important; -webkit-appearance: none; -webkit-padding-end: 20px; -webkit-padding-start: 6px; background-image: -webkit-linear-gradient(top, rgb(237, 237, 237), rgb(237, 237, 237) 38%, rgb(222, 222, 222))!important; border: 1px solid rgba(0, 0, 0, 0.247059) !important; border-top-left-radius: 2px !important; border-top-right-radius: 2px !important; border-bottom-right-radius: 2px !important; border-bottom-left-radius: 2px !important; box-shadow: rgba(0, 0, 0, 0.0784314) 0px 1px 0px, rgba(255, 255, 255, 0.74902) 0px 1px 2px inset; color: rgb(68, 68, 68)!important; margin: 0px 1px 25px 0px; text-shadow: rgb(240, 240, 240) 0px 1px 0px; padding: 6px !important; font-size: 13px!important; text-align: center!important; font-weight: lighter !important;width: 130px;display: none;"></div>');
  $('#text_editor_controls .left-box #text_edit button:last').after('  <button class="button2" id="alert-flames" onClick="$(\'#sel-alert\').fadeToggle();return false;"><img src="http://i71.servimg.com/u/f71/17/71/75/73/ajuda110.png" title="Alertas de Moderação"></button>');
});

GRUPO DE ALERTAS Correspondente á um nome de grupo de alertas, por exemplo, Tutoriais/Tópicos.

HTML DO ALERTA - Local destinado á receber o HTML de cada alerta. Atenção! Normalmente, o código HTML conterá aspas duplas ("), substitua-as por uma barra invertida seguida de uma aspa simples (\').

NOME DO ALERTA Local destinado á receber o nome do alerta que o HTML foi colocado em value.

3º - Resultado:
Finalmente, chegamos á pré-visualização de nosso efeito:

Visualizando (Botão com figura de homem, ao lado do botão OUTROS):

Ao clicar no botão:

Ao clicar na selectbox:

Ao selecionar o alerta:

Ao clicar no botão OK:

4º - Perguntas:

• Funciona para quais versões ?
  O código acima se usado certamente, funciona em todas as versões.

• Quantas opções posso adicionar ?
  Quantas opções o senhor desejar.

• Oque acontece ao selecionar o alerta ?
  Abaixo da selectbox, aparece a pré-visualização do alerta, e ao clicar no botão OK o código é enviado á caixa de texto.

---

© SGBR™ & [F]lames & D'Leandro™

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [DÚVIDA] Botão para alertas moderativos

Cara você é um nerd gostei muito obrigado por compartilhar esse belo código conosco esta de parabéns manow

Achei oq Eu Queria .-.

Cara adorei, servira muito para meu forum de RPG