Nick com icone

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

Atendido / Resolvido Nick com icone

Mensagem por ranzatti em 12.12.17 13:44

Detalhes da questão


Endereço do fórum: http://policia-militar-sf.forumeiros.com/forum
Versão do fórum: phpBB3

Descrição


olá eu gostaria de saber como colocar um ícone de arvore de natal no meu nick como esse aqui > http://prntscr.com/hmgwup
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por xDominiC_. em 12.12.17 14:27

Tenho aqui uma sugestão:

para staffs (membros em grupos)

CSS:

Código:
a[href*="/u"] strong {[size=16][/size]
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%, url("http://i39.servimg.com/u/f39/17/95/88/56/backro10.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);[size=16][/size]
    color: green;[size=16][/size]
    font-weight: bold;[size=16][/size]
    padding-left: 19px;[size=16][/size]
}[size=16][/size]
em {[size=16][/size]
    font-style: normal;[size=16][/size]
}[size=16][/size]
.color_red {[size=16][/size]
    color: #d81e1e;[size=16][/size]
}[size=16][/size]
.color_green {[size=16][/size]
    color: #1a9132;[size=16][/size]
}
JS (investimento em todas as páginas)
Código:
$(document).ready(function() {[size=16][/size]
    doChristmas();[size=16][/size]
    [size=16][/size]
    setTimeout(function() { doChristmas(); }, 1000);[size=16][/size]
});[size=16][/size]
function doChristmas() {[size=16][/size]
    $('a[href*="/u"] strong').each(function(){[size=16][/size]
        var letters = $(this).text().split('');[size=16][/size]
        $(this).text('');[size=16][/size]
        for(var i = 0; i < letters.length; i++){[size=16][/size]
            if(i % 2 == 0){[size=16][/size]
                $(this).append('<em class="color_red">' + letters[i] + '</em>');[size=16][/size]
            }else{[size=16][/size]
                $(this).append('<em class="color_green">' + letters[i] + '</em>');[size=16][/size]
            }[size=16][/size]
        }[size=16][/size]
    });[size=16][/size]
}
ou membros
Código:
a[href*="/u"] {[size=16][/size]
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%, url("http://i39.servimg.com/u/f39/17/95/88/56/backro10.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);[size=16][/size]
    color: green;[size=16][/size]
    font-weight: bold;[size=16][/size]
    padding-left: 19px;[size=16][/size]
}
xDominiC_.

xDominiC_.
Nível 9

Masculino
Inscrito dia : 06/10/2017
Mensagens : 207
Pontos Ativos : 318

Ver perfil do usuário http://trg1-nwd.forumeiros.com/

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 14:56

não entendi oque eu edito no codigo de grupo pq eu coloquei de membro ficou assim

http://prntscr.com/hmi3mi
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Harleen em 12.12.17 16:00

Veja essa mensagem do Shek nesse tópico.

https://ajuda.forumeiros.com/t109174-rank-em-css#765766

Até mais
Harleen

Harleen
Membro do Fórum

Feminino
Inscrito dia : 09/07/2012
Mensagens : 1696
Pontos Ativos : 2245

Ver perfil do usuário http://master-publicitario.forumeiros.com/

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 17:18

@Harleen escreveu:Veja essa mensagem do Shek nesse tópico.

https://ajuda.forumeiros.com/t109174-rank-em-css#765766

Até mais

minha pergunta tem nada haver com rank mais de boa!
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Pedxz em 12.12.17 18:13

Então, vou simplificar alguns códigos que você, que poderá usar:

Com fontawesome ( tree icon ), usado para os grupos/usuários do mesmo.
Código:
div [style*="cor do grupo"]::before{
  content: '\F1BB ';
  font-family: FontAwesome;
  font-size: 10.5px;
  margin-right: 4px;
  vertical-align: middle;
  }

Demo ver

Pôr o ícone somente a um ou a mais usuários:

Código:

a[href*="/uID"] {
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%, url("http://i39.servimg.com/u/f39/17/95/88/56/backro10.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: green;
    font-weight: bold;
    padding-left: 19px;
}

@Edit

http://prntscr.com/hmi3mi

para tira um dos ícones, vá ao js, e remova o campo background: code ;




Última edição por Pedxz em 12.12.17 20:52, editado 1 vez(es)
Pedxz

Pedxz
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 13/01/2017
Mensagens : 2800
Pontos Ativos : 3553

Ver perfil do usuário https://pedxz.forumeiros.com

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 19:43

codigos não estão funcionando como pode ver na imagem abaixo

http://prntscr.com/hmmoz5
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Pedxz em 12.12.17 20:02

@ranzatti escreveu:codigos não estão funcionando como pode ver na imagem abaixo

http://prntscr.com/hmmoz5


Qual deles você está a usar?
Pedxz

Pedxz
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 13/01/2017
Mensagens : 2800
Pontos Ativos : 3553

Ver perfil do usuário https://pedxz.forumeiros.com

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 20:10

@Pedxz escreveu:
@ranzatti escreveu:codigos não estão funcionando como pode ver na imagem abaixo

http://prntscr.com/hmmoz5


Qual deles você está a usar?

esse aqui abaixo e me diga uma coisa no seu primeiro codigo do grupo cade o link da imagem do efeito?

Código:
a[href="/uID]:: before {
background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%;
}
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Pedxz em 12.12.17 20:15

@ranzatti escreveu:
@Pedxz escreveu:
@ranzatti escreveu:codigos não estão funcionando como pode ver na imagem abaixo

http://prntscr.com/hmmoz5


Qual deles você está a usar?

esse aqui abaixo e me diga uma coisa no seu primeiro codigo do grupo cade o link da imagem do efeito?

Código:
a[href="/uID]:: before {
background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%;
}

No caso a imagem é o Icon Awesome
http://fontawesome.io/icons/

No outro código onde está ID você têm que pôr um id do usuário ou deixar só [/u]
Pedxz

Pedxz
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 13/01/2017
Mensagens : 2800
Pontos Ativos : 3553

Ver perfil do usuário https://pedxz.forumeiros.com

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 20:19

Então como podemos ver na minha folha CSS está tudo certo o codigo mais não funciona

http://prntscr.com/hmn9ds
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Eduardo Lima em 12.12.17 22:05

Como que você consegue complicar um código tão simples?
Código:
a[href*="/uID"] strong {
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%;
    padding-left: 17px;
    padding-top: 2px;
}
Edite como quiser os padding.


Abraço Rene o/


Última edição por Eduardo Lima em 12.12.17 22:07, editado 1 vez(es)
avatar

Eduardo Lima
Nível 9

Inscrito dia : 07/03/2016
Mensagens : 243
Pontos Ativos : 380

Ver perfil do usuário http://www.brasilplayforever.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Konai em 12.12.17 22:07

Olá!

Retire todos os códigos fornecidos anteriormente. Feito isto, crie um novo JS com investimento em todas as páginas com o seguinte código:
Código:
jQuery(document).ready(function(){jQuery('a[href="/uID"]').before('<img src="http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png">')});
Modifique o ID para o desejado. Por exemplo o senhor, se for o fundador será u1.

Att! Feliz
Konai

Konai
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6034
Pontos Ativos : 7532

Ver perfil do usuário http://narutongo.forumeiros.com/

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 22:28

Então Gaara fica bugado olha a imagem abaixo

http://prntscr.com/hmp2g1

ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Pedxz em 12.12.17 22:30

@xDominiC_. escreveu:Tenho aqui uma sugestão:

para staffs (membros em grupos)

CSS:

Código:
a[href*="/u"] strong {[size=16][/size]
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%, url("http://i39.servimg.com/u/f39/17/95/88/56/backro10.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);[size=16][/size]
    color: green;[size=16][/size]
    font-weight: bold;[size=16][/size]
    padding-left: 19px;[size=16][/size]
}[size=16][/size]
em {[size=16][/size]
    font-style: normal;[size=16][/size]
}[size=16][/size]
.color_red {[size=16][/size]
    color: #d81e1e;[size=16][/size]
}[size=16][/size]
.color_green {[size=16][/size]
    color: #1a9132;[size=16][/size]
}
JS (investimento em todas as páginas)
Código:
$(document).ready(function() {[size=16][/size]
    doChristmas();[size=16][/size]
    [size=16][/size]
    setTimeout(function() { doChristmas(); }, 1000);[size=16][/size]
});[size=16][/size]
function doChristmas() {[size=16][/size]
    $('a[href*="/u"] strong').each(function(){[size=16][/size]
        var letters = $(this).text().split('');[size=16][/size]
        $(this).text('');[size=16][/size]
        for(var i = 0; i < letters.length; i++){[size=16][/size]
            if(i % 2 == 0){[size=16][/size]
                $(this).append('<em class="color_red">' + letters[i] + '</em>');[size=16][/size]
            }else{[size=16][/size]
                $(this).append('<em class="color_green">' + letters[i] + '</em>');[size=16][/size]
            }[size=16][/size]
        }[size=16][/size]
    });[size=16][/size]
}
ou membros
Código:
a[href*="/u"] {[size=16][/size]
    background: url("http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png") no-repeat scroll 0 0%, url("http://i39.servimg.com/u/f39/17/95/88/56/backro10.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);[size=16][/size]
    color: green;[size=16][/size]
    font-weight: bold;[size=16][/size]
    padding-left: 19px;[size=16][/size]
}

Remova isto e uso somente o js que a @Gaaratsu fez
Pedxz

Pedxz
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 13/01/2017
Mensagens : 2800
Pontos Ativos : 3553

Ver perfil do usuário https://pedxz.forumeiros.com

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 22:32

então eu fiz exatamente oque o @Gaaratsu fez está meio bugado como na imagem ao lado > http://prntscr.com/hmp2g1
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Konai em 12.12.17 23:31

Substitua por este querido:
Código:
jQuery(function(){jQuery('a[href="/uID"]:contains("SEU_NOME_DE_USUÁRIO")').before('<img src="http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png">')});
Procure no código acima o "ID" e "SEU_NOME_DE_USUÁRIO" - Substitua para o seu id e seu nome de usuário exatamente como está no fórum.

Se quiser adicionar antes e depois do nome de usuário, substitua o código por este:
Código:
jQuery(function(){jQuery('a[href="/uID"]:contains("SEU_NOME_DE_USUÁRIO")').before('<img src="http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png">')});
jQuery(function(){jQuery('a[href="/uID"]:contains("SEU_NOME_DE_USUÁRIO")').after('<img src="http://i39.servimg.com/u/f39/17/95/88/56/xmas_t10.png">')});
Com as mesmas alterações citadas logo acima! Positivo

Att! Feliz
Konai

Konai
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6034
Pontos Ativos : 7532

Ver perfil do usuário http://narutongo.forumeiros.com/

Atendido / Resolvido Re: Nick com icone

Mensagem por ranzatti em 12.12.17 23:35

Agora sim ficou legal obrigado novamente podem fechar!
ranzatti

ranzatti
Usuário avançado

Masculino
Inscrito dia : 02/09/2010
Mensagens : 430
Pontos Ativos : 617

Ver perfil do usuário http://brnewgeneration.forumeiros.com/forum

Atendido / Resolvido Re: Nick com icone

Mensagem por Konai em 12.12.17 23:38

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

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'.
Konai

Konai
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6034
Pontos Ativos : 7532

Ver perfil do usuário http://narutongo.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