Neste tutorial será ensinado como colocar um sistema de prefixos na página de resposta dos tópicos. Este código é interessante para fóruns que querem se manter mais organizados.
Sistema de prefixo TUTORIAIS, DICAS E ASTÚCIAS |
Instalação do JavaScriptAs 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 e Javascript Gestão das páginas JavaScript Criar um novo JavaScript |
(clique na imagem para aumentar) | 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 Em todas as páginas. |
| 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. |
Em seguida, basta adicionar este código:
- Código:
/*globals jQuery*/ /** * @name Sistema de Prefixos. * @version 1.0 * @author Luiz * @see {@link http://ajuda.forumeiros.com/} * @licence MIT */ (function ($) { 'use strict'; var config = { prefixes: [ 'Dúvida', 'Pedido', 'Em Curso', 'Jogos', 'Recusado', 'Resolvido', 'Negado' ], lang: { all: 'Sem Prefixo' }, engine: { /** * @name Inicializador. * @desc Usado para iniciar o script. * @param {object} input - Corresponde ao seletor do input-alvo do script. */ init: function (input) { var self = this; var $input = $(input); var $dummy = $('<option>', { 'class': 'fa-prefix-item' }); if (!/^\/post$/g.test(location.pathname) && $input) { return false; } var $select = $('<select>', { 'class': 'fa-prefix-select' }); $dummy .clone() .text(config.lang.all) .attr('value', '') .attr('selected', true) .appendTo($select) ; $.each(config.prefixes, function (index, prefix) { $dummy .clone() .text('[' + prefix + ']') .attr('value', '[' + prefix + ']') .attr('id', 'fa-prefix-item-' + index) .appendTo($select) ; }); $select .insertAfter($input) .on('change', function () { var $this = $(this); var value = $this.val(); self.prefix(value, $this.prev()); }) ; }, /** * @name Prefixador. * @desc Usada para colocar o prefixo no input. * @param {string} value - Corresponde ao prefixo que será colocado. * @param {object} input - Corresponde ao seletor do input que será prefixado. */ prefix: function (value, input) { var $input = $(input); if (/^\[.*\]/g.test($input.val())) { $input.val($.trim($input.val().replace(/^\[.*\]/, ''))); } $input.val($.trim(value + ' ' + $input.val())); } } }; $(function () { var $input = $('input[name="subject"]'); config.engine.init($input); }); }(jQuery));
Logo após a aplicação, será possível visualizar o resultado.
|