[TUTORIAL] Posicionar ícone online ao lado do nick

A versão Invision possui uma ótima ferramenta padrão que posiciona o ícone "Online" ao lado do nick, com este tutorial iremos aprender como obter o mesmo efeito nas demais versões.

--> Tutoriais, Dicas e Astúcias <--
Posicionar ícone online ao lado do nick

 
   

Para que possamos prosseguir com o tutorial, é preciso que tenha noção sobre a edição dos templates, que serão necessárias para a continuação deste tutorial. Para isso, veja: Modificar os templates do fórum

PhpBB2 e PunBB

1º - Localizar e modificar o template:
Aceda à Painel de controle    Visualização    Templates    Geral    viewtopic_body



2º - Modificar o código:
Use a caixa de busca do template e procure por este código:

Código:

{postrow.displayed.ONLINE_IMG}

Selecione o código e aperte "Ctrl + X" para recortar. Novamente na caixa de busca procure por este código:

Código:

{postrow.displayed.POSTER_NAME}

Cole o código anterior ao lado desse, caso cole ao lado esquerdo, o ícone aparecerá a esquerda do nick, se colar ao lado direito ele ficará a direita do nick.

Salve e publique seu template!

PhpBB3

1º - Código utilizado:

jQuery(document).ready(function(){jQuery('.post.online').each(function(){jQuery(this).find('.postprofile dl dt strong a').after(' <img src="IMAGEM">')})});

Vermelho -> Link da imagem do ícone online.


2º - Inserir o código Javascript:
Aceda à Painel de controle    Módulos    HTML e Javascript    Gestão dos códigos Javascript
Clique no botão "Criar um novo javascript"

Título - Terá de colocar um título para a página, de forma a poder identifica-lo na lista de páginas JavaScript do Painel de Controle;

Investimento - Escolha a opção "Em todas as páginas", para que a função não apresente erros na posição da coluna de perfis;

Código JavaScript - Neste campo teremos de inserir o código que trabalhamos no item anterior;

Confirmar - Por fim, após adicionar o código, terá de clicar neste botão para salvar a criação. Se você clicar em um outro botão ou em uma outra seção, as mudanças não serão validadas.

3º - Veja o resultado:

---

   

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: Posicionar ícone online ao lado do nick