Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Quem está conectado
232 usuários online :: 9 usuários cadastrados, 1 Invisível e 222 Visitantes :: 2 Motores de busca

EROMIR, Heikki, iScroll, Jeckwilke, Lemon~, Lost154, Rafael L Máximos, regina.cely, William_iHarDz

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Como colocar tags nos tópicos e nos últimos assuntos

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

Resolvido Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Flames em 22/06/17, 04:05 am

Detalhes da questão


Endereço do fórum: http://churchofpop.forumeiros.com
Versão do fórum: PunBB

Descrição


Olá, eu gostaria de um código para que eu pudesse adicionar tags aos tópicos, como na imagem abaixo, onde está verde:


Onde cada tag fosse de uma cor, a de cima da imagem é verde, outra seria azul, outra vermelha. Eu tentei criar pelo "Ícone de Mensagens", tentei por uma imagem, fui lá no tópico selecionei o ícone, salvei, mas ele não aparece ao lado dos nomes dos tópicos, por isso preciso de um código para funcionar.

E também queria que aparecesse a tag não só no fórum, mas também no widget "Últimos Assuntos".

Alguém pode me ajudar? Obrigado.

avatar

Flames
Nível 5

Masculino
Inscrito dia : 05/10/2011
Mensagens : 50
Pontos Ativos : 78

Ver perfil do usuário http://jornamice.com.br.tc

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Luiz em 22/06/17, 02:10 pm

Olá,

Crie um novo JavaScript investido em todas as páginas, com o código:
Código:
/*
 *! Inserir tags antes do título do tópico.
 *
 *  @author Luiz~
 *  @see <a href="http://ajuda.forumeiros.com">Fórum dos Fóruns</a>
 *  @licence MIT
 */
(function ($) {
  'use strict';

  var tags = [
    {
      title: 'imagem', // Aqui você escolhe o conteúdo que irá virar a TAG. Não é necessário colocá-lo entre colchetes.
      background: 'red' // Você pode inserir qualquer tipo de cor de fundo, em inglês, hexadecimal, RGB, etc.
    }, // Coloque vírgula em cada grupo, exceto no último.
    {
      title: 'widget',
      background: '#000'
    } // Não coloque vírgula no último grupo!
  ];
 
  $(function () {

    var $target = $('.js-marquee a, a.topictitle');
    $target.each(function () {

      var $this = $(this);

      $.each(tags, function (index, tag) {

        var regExp = new RegExp ('\\[' + tag.title + '\\]', 'gim');
        var text = $this.text();

        if (!regExp.test(text)) {
          return;
        }

        $this.text(text.trim().replace(regExp, ''));
        $this.before('<span class="fa-topic-tag" style="background-color: ' + tag.background + ';">' + tag.title + '</span>');
       
      });
    });

    console.log([
      'As tags de tópicos foram trocadas.',
      'Caso hajam erros durante a troca, contate o suporte técnico.'
    ].join('\n'));

    var styles = [
      'span.fa-topic-tag {',
      '  color: #fff;',
      '  background-color: #39c;',
      '  padding: 1px 5px;',
      '  border-radius: 3px;',
      '  margin-right: 4px;',
      '  display: inline-block;',
      '}'
    ].join('\n');

    $(['<style type="text/css">', styles, '<style>'].join('\n')).appendTo('head');
  });
}(jQuery));

No código acima, temos essa parte:
Código:
var tags = [
  {
    title: 'imagem', // Aqui você escolhe o conteúdo que irá virar a TAG. Não é necessário colocá-lo entre colchetes.
    background: 'red' // Você pode inserir qualquer tipo de cor de fundo, em inglês, hexadecimal, RGB, etc.
  }, // Coloque vírgula em cada grupo, exceto no último.
  {
    title: 'widget',
    background: '#000'
  } // Não coloque vírgula no último grupo!
];

  • Em
    title
    , você irá colocar o conteúdo que irá virar a tag. Lembre-se que não é necessário incluir colchetes ( [ e ] ). O script já as coloca automaticamente.
  • Em
    background
    , você coloca a cor de fundo da tag para aquela palavra.


Feito isso, crie um título do tópico desse jeito:
[ TAG QUE VOCÊ COLOCOU NO SCRIPT ] Título normal [...]
No mais, leia as anotações no código. Piscada

o/


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.
Luiz — Ajudeiro
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5808
Pontos Ativos : 6646

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Flames em 22/06/17, 03:28 pm

Olá Luiz, então funcionou aqui mas eu queria saber se em vez de adicionar manualmente o nome da tag no título do tópico, eu possa criar as opções das tags para os usuários selecionarem e quando publicarem o tópico automaticamente aparecer a tag no título.

Usando, por exemplo, a opção Ícone do Assunto, a pessoa seleciona, posta o tópico e aparece automático a tag no título, é possível?

avatar

Flames
Nível 5

Masculino
Inscrito dia : 05/10/2011
Mensagens : 50
Pontos Ativos : 78

Ver perfil do usuário http://jornamice.com.br.tc

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Luiz em 22/06/17, 04:04 pm

A melhor forma de fazer isso é usando os ícones de mensagens! Piscada
Leia:
-> http://ajuda.forumeiros.com/t8479-faq-adicionar-icones-de-mensagens

o/


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.
Luiz — Ajudeiro
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5808
Pontos Ativos : 6646

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Flames em 22/06/17, 04:15 pm

Mas então, eu estava tentando usar o ícone de mensagens, mas ele não aparece ao lado dos tópicos. Acho que é meu tema que é bugado ou falta algum código. Veja, eu selecionei o ícone no tópico:


E quando vou ver, ele não aparece ao lado dos nomes nos tópicos nem no widget Últimos assuntos:


Por isso eu queria tentar por um código, porque pelo ícone de Assuntos não consegui. Poderia me ajudar a resolver? Eu queria que o ícone aparecesse ao lado do nome dos tópicos no fórum e também no widget Últimos assuntos.
avatar

Flames
Nível 5

Masculino
Inscrito dia : 05/10/2011
Mensagens : 50
Pontos Ativos : 78

Ver perfil do usuário http://jornamice.com.br.tc

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Luiz em 22/06/17, 04:46 pm

O código que passei nessa mensagem funciona perfeitamente.
Releia esta mensagem (clique).

Veja:
-> http://prntscr.com/fmzo0r

Como resultado, temos:
-> http://prntscr.com/fmzoha

Fonte:
-> Clique aqui.


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.
Luiz — Ajudeiro
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5808
Pontos Ativos : 6646

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Flames em 22/06/17, 04:53 pm

Sim, está funcionando perfeitamente, já estou usando, muito obrigado. O que eu queria saber agora é se em vez de eu ter que adicionar a tag manualmente no título do tópico, ter a opção do usuário selecioná-la como na imagem:

E quando enviar o tópico, aparecer automaticamente no título a tag selecionada. É possível?


E também queria que me ajudasse com essas bordas que está encostando em cima, queria diminuir a altura. Eu já mexi no padding, coloquei 0px, mas não diminuiu muito. Em cima ainda está com um espaço, veja:

avatar

Flames
Nível 5

Masculino
Inscrito dia : 05/10/2011
Mensagens : 50
Pontos Ativos : 78

Ver perfil do usuário http://jornamice.com.br.tc

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Luiz em 22/06/17, 04:57 pm

Para o seletor de tags, o senhor poderá usar este tutorial:
-> http://ajuda.forumeiros.com/t46956-tutorial-sistema-de-prefixos

Para corrigir o bug do CSS, vá em sua Folha de Estilos, e adicione, ao final dela:
Código:
html body span.fa-topic-tag {
  display: inline!important;
  padding: 1px 5px!important;
}

o/


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.
Luiz — Ajudeiro
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5808
Pontos Ativos : 6646

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Flames em 22/06/17, 05:04 pm

Perfeito. Dúvidas solucionadas, parabéns pelo suporte Luiz. Muito obrigado, pode fechar o tópico.
avatar

Flames
Nível 5

Masculino
Inscrito dia : 05/10/2011
Mensagens : 50
Pontos Ativos : 78

Ver perfil do usuário http://jornamice.com.br.tc

Resolvido Re: Como colocar tags nos tópicos e nos últimos assuntos

Mensagem por Luiz em 22/06/17, 05:10 pm

Sempre às ordens. o7

---

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.


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.
Luiz — Ajudeiro
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5808
Pontos Ativos : 6646

Ver perfil do usuário https://github.com/lffg/

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