Chatbox personalizado

Detalhes da questão

Endereço do fórum: http://redestoryrankup.forumeiros.com
Versão do fórum: ModernBB

Descrição

Como deixo o chat box dessa maneira?
https://prnt.sc/svmq45

E diminuo um pouco? Deixo ele apenas maior de largura e pouco de altura

Olá @ElevenFraca_,

Adicione na sua folha de estilo o seguinte código:

Código:

[id^="chatbox_"] {
     width: 100% !important;
     height: 450px !important;
}

Ajuste a largura 100% e a altura 450px para os valores pretendidos!

Lembre-se que este fórum de suporte gratuito para fóruns Forumeiros não aceita o plágio, sendo que as suas questões poderão ser movidas automaticamente para a "Lixeira".


Atenciosamente,
pedxz.

Olá,

Eu ajustei o mesmo para a largura 100% e altura 150px.

Mas o chatbox ficou dessa maneira: https://prnt.sc/svywf1

E mais uma coisa, eu quero colocar o título Rede Story em cima do ChatBox.
Fico grato

Altere o código de cima para:

Código:

#chatbox_top,
#chatbox_bottom {
    width: 100% !important;
    height: 150px !important;
}
 
.chat-title {
  font-size: 0;
}
 
.chat-title::before,
#nb-users-connected {
  font-size: 12px;
}
 
.chat-title::before {
  content: 'Rede Story';
}

Olá, o chat box ficou assim: https://prnt.sc/sxij8n

Não apareceu "Rede Story" Como título, o botão conectar-se sumiu, dá para usar ele apenas passando o mouse por cima (Linha vermelha com seta no canto direito).

Quando conectar fica assim: https://prnt.sc/sxikb0
A imagem avatar do usuario some!

+1 favor: Além de arrumar tais pedidos, queria que fizesse com que a imagem (print 1) sumida de quando o usuario fica desconectado do chat box seja Essa: http://prnt.sc/sxilod, e quando o usuario se conectar a imagem seja substituida para a do avatar dele mesmo.

Tem como? Fico agradecido

ElevenFraca_ escreveu:Olá, o chat box ficou assim: https://prnt.sc/sxij8n

Não apareceu "Rede Story" Como título, o botão conectar-se sumiu, dá para usar ele apenas passando o mouse por cima (Linha vermelha com seta no canto direito).

O código passado em cima é funcional, tente alterar para:

Código:

#chatbox_top,
#chatbox_bottom {
    width: 100% !important;
    height: 150px !important;
}
 
.chat-title {
  font-size: 0;
}
 
.chat-title::before,
#nb-users-connected {
  font-size: 12px;
  color: white!important;
}
 
.chat-title::before {
  content: 'Rede Story';
}

Olá, ainda não foi resolvido, o avatar não aparece como eu pedi anteriormente, botões só funcionam se passar o mouse em cima, e quero "Rede Story" centralizado no chatbox
https://prnt.sc/syrmna

https://prnt.sc/syrnb8

Altere o código em cima para:

Código:

#chatbox_top,
#chatbox_bottom {
    width: 100% !important;
    height: 150px !important;
}
 
.chat-title {
  font-size: 0;
}
 
.chat-title::before,
#nb-users-connected,
.chatbox-options a {
  font-size: 12px;
  color: white!important;
}
 
.chat-title::before {
  content: 'Rede Story';
}
 
.chatbox-title {
  width: 80%!important;
  text-align: center;
}
 
.chatbox-options {
  width: 20%!important;
  text-align: right;
}

Olá senhor Pedxz,

O chatbox ficou dessa maneira: https://prnt.sc/t07neq
Não é como pedi

O título "Rede Story" Não centralizou, e quero o título com a letra um pouco maior e letra de forma.
E a imagem do usuário não aparece nem desconectado e nem conectado.

ElevenFraca_ escreveu:O título "Rede Story" Não centralizou,

O título ficou centralizado de acordo com o "Conectar-se".

e quero o título com a letra um pouco maior e letra de forma.

Altere o código CSS apresentado em cima para:

Código:

#chatbox_top,
#chatbox_bottom {
    width: 100% !important;
    height: 150px !important;
}
 
.chat-title {
  font-size: 0;
}
 
.chat-title::before,
#nb-users-connected,
.chatbox-options a {
  font-size: 12px;
  color: white!important;
}
 
.chat-title::before {
  content: 'Rede Story';
  font-size: 18px!important;
  font-weight: bold!important;
  text-transform: uppercase;
}
 
.chatbox-title {
  width: 80%!important;
  text-align: center;
}
 
.chatbox-options {
  width: 20%!important;
  text-align: right;
}

E a imagem do usuário não aparece nem desconectado e nem conectado.

Devemos focar em uma coisa de cada vez, primeiramente estamos a customizar o seu chatbox, após concluir avançaremos para o avatar!

Problema resolvido!