Tags tópicos

Detalhes da questão

Endereço do fórum: http://cyber-designer.forumeiros.com/
Versão do fórum: ModernBB

Descrição

Boas pessoal
gostaria de por tags nos tópicos tentei seguir este tutorial https://ajuda.forumeiros.com/t110573-tutorial-tags-nos-topicos?highlight=topicos Mas nao deu tem como dar em ModernBB?
Obrigado

Boa tarde.

Você poderia deixar o código ativado no fórum, por favor?

O codigo esta ativo =/

Olá, desative os seus scripts e veja se agora aparecem as tags.

Até mais

nao funciona =/

Qual o código você tem aplicado no seu fórum?

Tenho este codigo aqui :

Código:

function tagprefixo() {
    jQuery('input[name=subject]').val(jQuery('select[name=tags4]').val() + jQuery('input[name=subject]').val());
};
jQuery(document).ready(function () {
    var sHtmlPrefx =
        '<select name="tags4" onchange="tagprefixo()">' +
            '<option value="">' +
                '(sem prefixo)' +
            '</option>' +
            '<option value="[Apresentacao]">' +
                'Apresentação' +
            '</option>' +
            '<option value="[Download]">' +
                'Download' +
            '</option>' +
            '<option value="[Duvida]">' +
                'Dúvida' +
            '</option>' +
            '<option value="[Dica]">' +
                'Dica' +
            '</option>' +
            '<option value="[Evento]">' +
                'Evento' +
            '</option>' +
            '<option value="[Entrega]">' +
                'Entrega' +
            '</option>' +
            '<option value="[Filme]">' +
                'Filme' +
            '</option>' +
            '<option value="[Game]">' +
                'Game' +
            '</option>' +
            '<option value="[Imagem]">' +
                'Imagem' +
            '</option>' +
            '<option value="[Noticia]">' +
                'Notícia' +
            '</option>' +
            '<option value="[Offtopic]">' +
                'Offtopic' +
            '</option>' +
            '<option value="[Pedido]">' +
                'Pedido' +
            '</option>' +
            '<option value="[Recado]">' +
                'Recado' +
            '</option>' +
            '<option value="[Regras]">' +
                'Regras' +
            '</option>' +
            '<option value="[Sugestao]">' +
                'Sugestão' +
            '</option>' +
            '<option value="[VIP]">' +
                'Seriado' +
            '</option>' +
            '<option value="[Tutorial]">' +
                'Tutorial' +
            '</option>' +
            '<option value="[Video]">' +
                'Vídeo' +
            '</option>' +
        '</select> <img src="http://2img.net/i/fa/wysiwyg/separator.png" style="vertical-align:middle"> ';
    try {
        jQuery('input[name=subject]').after(sHtmlPrefx);
        var mode = jQuery('input[value=reply]').val();
        if (mode == 'reply') {
            jQuery('select[name=tags4]').css('display', 'none');
        } else if (mode == 'quote') {
            jQuery('select[name=tags4]').css('display', 'none');
        }
  } catch (e) {
      if (typeof (console) != 'undefined') {
        console.error(e)
      }
  } 
});

Você está usando dois códigos de tags? pois esse do tutorial que você postou na 1ª mensagem https://ajuda.forumeiros.com/t110573-
é funcional na versão ModernBB.


Até mais

So to usando esse codigo que postei . tentei usar o outro codigo e nao deu =/

UP!!!

Tente usar este código:

Código:

function tagprefixo() {
    jQuery('input[name=subject]').val(jQuery('select[name=tags4]').val() + jQuery('input[name=subject]').val());
};
jQuery(document).ready(function () {
    var sHtmlPrefx =
        '<select name="tags4" onchange="tagprefixo()">' +
            '<option value="">' +
                '(sem prefixo)' +
            '</option>' +
            '<option value="[Apresentacao]">' +
                'Apresentação' +
            '</option>' +
            '<option value="[Download]">' +
                'Download' +
            '</option>' +
            '<option value="[Duvida]">' +
                'Dúvida' +
            '</option>' +
            '<option value="[Dica]">' +
                'Dica' +
            '</option>' +
            '<option value="[Evento]">' +
                'Evento' +
            '</option>' +
            '<option value="[Entrega]">' +
                'Entrega' +
            '</option>' +
            '<option value="[Filme]">' +
                'Filme' +
            '</option>' +
            '<option value="[Game]">' +
                'Game' +
            '</option>' +
            '<option value="[Imagem]">' +
                'Imagem' +
            '</option>' +
            '<option value="[Noticia]">' +
                'Notícia' +
            '</option>' +
            '<option value="[Offtopic]">' +
                'Offtopic' +
            '</option>' +
            '<option value="[Pedido]">' +
                'Pedido' +
            '</option>' +
            '<option value="[Recado]">' +
                'Recado' +
            '</option>' +
            '<option value="[Regras]">' +
                'Regras' +
            '</option>' +
            '<option value="[Sugestao]">' +
                'Sugestão' +
            '</option>' +
            '<option value="[VIP]">' +
                'Seriado' +
            '</option>' +
            '<option value="[Tutorial]">' +
                'Tutorial' +
            '</option>' +
            '<option value="[Video]">' +
                'Vídeo' +
            '</option>' +
        '</select> <img src="http://2img.net/i/fa/wysiwyg/separator.png" style="vertical-align:middle"> ';
    try {
        jQuery('input[name=subject]').after(sHtmlPrefx);
        var mode = jQuery('input[value=reply]').val();
        if (mode == 'reply') {
            jQuery('select[name=tags4]').css('display', 'none');
        } else if (mode == 'quote') {
            jQuery('select[name=tags4]').css('display', 'none');
        }
  } catch (e) {
      if (typeof (console) != 'undefined') {
        console.error(e)
      }
  } 
});

E criar este JS:

Código:

/**
 *! Criar tags no título dos tópicos com painel de seleção.
 *
 *  @author Luiz~
 *  @see <a href="http://ajuda.forumeiros.com">Fórum dos Fóruns</a>
 *  @licence MIT
 */
(function ($) {
  'use strict';
 
  var tags = [{
      tag: 'download',
      background: '#000'
    }, {
      tag: 'apresentacao',
      background: '#000'
    }, {
      tag: 'duvida',
      background: '#000'
    }, {
      tag: 'dica',
      background: '#000'
    }, {
      tag: 'evento',
      background: '#000'
    }, {
      tag: 'entrega',
      background: '#000'
    }, {
      tag: 'filme',
      background: '#000'
    }, {
      tag: 'game',
      background: '#000'
    }, {
      tag: 'imagem',
      background: '#000'
    }, {
      tag: 'noticia',
      background: '#000'
    }, {
      tag: 'offtopic',
      background: '#000'
    }, {
      tag: 'pedido',
      background: '#000'
    }, {
      tag: 'recado',
      background: '#000'
    }, {
      tag: 'regras',
      background: '#000'
    }, {
      tag: 'sugestao',
      background: '#000'
    }, {
      tag: 'vip',
      background: '#000'
    }, {
      tag: 'tutorial',
      background: '#000'
    }, {
      tag: 'video',
      background: '#000'
    }];
 
  $(function () {
    var counter = 1;
 
    /**
    * Parte 1.
    * Aqui nós criamos o seletor de tags acima do editor:
    */
    if (location.pathname === '/post' && $('form input[name="subject"]').length > 0) {
      // Criar a zona para colocar-se os inputs:
      var $textarea = $('#textarea_content');
      var $title = $('form [name="subject"]');
      var $zone = $([
        '<div class="fa-icon-selector">',
        '  <div class="fa-icon-selector-inner">',
        '  </div>',
        '</div>',
      ].join('\n'))
        .prependTo($textarea)
      ;
 
      // Criar-se os inputs dentro da zona criada anteriormente:
      var $appendZone = $zone.find('.fa-icon-selector-inner');
      $.each(tags, function (index, tag) {
        $([
          '<div class="fa-tag-form-group">',
          '  <input type="radio" class="select-tag-input" name="select-tag-radio" id="tag-input-' + counter + '" data-tag="' + tag.tag + '" />',
          '  <label for="tag-input-' + counter + '" class="fa-tag-label">' + tag.tag + '</label>',
          '</div>',
        ].join('\n'))
          .appendTo($appendZone)
        ;
       
        counter++;
      });
 
      // Função para dar focus num input X caso este seja a tag dum tópico X:
      if (/^\[.*\]/gi.test($title.val())) {
        $title.val().replace(/^\[(.*)\]/gi, function (find, match) {
          $('[data-tag="' + match + '"]').prop('checked', true);
        });
      }
 
      // Trigger para a adição/edição do prefixo no input de título:
      $zone
        .find('input.select-tag-input')
          .on('focus', function () {
            setPrefix($(this).attr('data-tag'));
          })
      ;
 
      // Função para setar/editar o prefixo:
      var setPrefix = function (prefix) {
 
        if (/^\[.*\]/gi.test($title.val())) {
          $title.val($title.val().replace(/^\[.*\]/gi, function () {
            return '[' + prefix + ']';
          }));
         
          return;
        }
       
        $title.val('[' + prefix + '] ' + $title.val().trim());
      };
    }
 
    /**
    * Parte 2.
    * Aqui nós iremos substituir a tag entre os colchetes por uma tag real:
    */
    var $link = $('a[href^="/t"]');
    $link.each(function () {
 
      var $this = $(this);
 
      $.each(tags, function (index, tag) {
        var regex = new RegExp ('\\[' + tag.tag + '\\]', 'gim');
        var text = $this.text();
 
        if (!regex.test(text)) {
          return;
        }
 
        $this.addClass('fa-tagged-link');
        $this.text(text.trim().replace(regex, ''));
        $this.prepend('<span class="fa-topic-tag" style="background-color: ' + tag.background + ';">' + tag.tag + '</span>');
      });
    });
 
    /**
    * Parte 3:
    * Estilos.
    */
    var styles = [
      '.fa-icon-selector-inner strong {',
      '  display: block;',
      '  margin-bottom: 4px;',
      '  font-weight: bold;',
      '}',
      '',
      '.fa-icon-selector .fa-tag-form-group {',
      '  display: inline-block;',
      '  margin-right: 15px;',
      '  margin-top: 4px;',
      '}',
      '',
      '.fa-tagged-link {',
      '  text-decoration: none !important;',
      '}',
      '',
      '.fa-tagged-link:hover {',
      '  color: #f73 !important;',
      '  text-decoration: none !important;',
      '}',
      '',
      'span.fa-topic-tag {',
      '  color: #fff;',
      '  background-color: #39c;',
      '  padding: 1px 5px;',
      '  border-radius: 3px;',
      '  margin-right: 4px;',
      '  display: inline;',
      '  text-decoration: none!important',
      '}'
    ].join('\n');
 
    $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
   
  });
}(jQuery));

o/

Esses codigos são no js? Se for eu tentei e não deu resultado.

up

cocas20 escreveu:up

Eu testei do console do seu forum

Código:

(function ($) {
  'use strict';
 
  var tags = [{
      tag: 'download',
      background: '#000'
    }, {
      tag: 'apresentacao',
      background: '#000'
    }, {
      tag: 'duvida',
      background: '#000'
    }, {
      tag: 'dica',
      background: '#000'
    }, {
      tag: 'evento',
      background: '#000'
    }, {
      tag: 'entrega',
      background: '#000'
    }, {
      tag: 'filme',
      background: '#000'
    }, {
      tag: 'game',
      background: '#000'
    }, {
      tag: 'imagem',
      background: '#000'
    }, {
      tag: 'noticia',
      background: '#000'
    }, {
      tag: 'offtopic',
      background: '#000'
    }, {
      tag: 'pedido',
      background: '#000'
    }, {
      tag: 'recado',
      background: '#000'
    }, {
      tag: 'regras',
      background: '#000'
    }, {
      tag: 'sugestao',
      background: '#000'
    }, {
      tag: 'vip',
      background: '#000'
    }, {
      tag: 'tutorial',
      background: '#000'
    }, {
      tag: 'video',
      background: '#000'
    }];
 
  $(function () {
    var counter = 1;
 
    /**
    * Parte 1.
    * Aqui nós criamos o seletor de tags acima do editor:
    */
    if (location.pathname === '/post' && $('form input[name="subject"]').length > 0) {
      // Criar a zona para colocar-se os inputs:
      var $textarea = $('#textarea_content');
      var $title = $('form [name="subject"]');
      var $zone = $([
        '<div class="fa-icon-selector">',
        '  <div class="fa-icon-selector-inner">',
        '  </div>',
        '</div>',
      ].join('\n'))
        .prependTo($textarea)
      ;
 
      // Criar-se os inputs dentro da zona criada anteriormente:
      var $appendZone = $zone.find('.fa-icon-selector-inner');
      $.each(tags, function (index, tag) {
        $([
          '<div class="fa-tag-form-group">',
          '  <input type="radio" class="select-tag-input" name="select-tag-radio" id="tag-input-' + counter + '" data-tag="' + tag.tag + '" />',
          '  <label for="tag-input-' + counter + '" class="fa-tag-label">' + tag.tag + '</label>',
          '</div>',
        ].join('\n'))
          .appendTo($appendZone)
        ;
       
        counter++;
      });
 
      // Função para dar focus num input X caso este seja a tag dum tópico X:
      if (/^\[.*\]/gi.test($title.val())) {
        $title.val().replace(/^\[(.*)\]/gi, function (find, match) {
          $('[data-tag="' + match + '"]').prop('checked', true);
        });
      }
 
      // Trigger para a adição/edição do prefixo no input de título:
      $zone
        .find('input.select-tag-input')
          .on('focus', function () {
            setPrefix($(this).attr('data-tag'));
          })
      ;
 
      // Função para setar/editar o prefixo:
      var setPrefix = function (prefix) {
 
        if (/^\[.*\]/gi.test($title.val())) {
          $title.val($title.val().replace(/^\[.*\]/gi, function () {
            return '[' + prefix + ']';
          }));
         
          return;
        }
       
        $title.val('[' + prefix + '] ' + $title.val().trim());
      };
    }
 
    /**
    * Parte 2.
    * Aqui nós iremos substituir a tag entre os colchetes por uma tag real:
    */
    var $link = $('a[href^="/t"]');
    $link.each(function () {
 
      var $this = $(this);
 
      $.each(tags, function (index, tag) {
        var regex = new RegExp ('\\[' + tag.tag + '\\]', 'gim');
        var text = $this.text();
 
        if (!regex.test(text)) {
          return;
        }
 
        $this.addClass('fa-tagged-link');
        $this.text(text.trim().replace(regex, ''));
        $this.prepend('<span class="fa-topic-tag" style="background-color: ' + tag.background + ';">' + tag.tag + '</span>');
      });
    });
 
    /**
    * Parte 3:
    * Estilos.
    */
    var styles = [
      '.fa-icon-selector-inner strong {',
      '  display: block;',
      '  margin-bottom: 4px;',
      '  font-weight: bold;',
      '}',
      '',
      '.fa-icon-selector .fa-tag-form-group {',
      '  display: inline-block;',
      '  margin-right: 15px;',
      '  margin-top: 4px;',
      '}',
      '',
      '.fa-tagged-link {',
      '  text-decoration: none !important;',
      '}',
      '',
      '.fa-tagged-link:hover {',
      '  color: #f73 !important;',
      '  text-decoration: none !important;',
      '}',
      '',
      'span.fa-topic-tag {',
      '  color: #fff;',
      '  background-color: #39c;',
      '  padding: 1px 5px;',
      '  border-radius: 3px;',
      '  margin-right: 4px;',
      '  display: inline;',
      '  text-decoration: none!important',
      '}'
    ].join('\n');
 
    $(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
   
  });
}(jQuery));

e deu qual o revestimento que você está a usar?

Em todas as paginas...
Mas não ta a dar.

Faça este teste: desligue os JS abaixo, deixado assim só os das tags ativo e veja se existe alguma interferência, se as tags derem, comece a ligar JS a JS até descobrir qual anda a interferir com os das tags.

Obrigado pela ajuda !