Como adicionar o ícone conectado ao lado do nome

3 participantes

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

Tópico resolvido Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 04.02.22 20:06

Detalhes da questão


Endereço do fórum: https://lucianomicle.foroactivo.com/
Versão do fórum: AwesomeBB

Descrição


Olá amigos!
Eu tenho esse código, mas funciona para PhppBB3 e agora estou usando a versão AwesomeBB
Spoiler:
Tenho um código que funciona no Phppbb3, queria usá-lo para colocar na minha nova versão que estou usando mas não funciona para mim.
Deixo o código para ver o que pode ser feito

Código:
$(function() {
$('.post.online').find(".authname").prepend('<img src="https://i.servimg.com/u/f13/19/81/07/80/useron10.gif" alt="conectado" title="Conectado"/> ');
  $('.post:not(.online)').find(".authname").prepend('<img src="https://i.servimg.com/u/f13/19/81/07/80/userof10.gif" alt="desconectado" title="Desconectado"/> ');
});
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por pedxz 04.02.22 22:09

Olá @LucianoMicle,

Mas a #awesomebb já tem os ícones de estado por defeito. Qual será o propósito de adaptar o código? Adicionar o estado Offline?! Redirecionar?


(Aguardo uma resposta sua)
Atenciosamente,
pedxz.
pedxz

pedxz
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7019
Pontos ativos : 8247

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 0:02

Olá @Pedxz

Sim, eles têm seus códigos, mas eu não sei como editá-los, então quero adicionar o código que imprimi no meu fórum Phpbb3 ao AwesomeBB

Sinceramente,
Luciano.
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por Musashi 05.02.22 1:27

Olá, boa noite @LucianoMicle!

O mesmo pode me informar onde você quer que esse código funcione?

(Aguardo respostas).
Atenciosamente,
Wusthy. Muito feliz
Musashi

Musashi
Ajudeiro
Ajudeiro

Masculino
Membro desde : 17/02/2021
Mensagens : 400
Pontos ativos : 479

https://lucasthemes.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 1:46

Wusthy escreveu:Olá, boa noite @LucianoMicle!

O mesmo pode me informar onde você quer que esse código funcione?

(Aguardo respostas).
Atenciosamente,
Wusthy. Muito feliz

Olá boa noite @Wusthy

Sim, quero usar o código ao lado do apelido, parte esquerda.

Saudações
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por Musashi 05.02.22 1:52

Olá @LucianoMicle

Seria nessa parte? Como adicionar o ícone conectado ao lado do nome 2FkJuhd
Musashi

Musashi
Ajudeiro
Ajudeiro

Masculino
Membro desde : 17/02/2021
Mensagens : 400
Pontos ativos : 479

https://lucasthemes.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 2:00

Como adicionar o ícone conectado ao lado do nome 12312310

É onde eu gostaria de colocar o ícone, seja online ou offline.
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por pedxz 05.02.22 14:03

Apage o script e adicione na folha de estilo (CSS) o seguinte código:
Código:
.online .post-author-status {
  display: none !important;
}

.post-wrap .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/userof10.gif);
  padding-right: .5rem;
}

.online .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/useron10.gif);
}
pedxz

pedxz
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7019
Pontos ativos : 8247

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 20:02

Olá! @Pedxz
Parece ótimo, mas você pode adicionar um sinal que diga se está offline ou online?
É como uma dica de ferramenta.

Saudações!
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por Musashi 05.02.22 20:21

Olá @LucianoMicle!

Modifique o código de sua Folha de estilo (CSS) passada pelo meu amigo @pedxz
E adicione essa abaixo:

Código:
.online .post-author-status {
  display: none !important;
}
 
.post-wrap .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/userof10.gif) 'Offline';
  padding-right: .5rem;
}
 
.online .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/useron10.gif) 'Online';
}

Acredito que esteja mais fácil de identificar quando está offline e/ou online! Muito feliz
Musashi

Musashi
Ajudeiro
Ajudeiro

Masculino
Membro desde : 17/02/2021
Mensagens : 400
Pontos ativos : 479

https://lucasthemes.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 20:25

Como adicionar o ícone conectado ao lado do nome Re110

Alguma solução que saia como um tipo de dica de ferramenta ao passar o mouse?
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por Musashi 05.02.22 20:37

Olá @LucianoMicle!

Modifique o código anterior para esse aqui abaixo:

Código:
.online .post-author-status {
  display: none !important;
}
 
.post-wrap .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/userof10.gif);
  padding-right: .5rem;
}
.post-wrap .post-author-name:hover::before {
  content: 'Desconectado';
  background: red;
  border-radius: 5px;
  color: white;
  display: inline-flex;
  margin-right: 5px;
  padding-left: 7px;
  padding-right: .5rem;
}
.online .post-author-name::before {
  content: url(https://i.servimg.com/u/f13/19/81/07/80/useron10.gif) ;
}
.online .post-author-name:hover::before {
  content: 'En Linea';
  background: #0cac04;
  border-radius: 5px;
  color: white;
  display: inline-flex;
  margin-right: 5px;
  padding-left: 7px;
  padding-right: .5rem;
}
Musashi

Musashi
Ajudeiro
Ajudeiro

Masculino
Membro desde : 17/02/2021
Mensagens : 400
Pontos ativos : 479

https://lucasthemes.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por LucianoMicle 05.02.22 20:40

Eu sou excelente! Muito Obrigado.

Até a próxima
LucianoMicle

LucianoMicle
Nível 9

Masculino
Membro desde : 07/09/2019
Mensagens : 239
Pontos ativos : 357

https://divtes.foroactivo.com/ https://www.facebook.com/facebook.com/lucianomicleok https://twitter.com/twitter.com/lucianomicleok

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Como adicionar o ícone conectado ao lado do nome

Mensagem por Musashi 05.02.22 20:42

De nada, amigo. Muito feliz

Tópico resolvido


Movido para "Questões resolvidas".

Tópico movido


O tópico foi movido para o setor: Questões sobre a aparência do fórum.

Nota: É importante que procure escolher a área certa para a sua questão afim de manter a organização do fórum.
Para mais informações, leia o Regulamento do Fórum dos Fóruns
Musashi

Musashi
Ajudeiro
Ajudeiro

Masculino
Membro desde : 17/02/2021
Mensagens : 400
Pontos ativos : 479

https://lucasthemes.forumeiros.com/

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

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