imagem no nome

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

Atendido / Resolvido imagem no nome

Mensagem por GXGamer em 09.02.16 12:15

Detalhes da questão


Endereço do fórum: http://minecraftbrserver.forumeiros.com/
Versão do fórum: PhpBB2

Descrição


Olá, bom, queria que houvesse alguma forma de colocar uma certa imagem atrás do nome do usuário, igual a isso:

http://prntscr.com/a0yn02

Obs: se possível, gostaria de deixar a imagem um pouco mais separada do nome
GXGamer

GXGamer
Nível 5

Masculino
Inscrito dia : 03/03/2014
Mensagens : 37
Pontos Ativos : 67

http://expertcraftsurvival.forumeiros.com/forum

Atendido / Resolvido Re: imagem no nome

Mensagem por GSCode em 09.02.16 12:36

Boas @GXGamer
Onde viu o tal efeito?

Crie um JS - Investimento nos tópicos:
Código:
var _0x40a3=["\x68\x65\x61\x64","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x6C\x69\x6E\x6B","\x63\x72\x65\x61\x74\x65\x45\x6C\x65\x6D\x65\x6E\x74","\x74\x79\x70\x65","\x74\x65\x78\x74\x2F\x63\x73\x73","\x72\x65\x6C","\x73\x74\x79\x6C\x65\x73\x68\x65\x65\x74","\x68\x72\x65\x66","\x68\x74\x74\x70\x3A\x2F\x2F\x6E\x65\x74\x64\x6E\x61\x2E\x62\x6F\x6F\x74\x73\x74\x72\x61\x70\x63\x64\x6E\x2E\x63\x6F\x6D\x2F\x66\x6F\x6E\x74\x2D\x61\x77\x65\x73\x6F\x6D\x65\x2F\x34\x2E\x30\x2E\x33\x2F\x63\x73\x73\x2F\x66\x6F\x6E\x74\x2D\x61\x77\x65\x73\x6F\x6D\x65\x2E\x6D\x69\x6E\x2E\x63\x73\x73","\x61\x70\x70\x65\x6E\x64\x43\x68\x69\x6C\x64"];var headID=document[_0x40a3[1]](_0x40a3[0])[0];var cssNode=document[_0x40a3[3]](_0x40a3[2]);cssNode[_0x40a3[4]]=_0x40a3[5];cssNode[_0x40a3[6]]=_0x40a3[7];cssNode[_0x40a3[8]]=_0x40a3[9];headID[_0x40a3[10]](cssNode);

O primeiro a se fazer é acessar essa página e olhar os ícones disponíveis, tem uma centena de ícones a escolha..
http://astronautweb.co/snippet/font-awesome/

O que nos interessa aqui é aquele código que começa com \f é seguido de algum número..

Escolha seu ícone e vamos adicionar o seguinte código CSS para o nossa folha de estilo:

Código:
   span[style="color:#COR DO GRUPO"]:before {
        content: "\CÓDIGO DO ÍCONE";
        font-family: 'FontAwesome';
     padding: 0 4px;
    }

Onde devemos preencher as informações corretamente, no caso mudar a cor do grupo para o grupo desejado e o código do ícone que está disponível no site que eu passei.

Caso deseje inserir o ícone depois do nick do usuário e não antes, basta trocar o :before por :after..

Não esqueça de reputar e marcar como Obrigado.
Até. zen
GSCode

GSCode
Usuário destaque

Masculino
Inscrito dia : 11/10/2013
Mensagens : 590
Pontos Ativos : 1031

http://testforumbrasil.forumeiros.com/forum

Atendido / Resolvido Re: imagem no nome

Mensagem por GXGamer em 09.02.16 15:25

@GSCode escreveu:Boas @GXGamer
Onde viu o tal efeito?

Crie um JS - Investimento nos tópicos:
Código:
var _0x40a3=["\x68\x65\x61\x64","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x6C\x69\x6E\x6B","\x63\x72\x65\x61\x74\x65\x45\x6C\x65\x6D\x65\x6E\x74","\x74\x79\x70\x65","\x74\x65\x78\x74\x2F\x63\x73\x73","\x72\x65\x6C","\x73\x74\x79\x6C\x65\x73\x68\x65\x65\x74","\x68\x72\x65\x66","\x68\x74\x74\x70\x3A\x2F\x2F\x6E\x65\x74\x64\x6E\x61\x2E\x62\x6F\x6F\x74\x73\x74\x72\x61\x70\x63\x64\x6E\x2E\x63\x6F\x6D\x2F\x66\x6F\x6E\x74\x2D\x61\x77\x65\x73\x6F\x6D\x65\x2F\x34\x2E\x30\x2E\x33\x2F\x63\x73\x73\x2F\x66\x6F\x6E\x74\x2D\x61\x77\x65\x73\x6F\x6D\x65\x2E\x6D\x69\x6E\x2E\x63\x73\x73","\x61\x70\x70\x65\x6E\x64\x43\x68\x69\x6C\x64"];var headID=document[_0x40a3[1]](_0x40a3[0])[0];var cssNode=document[_0x40a3[3]](_0x40a3[2]);cssNode[_0x40a3[4]]=_0x40a3[5];cssNode[_0x40a3[6]]=_0x40a3[7];cssNode[_0x40a3[8]]=_0x40a3[9];headID[_0x40a3[10]](cssNode);

O primeiro a se fazer é acessar essa página e olhar os ícones disponíveis, tem uma centena de ícones a escolha..
http://astronautweb.co/snippet/font-awesome/

O que nos interessa aqui é aquele código que começa com \f é seguido de algum número..

Escolha seu ícone e vamos adicionar o seguinte código CSS para o nossa folha de estilo:

Código:
   span[style="color:#COR DO GRUPO"]:before {
        content: "\CÓDIGO DO ÍCONE";
        font-family: 'FontAwesome';
     padding: 0 4px;
    }

Onde devemos preencher as informações corretamente, no caso mudar a cor do grupo para o grupo desejado e o código do ícone que está disponível no site que eu passei.

Caso deseje inserir o ícone depois do nick do usuário e não antes, basta trocar o :before por :after..

Não esqueça de reputar e marcar como Obrigado.
Até. zen
Já vi esse código em um fórum, mais não quero o fontAwesome, quero por uma imagem mesmo.
Achei aqui: http://narutorpgakatsuki.com.br/
GXGamer

GXGamer
Nível 5

Masculino
Inscrito dia : 03/03/2014
Mensagens : 37
Pontos Ativos : 67

http://expertcraftsurvival.forumeiros.com/forum

Atendido / Resolvido Re: imagem no nome

Mensagem por GSCode em 09.02.16 16:08

Ola,
Veja se resulta:

Código:
jQuery(document).ready(function(){jQuery('a[href="/uID"]').before('<img src="IMAGEM">')});

ID = ID do usuário.
IMAGEM = Link da imagem.

Ate!
GSCode

GSCode
Usuário destaque

Masculino
Inscrito dia : 11/10/2013
Mensagens : 590
Pontos Ativos : 1031

http://testforumbrasil.forumeiros.com/forum

Atendido / Resolvido Re: imagem no nome

Mensagem por GXGamer em 09.02.16 16:14

Podem fechar, resolvido
GXGamer

GXGamer
Nível 5

Masculino
Inscrito dia : 03/03/2014
Mensagens : 37
Pontos Ativos : 67

http://expertcraftsurvival.forumeiros.com/forum

Atendido / Resolvido Re: imagem no nome

Mensagem por RafaelS. em 09.02.16 17:28

imagem no nome Symbol10 Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".


Eu sou o RafaelS.,
Eu aconselho-lhe ler os seguintes tópicos:

Seta Para evitar ser punido é importante que leia  o regulamento geral do Fórum dos fóruns.
Seta Antes de criar o seu pedido de suporte certifique-se de ler o regulamento da seção de suporte.
Seta Quando for criar o seu tópico tente ser o mais específico possível, para que nós possámos entender!

"O importante não é vencer todos os dias, mas lutar sempre."
imagem no nome XCPergr
imagem no nome 6KeRsER
RafaelS.

RafaelS.
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 26/04/2014
Mensagens : 4990
Pontos Ativos : 5962

http://techmais.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum