Personalização dos nicks dos membros

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

Atendido / Resolvido Personalização dos nicks dos membros

Mensagem por Feranubis_ 05.06.20 19:36

Detalhes da questão


Endereço do fórum: https://pmcem.forumeiros.com/
Versão do fórum: ModernBB

Descrição


Boa tarde,

procurei pela fórum do Forumeiros sobre a personalização de nicks dos membros, mas acabei não encontrando uma que me agradasse.
Gostaria que os nicks dos membros do meu fórum mudassem de acordo com o grupo que participam. Gostaria de efeitos semelhantes aos dessa imagem: https://prnt.sc/sujjqc . Alguns nicks até piscam... isso seria muito bom. Se puderem me disponibilizar algum código que faça esses efeitos, eu agradeço! Se existirem mais efeitos além desses que souberem e puderem me passar, eu também ficaria grato, ou até mesmo onde posso achá-los.


Att. Feranubis
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Chagas 05.06.20 19:49

Saudações,

Localize o template overall_header e clique no Editar e depois localize a variável {CSS} e, logo abaixo dela, cole o código dos ícones:

Código:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" />

Ficando desse modo:

Código:
{CSS}
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" />

Não esqueça de publicar o template.

Depois vai à folha de estilo CSS e coloque o código seguinte:

Código:
div [style*="#A62323"]::before {
    font-family: "Font Awesome 5 Free";
    content: '\f714';
    margin-right: 3px;
    font-weight: 1000;
    font-size: 12px;
}

Presta atenção nesses detalhes:

div [style*="#A62323"]::before {
   font-family: "Font Awesome 5 Free";
   content: '\f714';
   margin-right: 3px;
   font-weight: 1000;
   font-size: 12px;
}

O que deixei destaque é para você fazer as alterações de acordo com cada grupo, o primeiro que está destacado você deve colocar a mesma cor hexadecimal do grupo que está no momento (por exemplo, se você colocou primeiro grupo com a cor #ff0000, logo para colocar um ícone ao lado será "div [style*="#ff0000"]::before {", deve colocar como  e o segundo é o código de cada icone que você pode encontrar nesse site: https://fontawesome.com/icons?d=gallery

Atenciosamente,
Chagas


ff0000 - Personalização dos nicks dos membros IX6xWl9
"Eu quero um punhado de estrelas... eu quero a doçura do verbo viver."

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

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

Chagas

Chagas
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/10/2015
Mensagens : 876
Pontos ativos : 1081

https://pelotao.forumeiros.com

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 05.06.20 20:05

Obrigado, mas eu acho que não deu certo... eu fui até o site, salvei a imagem e depois copei o endereço da imagem e coloquei na folha CSS... mas ainda não entendi onde que especifico o grupo.

Ficou assim:

Código:


div [style*="#A62323"]::before {
   font-family: "https://i.imgur.com/3oVrQn1.png";
   content: '\f714';
   margin-right: 3px;
   font-weight: 1000;
   font-size: 12px;
}
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por RafaelS. 05.06.20 21:51

Olá "@Feranubis_",

Fórum em manutenção


Para que possamos dar continuidade, o seu fórum não pode estar em manutenção. Seu tópico ficará pendente até você retirar o modo de manutenção. Caso não seja retirado nos próximos dois dias, este será movido para lixeira.

Tópico pendente.

Você não tem que colar o link da imagem no código, não é desse jeito que funciona.
Altere para o código passado anteriormente, para que possamos prosseguir e lhe explicar como funcionam os ícones. Feliz

Atenciosamente,
RafaelS. King
RafaelS.

RafaelS.
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 26/04/2014
Mensagens : 5748
Pontos ativos : 7154

http://techmais.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 05.06.20 21:56

Pronto.
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por RafaelS. 05.06.20 22:40

@Feranubis_ escreveu:Pronto.

Olá!

Você retirou todos os códigos do fórum? Volte a seguir os passos mencionados pelo ajudeiro @Chagas, por favor.

Atenciosamente,
RafaelS. King
RafaelS.

RafaelS.
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 26/04/2014
Mensagens : 5748
Pontos ativos : 7154

http://techmais.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 06.06.20 2:28

Eu acabei esquecendo a senha da conta fundadora do fórum, então agora preciso esperar 90 minutos pra tentar login novamente... se quiser fechar o caso, sem problemas... vou recomeçar do 0 assim que eu consegui entrar na conta.

Obrigado!

Att. Feranubis
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Chanp 06.06.20 2:41

Boa noite @Feranubis_,

Irei assumir a sua questão a partir de agora.
Retire todos os códigos passados neste tópico pelos meus colegas e adicione este código na sua folha de estilo CSS:

Código:
div [style*="#FF5900"]::before {
  font-family: "Font Awesome 5 Free"; 
  content:'\f2c2';
  margin-right: 3px;
  font-weight: 1000;
  font-size: 12px;
}

A cor #FF5900 pode e deve ser alterada pela cor do grupo que você quer adicionar o ícone. Esta cor pode ser conferida na página de Administração de Grupos. Você terá que criar um código deste para cada ícone que quiser adicionar.

O unicode f2c2 deve ser alterado pelo unicode do ícone que você deseja adicionar. A lista desses ícones pode ser conferida clicando aqui. Ao encontrar o ícone desejado, clique nele e repare na parte acima do ícone. Você verá algo semelhante a isso. O f6ae da imagem apresentada por mim é o unicode deste ícone. Você precisará pegar o unicode do ícone que deseja colocar ao lado do grupo.

Se a explicação acima estiver confusa, basta me informar que eu explico de outro modo.
Isso resolve a sua questão?
Chanp Feliz
Chanp

Chanp
Membro do Fórum

Masculino
Inscrito dia : 04/01/2018
Mensagens : 1072
Pontos ativos : 1191

https://2forum2.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 06.06.20 4:09

Olá!

Consegui inserir a imagem, muito obrigado! Mas agora, como consigo fazê-la, junto aos nicks dos membros de determinado grupo, ficar piscando? Aguardo uma resposta! Obrigado!!!
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Chanp 06.06.20 4:16

Isso é efeito com uma propriedade do CSS chamada de animação mas, para utilizá-la, preciso que seja mais específico dizendo-me qual animação você deseja. Uma imagem ou algo do tipo ajudaria bastante.

Chanp
Chanp

Chanp
Membro do Fórum

Masculino
Inscrito dia : 04/01/2018
Mensagens : 1072
Pontos ativos : 1191

https://2forum2.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 06.06.20 4:27

Obrigado por me responder. Gostaria muito de um efeito em que o nick e a imagem ao lado do mesmo ficassem mudando de cor repetidamente, mais ou menos dessa forma: https://prnt.sc/suqg4p , https://prnt.sc/suqgds , https://prnt.sc/suqgiw (acredito que consegue-se ver que os nicks destacados mudam de cor, numa transição de aproximadamente 0.8 segundos).

Espero que possa me ajudar!

Att. Feranubis
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por RafaelS. 06.06.20 11:29

Olá @Feranubis_,

Adicione à sua folha de estilos (CSS), o seguinte código:

Código:
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}}
a[style*="#FF5900"], span[style*="#FF5900"] {
    background: repeating-linear-gradient(to right, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
    -webkit-background-clip: text;
    background-size: 1800% 1800%;
    -webkit-text-fill-color: transparent;
    animation: rainbow 3s ease infinite;
}

Admineiros O efeito será aplicado no grupo com a cor FF5900, para alterar procure esse valor no código.

Atenciosamente,
RafaelS. King
RafaelS.

RafaelS.
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 26/04/2014
Mensagens : 5748
Pontos ativos : 7154

http://techmais.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Feranubis_ 06.06.20 17:11

Deu certo. Muito obrigado!
Feranubis_

Feranubis_
Nível 4

Masculino
Inscrito dia : 31/05/2020
Mensagens : 29
Pontos ativos : 41

https://pmcem.forumeiros.com/

Atendido / Resolvido Re: Personalização dos nicks dos membros

Mensagem por Chanp 06.06.20 17:13

Tópico resolvido


Movido para "Questões resolvidas".
Chanp

Chanp
Membro do Fórum

Masculino
Inscrito dia : 04/01/2018
Mensagens : 1072
Pontos ativos : 1191

https://2forum2.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