imagem no nome

3 participantes

Ir para baixo

Tópico resolvido imagem no nome

Mensagem por GXGamer 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
*

Membro desde : 03/03/2014
Mensagens : 37
Pontos : 67

http://expertcraftsurvival.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: imagem no nome

Mensagem por GSCode 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
Membro

Membro desde : 11/10/2013
Mensagens : 591
Pontos : 1031

http://testforumbrasil.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: imagem no nome

Mensagem por GXGamer 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
*

Membro desde : 03/03/2014
Mensagens : 37
Pontos : 67

http://expertcraftsurvival.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: imagem no nome

Mensagem por GSCode 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
Membro

Membro desde : 11/10/2013
Mensagens : 591
Pontos : 1031

http://testforumbrasil.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: imagem no nome

Mensagem por GXGamer 09.02.16 16:14

Podem fechar, resolvido
GXGamer
GXGamer
*

Membro desde : 03/03/2014
Mensagens : 37
Pontos : 67

http://expertcraftsurvival.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: imagem no nome

Mensagem por RafaelS. 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".
avatar
RafaelS.
Membro Entusiasta

Membro desde : 26/04/2014
Mensagens : 5746
Pontos : 7156

http://techmais.forumeiros.com/

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos