Personalizar chatbox

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

Resolvido Personalizar chatbox

Mensagem por Lamark em 16/06/13, 02:14 pm

Qual é minha questão:
Olá Convidado, estava tentando personalizar o meu chatbox, fazendo tudo certo, acedendo códigos ao CSS, mas continua do mesmo jeito.


Endereço do meu fórum:
http://netforcef.forumeiros.com

Versão do fórum:
PUNBB


Última edição por Lamark em 16/06/13, 05:39 pm, editado 1 vez(es)
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Resolvido Re: Personalizar chatbox

Mensagem por -Yts em 16/06/13, 02:21 pm

Olá,


:seta2:  Qual tipo de chatbox?
:seta2: Tem como mandar sua folha css?
:seta2: Te como mandar o Link do tutorial do chatbox personalizado?

Ate mais!

-Yts
Nível 8

Masculino
Inscrito dia : 26/05/2013
Mensagens : 130
Pontos Ativos : 210

Ver perfil do usuário http://powerduckets.forumfacil.net/

Resolvido Re: Personalizar chatbox

Mensagem por Lamark em 16/06/13, 02:24 pm

Olá,
Esse chatbox: http://prntscr.com/1aa4xm
Código:
#pun-head #pun-navlinks {background-color: black !important;}
.guestMessage {
background: url("http://www.ipbforumskins.com/skindemo/public/style_images/marble34x/highlight.png") repeat-x scroll 0px 0px rgb(56, 168, 255);
border: 1px solid rgb(255, 255, 255);
color: rgb(255, 255, 255);
font-size: 13px;
line-height: 140%;
box-shadow: 0px 1px 4px rgb(253, 229, 187);
margin: 0 auto;
margin-top: 30px;
margin-bottom: 10px;
padding: 10px;
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.55);}

a[href="http://netforcef.forumeiros.com/u1] {
background-image: url("http://i46.servimg.com/u/f46/16/56/73/62/21ee1p10.gif");
}
.chatbox-title {
float: left;
margin: 0;
padding: 2px 5px 0;
width: 15em;
}
.chatbox-title, .chatbox-title a.chat-title {
color: #dedfdf;
text-decoration: none;
}
.chatbox-title {
float: left;
margin: 0;
padding: 2px 5px 0;
width: 15em;
}
.chatbox-title, .chatbox-title a.chat-title {
color: #dedfdf;
text-decoration: none;
}
* {
margin: 0;
padding: 0;
}
* {
margin: 0;
padding: 0;
}
user agent stylesheeth2 {
display: block;
font-size: 1.5em;
-webkit-margin-before: 0.83em;
-webkit-margin-after: 0.83em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
font-weight: bold;
}
Pseudo ::before element
.chatbox-title:before {
content: "ppf chat";
font-family: 'Trebuchet MS';
font-size: 20px;
color: #ffffff;
}
Inherited from div#chatbox_header.main-head
#chatbox_header.main-head {
color: #dedfdf;
}
Inherited from body
body {
color: #4E565E;
font: normal 11px "Trebuchet MS",tahoma,helvetica,arial,sans-serif;
}
body {
color: #333;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
}
#chatbox_footer {
background-image: url(http://i.imgur.com/IigIQQt.png);
width:100%;
background-repeat:no-repeat;
}
a#return_to_ipbfs {
position: fixed;
bottom: 10px;
line-height: 16px;
text-align: left;
right: 10px;
z-index: 1;
opacity: 0.8;
width: 260px;
height: 70px;
background: #cf3737;
color: #fff;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #771b1b;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #f66c6c 0px 1px 0px;
border-radius: 3px;
}
#bar_float a {
position: fixed;
bottom: 80px;
text-decoration: none;
right: 20px;
z-index: 999;
}
a {
color: #fc6204;
}
user agent stylesheeta:-webkit-any-link {
color: -webkit-link;
text-decoration: underline;
cursor: auto;
}
div, table, tr, td, a, br, iframe, embed{cursor:url(http://img24.imageshack.us/img24/7129/glovecursor.png)

,progress;}a:hover{cursor:url(http://img24.imageshack.us/img24/7129/glovecursor.png),

progress;}
#chatbox_messenger_form div.right img {
visibility: hidden;
}
#divsmilies img + img {
visibility: visible!important;
}
#divbold , #divitalic , #divunderline , #divstrike , #divcolor , #divsmilies{
background-repeat: no-repeat;
background-position: center;
border-radius: 5px;
border: 1px solid #383838;}

#divbold {background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/bold10.png");}
#divitalic{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/italic10.png");}
#divunderline{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/underl10.png");}
#divstrike{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/strike10.png");}
#divcolor{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/font_c11.png");}
#divsmilies{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png");}
#secondary_navigation.stickyTop {
position: fixed;
width: 100%;
top: 0;
left: 0;
z-index: 999;
background: url("http://www.ipbforumskins.com/skindemo/public/style_images/marble34x/trans80.png") repeat;
background: rgba(0, 0, 0, 0.8);
}
#secondary_navigation {
font-size: 11px;
text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 1px;
line-height: 37px;
}
#secondary_navigation {
background: #1C1C1C;
font-size: 11px;
text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 1px;
-webkit-box-shadow: rgba(255, 255, 255, 0.05) 0px 1px 0px;
-moz-box-shadow: rgba(255,255,255,0.05) 0px 1px 0px;
box-shadow: rgba(255, 255, 255, 0.05) 0px 1px 0px;
border-bottom: 1px solid #0D0D0D;
overflow: hidden;
line-height: 37px;
clear: both;
}
* {
margin: 0;
padding: 0;
}
user agent stylesheetdiv {
display: block;
}
Pseudo ::after element
.clearfix::after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
overflow: hidden;
}
.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
Inherited from body
body {
color: #4E565E;
font: normal 11px "Trebuchet MS",tahoma,helvetica,arial,sans-serif;
}
body {
color: #333;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
}
#chatbox {
background-image: url(http://illiweb.com/fa/admin/icones/help_pt.png);
background-repeat: no-repeat;
background-position: bottom right;
}

a#janela {
position: fixed;
bottom: 10px;
line-height: 16px;
text-align: left;
right: 10px;
z-index: 1;
opacity: 0.8;
width: 260px;
height: 70px;
background: #cf3737;
color: #fff;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #771b1b;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #f66c6c 0px 1px 0px;
border-radius: 3px;
}
a#return_to_ipbfs {
position: fixed;
bottom: 10px;
line-height: 16px;
text-align: left;
right: 10px;
z-index: 1;
opacity: 0.8;
width: 260px;
height: 70px;
background: #cf3737;
color: #fff;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #771b1b;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #f66c6c 0px 1px 0px;
border-radius: 3px;
}
a#return_to_ipbfs:hover  { opacity: 1; }
#return_to_ipbfs strong { font-family: "Trebuchet MS"; display: block; font-size: 14px; padding-bottom: 5px; }
div.user-basic-info img{
    margin: 3px;
    border: 5px solid #eee;
    -webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
    -moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
    box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
 
div.user-basic-info img:hover {
    -webkit-transform: rotate(-7deg);
    -moz-transform: rotate(-7deg);
    -o-transform: rotate(-7deg);
}
.pun a[href ="/u1"] {
color:#FF0000;
}
a[href="/u3"] {
text-shadow: 0px 0px 5px #FF00D0;
}
#chatbox_header {
background: url(http://www.purevb.com/demo/images/styles/ChitChat/style_orange/tcatRight.gif);
background-repeat:repeat-x;
padding: 0 1.3em;
height:30px;
}
h2.chatbox-title a.chat-title {
color: white;
float: left;
font-family: arial,helvetica,sans-serif;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: bold;
line-height: 42px;
padding-left: 16px;
}
#pun-navlinks a, #pun-navlinks a:visited {
text-shadow: #000DFF;
}
#divsmilies {
background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png);
}
#chatbox_messenger_form div.right img {
visibility: hidden;
}
#divsmilies img + img {
visibility: visible!important;
}
#divbold , #divitalic , #divunderline , #divstrike , #divcolor , #divsmilies{
background-repeat: no-repeat;
background-position: center;
border-radius: 5px;
border: 1px solid #383838;}

#divbold {background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/bold10.png");}
#divitalic{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/italic10.png");}
#divunderline{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/underl10.png");}
#divstrike{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/strike10.png");}
#divcolor{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/font_c11.png");}
#divsmilies{background-image: url("http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png");}
O tutorial: Aqui
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Resolvido Re: Personalizar chatbox

Mensagem por Lamark em 16/06/13, 02:30 pm

E também a maioria dos códigos não estão funcionando mesmo eu fazendo tudo do jeito que é, alguns códigos nao funcionam.
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Resolvido Re: Personalizar chatbox

Mensagem por LinkinP. em 16/06/13, 02:41 pm

Olá Lamark , você quer personalizar por completo? mesmo que não seja o caso para mudar o plano de fundo.

Código:
#chatbox {
background-image: url(http://www.anbient.net/sites/default/files/imagecache/completa/screenshots/sword_art_online/sword_art_online-39191.jpg);
background-repeat: no-repeat;
background-position: bottom right;
}

Caso não seja isso pode me explicar melhor ?

LinkinP.
Usuário avançado

Masculino
Inscrito dia : 16/06/2013
Mensagens : 302
Pontos Ativos : 508

Ver perfil do usuário http://saorpg.forumeiro.com

Resolvido Re: Personalizar chatbox

Mensagem por Lamark em 16/06/13, 02:42 pm

Sim, isso aí mesmo.
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Resolvido Re: Personalizar chatbox

Mensagem por LinkinP. em 16/06/13, 02:45 pm

E então mais alguma coisa ? ou prefere outro código.

LinkinP.
Usuário avançado

Masculino
Inscrito dia : 16/06/2013
Mensagens : 302
Pontos Ativos : 508

Ver perfil do usuário http://saorpg.forumeiro.com

Resolvido Re: Personalizar chatbox

Mensagem por Lamark em 16/06/13, 02:52 pm

Coloquei o seu código, porém não mudou nada...
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Resolvido Re: Personalizar chatbox

Mensagem por LinkinP. em 16/06/13, 02:57 pm

Você trocou o url ? Ctrl+F e coloque : 

http://www.anbient.net/sites/default/files/imagecache/completa/screenshots/sword_art_online/sword_art_online-39191.jpg


Coloque uma imagem de seu gosto depois personalize o tamanho da imagem.

LinkinP.
Usuário avançado

Masculino
Inscrito dia : 16/06/2013
Mensagens : 302
Pontos Ativos : 508

Ver perfil do usuário http://saorpg.forumeiro.com

Resolvido Re: Personalizar chatbox

Mensagem por MateusA em 16/06/13, 03:18 pm

Olá!

Aceda à "Folha de Estilos CSS":
Painel de Controle Seta Visualização Seta Imagens & Cores Seta Cores Seta Folha de Estilo CSS

Código:

Código:
#chatbox {
 background: url("http://www.anbient.net/sites/default/files/imagecache/completa/screenshots/sword_art_online/sword_art_online-39191.jpg") no-repeat;
}
#chatbox_members {
  background: black;
  border-left: 1px solid white;
  color: white;
  }


Seta Eu não sei o que você quer, pode descrever? qual parte quer mudar a cor? em que lugar exato você quer por uma imagem etc.

Valide.

Até mais. Rindo
avatar

MateusA
Hiperativo

Masculino
Inscrito dia : 13/05/2013
Mensagens : 3225
Pontos Ativos : 4215

Ver perfil do usuário https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Resolvido Re: Personalizar chatbox

Mensagem por Lamark em 16/06/13, 05:38 pm

Por incrível que pareça, uma simples questão de organização, quando acedia os códigos CSS que eu queria pelas últimas linhas, não consegui, mas quando acedi ás primeiras linhas, deu tudo certo. Muito obrigado ao apoio de todos. Um problema que causou vários problemas resolvido Muito feliz
avatar

Lamark
Nível 4

Masculino
Inscrito dia : 17/03/2013
Mensagens : 33
Pontos Ativos : 60

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

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum