Hitskin.comIsto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
ArtigosChatBox estilo FDF
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
ChatBox estilo FDF
por CR7 Oliveira 22.10.17 17:40
Detalhes da questão
Endereço do fórum: http://lsr-nwd.forumeiros.com/
Versão do fórum: phpBB3
Descrição
Olá,
Como eu poderia deixar o ChatBox igual ou parecido do FDF;
Assim como o fdf quando clica em ''CHATBOX'' Abre outra guia grande como chat.
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Konai 22.10.17 17:50
Saudações querido!
Essa opção é padrão no chatbox, ao clicar no nome, o mesmo abrirá em outra guia.
Veja: https://ajuda.forumeiros.com/t9192-faq-adicionar-chatbox-no-forum
https://ajuda.forumeiros.com/t22416-tutorial-personalizar-o-chatbox
https://ajuda.forumeiros.com/t99197-tutorial-codigos-para-personalizar-o-seu-chatbox
Att!
Essa opção é padrão no chatbox, ao clicar no nome, o mesmo abrirá em outra guia.
Veja: https://ajuda.forumeiros.com/t9192-faq-adicionar-chatbox-no-forum
https://ajuda.forumeiros.com/t22416-tutorial-personalizar-o-chatbox
https://ajuda.forumeiros.com/t99197-tutorial-codigos-para-personalizar-o-seu-chatbox
Att!
Konai- Membro Entusiasta
- Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550 -
Re: ChatBox estilo FDF
por CR7 Oliveira 22.10.17 19:07
Não é isso que desejo, queria uma barra no final da página estilo da FDF que abre o chat também por outra guia.
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Konai 22.10.17 19:33
Amigo, ao clicar no título abrirá uma nova guia pois é padrão do ChatBox!
Quanto a barra, acrescente a sua CSS em CPainel > Visualização >> Imagens e Cores >>> Cores > Folha de Estilo CSS no início ou final dela, o seguinte código:
Salve!
Agora vá em: Painel de Controle -> Módulos -> Chatbox -> Configuração.
Ative o ChatBox e na opção de visualização do ChatBox adicione no início ou final da página.
Att!
Quanto a barra, acrescente a sua CSS em CPainel > Visualização >> Imagens e Cores >>> Cores > Folha de Estilo CSS no início ou final dela, o seguinte código:
- Código:
#fa_qeel .qeel_title:nth-child(n+3) {
background-color: #2e3133!important;
}
.qeel_section {
background: #fafafa none repeat scroll 0 0;
color: #333;
font-size: 12px;
line-height: 1.5em;
padding: 15px;
}
Salve!
Agora vá em: Painel de Controle -> Módulos -> Chatbox -> Configuração.
Ative o ChatBox e na opção de visualização do ChatBox adicione no início ou final da página.
Att!
Konai- Membro Entusiasta
- Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550 -
Re: ChatBox estilo FDF
por CR7 Oliveira 22.10.17 20:26
No alto o chat abre ( Do jeito que não quero ) E quando coloco no final não abre nada e não aparece a barra pra abrir o chat.
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Luiz 22.10.17 20:30
Olá,
Para que possamos editar, precisarei do seu template index_body.
o/
Para que possamos editar, precisarei do seu template index_body.
o/
Luiz- Membro Entusiasta
- Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451 -
Re: ChatBox estilo FDF
por CR7 Oliveira 22.10.17 21:08
- Código:
{JAVASCRIPT}
<br class="clear" />
<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_header -->
<!-- BEGIN message_admin_index -->
<div class="panel introduction">
<div class="inner"><span class="corners-top"><span></span></span>
<!-- BEGIN message_admin_titre -->
<div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
<!-- END message_admin_txt -->
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END message_admin_index -->
{CHATBOX_TOP}
{BOARD_INDEX}
<div id="fa_stats">
<span class="stat_label">{TOTAL_POSTS} {TOTAL_TOPICS}</span><span class="text_label">Mensagens</span>
<span class="stat_label">{TOTAL_USERS}</span><span class="text_label">Usuários registrados</span>
<span class="stat_label">{NEWEST_USER}</span><span class="text_label">É o novo membro</span>
</div>
<!-- BEGIN disable_viewonline -->
<!-- BEGIN switch_viewonline_link -->
<div class="qeel_title"><a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></div>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
<div class="h3">{L_WHO_IS_ONLINE}</div>
<!-- END switch_viewonline_nolink -->
<div class="qeel_section">
<img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" class="img-whois" />
<p>{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}
<br />
{LOGGED_IN_USER_LIST}
{L_ONLINE_USERS}
{L_CONNECTED_MEMBERS}<br />
{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
<br />
<em>{LEGEND} : {GROUP_LEGEND}</em>
</p>
</div>
<div class="clear"></div>
<!-- END disable_viewonline -->
<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_footer -->
<br style="clear:both" />
<!-- BEGIN switch_legend -->
<ul id="picture_legend">
<li><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />{L_NEW_POSTS}</li>
<li><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />{L_NO_NEW_POSTS}</li>
<li><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />{L_FORUM_LOCKED}</li>
</ul>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
FB.init({
appId : {switch_fb_index_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->
<style>
#fa_stats {
background: #2E3133 none repeat scroll 0% 0%;
color: #FFF;
font-family: Arial,Verdana,sans-serif;
padding: 15px 0px;
text-align: center;
font-size: 10px;
}
.stat_label {
background: #F2F2F2 none repeat scroll 0% 0%;
border-radius: 3px;
color: #2E3133;
display: inline-block;
font-size: 0px;
margin: 0px 12px 0px 3%;
padding: 6px 12px;
vertical-align: middle;
}
.stat_label strong {
display: inline-block;
font-size: 14px;
max-width: 150px;
overflow: hidden;
text-overflow: ellipsis;
}
.text_label {
font-size: 14px;
font-weight: 700;
margin-right: 7.5%;
text-transform: uppercase;
}
.qeel_title {
background: #06FFF3 none repeat scroll 0% 0%;
color: #FFF;
font-family: "Trebuchet MS",Arial,Verdana,sans-serif;
font-size: 16px;
font-weight: 700;
padding: 5px 6px;
text-transform: uppercase;
}
.qeel_title a {
color: #FFF;
}
.qeel_section {
background: #FAFAFA none repeat scroll 0% 0%;
color: #333;
font-size: 11px;
padding: 8px 6px;
}
</style>
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Luiz 22.10.17 21:15
Troque por:
Resulta?
- Código:
{JAVASCRIPT}
<br class="clear" />
<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_header -->
<!-- BEGIN message_admin_index -->
<div class="panel introduction">
<div class="inner"><span class="corners-top"><span></span></span>
<!-- BEGIN message_admin_titre -->
<div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
<!-- END message_admin_txt -->
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END message_admin_index -->
{CHATBOX_TOP}
{BOARD_INDEX}
<div id="fa_stats">
<span class="stat_label">{TOTAL_POSTS} {TOTAL_TOPICS}</span><span class="text_label">Mensagens</span>
<span class="stat_label">{TOTAL_USERS}</span><span class="text_label">Usuários registrados</span>
<span class="stat_label">{NEWEST_USER}</span><span class="text_label">É o novo membro</span>
</div>
<!-- BEGIN disable_viewonline -->
<!-- BEGIN switch_viewonline_link -->
<div class="qeel_title"><a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></div>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
<div class="h3">{L_WHO_IS_ONLINE}</div>
<!-- END switch_viewonline_nolink -->
<div class="qeel_section">
<img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" class="img-whois" />
<p>{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}
<br />
{LOGGED_IN_USER_LIST}
{L_ONLINE_USERS}
{L_CONNECTED_MEMBERS}<br />
{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
<br />
<em>{LEGEND} : {GROUP_LEGEND}</em>
</p>
</div>
<!-- BEGIN switch_chatbox_activate -->
<div class="qeel_title"><a href="{S_JOIN_CHAT}" target="ChatBox">{CHATBOX_NAME}</a></div>
<div class="page-bottom">
{TOTAL_CHATTERS_ONLINE} :
{CHATTERS_LIST}<br />
</div>
<!-- BEGIN switch_chatbox_popup -->
<div id="chatbox_popup"></div>
<script type="text/javascript">
insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
</script>
<!-- END switch_chatbox_popup -->
<!-- END switch_chatbox_activate -->
<div class="clear"></div>
<!-- END disable_viewonline -->
<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_footer -->
<br style="clear:both" />
<!-- BEGIN switch_legend -->
<ul id="picture_legend">
<li><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />{L_NEW_POSTS}</li>
<li><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />{L_NO_NEW_POSTS}</li>
<li><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />{L_FORUM_LOCKED}</li>
</ul>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
FB.init({
appId : {switch_fb_index_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->
<style>
#fa_stats {
background: #2E3133 none repeat scroll 0% 0%;
color: #FFF;
font-family: Arial,Verdana,sans-serif;
padding: 15px 0px;
text-align: center;
font-size: 10px;
}
.stat_label {
background: #F2F2F2 none repeat scroll 0% 0%;
border-radius: 3px;
color: #2E3133;
display: inline-block;
font-size: 0px;
margin: 0px 12px 0px 3%;
padding: 6px 12px;
vertical-align: middle;
}
.stat_label strong {
display: inline-block;
font-size: 14px;
max-width: 150px;
overflow: hidden;
text-overflow: ellipsis;
}
.text_label {
font-size: 14px;
font-weight: 700;
margin-right: 7.5%;
text-transform: uppercase;
}
.qeel_title {
background: #06FFF3 none repeat scroll 0% 0%;
color: #FFF;
font-family: "Trebuchet MS",Arial,Verdana,sans-serif;
font-size: 16px;
font-weight: 700;
padding: 5px 6px;
text-transform: uppercase;
}
.qeel_title a {
color: #FFF;
}
.qeel_section {
background: #FAFAFA none repeat scroll 0% 0%;
color: #333;
font-size: 11px;
padding: 8px 6px;
}
</style>
Resulta?
Luiz- Membro Entusiasta
- Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451 -
Re: ChatBox estilo FDF
por CR7 Oliveira 22.10.17 21:20
perfeito poderia colocar em preto ?
A barra
Deixando dessa cor,
A barra
Deixando dessa cor,
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Luiz 22.10.17 21:41
Sim, é claro! 
Adicione em sua Folha de Estilos:
o/
Adicione em sua Folha de Estilos:
- Código:
.qeel_title {
background-color: #2e3133 !important;
}
#fa_stats + .qeel_title {
background-color: #06FFF3 !important;
}
o/
Luiz- Membro Entusiasta
- Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451 -
CR7 Oliveira- *****
- Membro desde : 08/02/2016
Mensagens : 468
Pontos : 698 -
Re: ChatBox estilo FDF
por Luiz 22.10.17 21:49
| Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para Questões resolvidas. |
Luiz- Membro Entusiasta
- Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451 -
Tópicos semelhantes» Chatbox em estilo Shoutbox
» Estilo das Categorias
» Gerir Chatbox estilo Shoutbox
» Estilo do ''Obrigado''
» [Chatbox] Botão Chatbox na barra denavegação
» Estilo das Categorias
» Gerir Chatbox estilo Shoutbox
» Estilo do ''Obrigado''
» [Chatbox] Botão Chatbox na barra denavegação
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos