Como coloco isso no meu forum ?

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

Atendido / Resolvido Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 20:58

Qual é minha questão:
Ae eu queria saber como eu coloco um painel de login e de se registrar no topo do meu forum assim.

https://i.imgur.com/ywt9n.png <<

https://i.imgur.com/hAk8J.png <--

Se puderem ajudar .

Link do forum que tirei os prints. : http://forum-caminhoneiros.forumbrasil.net/forum#

Vlw !

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

Versão do fórum:
INVISION


Última edição por Heero em 29.12.12 3:11, editado 1 vez(es)
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Sennior em 28.12.12 21:03

Sennior

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16368
Pontos Ativos : 20873

Ver perfil do usuário https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:09

Amigo eu quero um igual o da imagem , este ai , deste tutorial nao me agradou.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 21:28

Saudações,

Coloque esse HTML em um Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}.content{background-color:white}</style><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div>

Coloque esse Javascript em todas as páginas:
Código:
$(document).ready(function(){$("#open").click(function(){$("div#panel").slideDown("slow")});$("#close").click(function(){$("div#panel").slideUp("slow")});$("#toggle a").click(function(){$("#toggle a").toggle()})});

Assombrosamente.


Última edição por Holmes em 28.12.12 22:07, editado 1 vez(es)
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:40

Funcionou nao man.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 21:45

@Heero escreveu:Funcionou nao man.
Poderia ser mais especifico sobre o que não funcionou?
Nem chegou a aparecer?

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:47

Exatamente , fiz tudo como você pediu e nada apareceu.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 21:48

@Heero escreveu:Exatamente , fiz tudo como você pediu e nada apareceu.
Acabei de acessar seu fórum e seus Widgets estão desativados, antes estavam ativos.
Poderia colocar o código novamente em um Widget para que eu possa ver qual o problema?

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:50

Ok irei ativar novamente , colocar tudo novamente e vera que n e mentira.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 21:52

@Heero escreveu:Ok irei ativar novamente , colocar tudo novamente e vera que n e mentira.
Os Widgets continuam desativos.

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:53

ta ativado cara.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 21:56

Saudações,

Use esse código no Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}</style><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div></div>

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por DarkDoki em 28.12.12 21:57

avatar

DarkDoki
Nível 10

Masculino
Inscrito dia : 01/11/2011
Mensagens : 251
Pontos Ativos : 393

Ver perfil do usuário http://darkcheatsbr.com

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 21:58

Dark cliquei ai e nada apareceu , kd o tutorial ?
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:03

@Heero escreveu:Dark cliquei ai e nada apareceu , kd o tutorial ?
Você utilizou o último código que eu lhe passei e não funcionou?

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:04

Agora sim , mais quando eu clico a aba desce e as coisas estao tudo desorganizadas.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:06

Saudações,

Use esse código no Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}#panel .content{font-size:.85em;margin:0 auto;padding-top:15px;text-align:left;width:960px}#panel .content .left{border-left:1px solid #333;float:left;padding:0 15px;width:280px}#panel .content .right{border-right:1px solid #333}#panel .content form{margin:0 0 10px}#panel .content label{clear:both;display:block;float:left;padding-top:2px;width:280px}#panel .content input.field{background:#414141;border:1px #1A1A1A solid;color:#fff;height:16px;margin-right:5px;margin-top:4px;width:200px}#panel .content input:focus.field{background:#545454}#panel .content input.bt_login,#panel .content input.bt_register{border:none;clear:left;cursor:pointer;display:block;float:left;font-weight:700;height:24px;margin:10px 0;text-align:center}#panel .content input.bt_login{background:transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;width:74px}#panel .content input.bt_register{background:transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;color:#fff;width:94px}#panel .lost-pwd{clear:right;display:block;float:left;font-size:.95em;padding:15px 5px 0;text-decoration:underline}.content{background-color:white}</style><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div></div>

Assombrosamente.


Última edição por Holmes em 28.12.12 22:08, editado 1 vez(es)
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Player Will em 28.12.12 22:07

Olá,

Adicione esse codigo em sua folha css..
Código:
#rep-mail-bar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  height: 25px;
  font-size: 11px;
  width: 100%;
  z-index: 999;
}
/* Panel Tab/button */
 
.tab {
    background: url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;
  height: 22px;
  position: relative;
    top: 0;
    z-index: 999;
}
 
 
 
 
.tab ul.login {
  display: block;
  position: relative;
    float: right;
    clear: right;
    height: 42px;
  width: auto;
    font-weight: bold;
  line-height: 42px;
  margin: 0;
  right: 150px;
    color: white;
    font-size: 80%;
  text-align: center;
}
 
.tab ul.login li.left {
    background: url(http://i.imgur.com/XwNu2.png) no-repeat left 0;
    height: 42px;
  width: 30px;
  padding: 0;
  margin: 0;
    display: block;
  float: left;
}
 
.tab ul.login li.right {
    background: url(http://i.imgur.com/QmQzs.png) no-repeat left 0;
    height: 42px;
  width: 30px;
  padding: 0;
  margin: 0;
    display: block;
  float: left;
}
 
.tab ul.login li {
    text-align: left;
    padding: 0 6px;
  display: block;
  float: left;
  height: 42px;
    background: url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;
}
 
.tab ul.login li a {
  color: #15ADFF;
}
 
.tab ul.login li a:hover {
  color: white;
}
 
.tab .sep {color:#414141}
 
.tab a.open, .tab a.close {
  height: 20px;
  line-height: 20px !important;
  padding-left: 30px !important;
  cursor: pointer;
  display: block;
  width: 100px;
  position: relative;
  top: 11px;
  width: 120px;
}
 
.tab a.open {background: url(http://i.imgur.com/NWFec.png) no-repeat left 0;}
.tab a.close {background: url(http://i.imgur.com/GGiBD.png) no-repeat left 0;}
.tab a:hover.open {background: url(http://i.imgur.com/mboPc.png) no-repeat left -19px;}
.tab a:hover.close {background: url(http://i.imgur.com/xztqF.png) no-repeat left -19px;}
/* sliding panel */
#toppanel {
    position: absolute;  /*Panel will overlap  content */
    /*position: relative;*/  /*Panel will "push" the content down */
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
 
#panel {
  width: 100%;
  height: 210px;
  color: #999999;
  background: #272727;
  overflow: hidden;
  position: relative;
  z-index: 3;
  display: none;
}
 
#panel h1 {
  font-size: 1.6em;
  padding: 5px 0 10px;
  margin: 0;
  color: white;
}
 
#panel h2{
  font-size: 1.2em;
  padding: 10px 0 5px;
  margin: 0;
  color: white;
}
 
#panel p {
  margin: 5px 0;
  padding: 0;
}
 
#panel a {
  text-decoration: none;
  color: #15ADFF;
}
 
#panel a:hover {
  color: white;
}
 
#panel a-lost-pwd {
  display: block;
  float: left;
}
 
#panel .content {
  width: 960px;
  margin: 0 auto;
  padding-top: 15px;
  text-align: left;
  font-size: 0.85em;
}
 
#panel .content .left {
  width: 280px;
  float: left;
  padding: 0 15px;
  border-left: 1px solid #333;
}
 
#panel .content .right {
  border-right: 1px solid #333;
}
 
#panel .content form {
  margin: 0 0 10px 0;
}
 
#panel .content label {
  float: left;
  padding-top: 2px;
  clear: both;
  width: 280px;
  display: block;
}
 
#panel .content input.field {
  border: 1px #1A1A1A solid;
  background: #414141;
  margin-right: 5px;
  margin-top: 4px;
  width: 200px;
  color: white;
  height: 16px;
}
 
#panel .content input:focus.field {
  background: #545454;
}
 
/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
  display: block;
  float: left;
  clear: left;
  height: 24px;
  text-align: center;
  cursor: pointer;
  border: none;
  font-weight: bold;
  margin: 10px 0;
}
 
#panel .content input.bt_login {
  width: 74px;
  background: transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;
}
 
#panel .content input.bt_register {
  width: 94px;
  color: white;
  background: transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;
}
 
#panel .lost-pwd {
  display: block;
  float:left;
  clear: right;
  padding: 15px 5px 0;
  font-size: 0.95em;
  text-decoration: underline;
}
 
 
.main .tieude .page-title{color:#fff!important;background:#fff;opacity:0.8}
.main .tieude {
height: 28px;
padding: 6px;
border: 4px solid
#DAD3D3;
-webkit-box-shadow: 0 2px 2px -2px
rgba(0, 0, 0, .52);
font-size: 12px;
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-weight: 700;
background-color:
#DAD3D3;
color:
black;
}
.pun div, .pun td, .sig-line {
border-color: #
#DDD;
color: #
#DDD;
}
.main .tieude .page-title{padding: 5px;}.noidungthongbao{padding: 0px;height:27px!important}
 
a {
cursor: pointer;
color:
#3B5998;
text-decoration: none;
}

Crie uma pagina java script com o seguinte codigo:
Investimento: Em todas as paginas
Código:
$(document).ready(function() {
 
  // Expand Panel
  $("#open").click(function(){
      $("div#panel").slideDown("slow");
 
  }); 
 
  // Collapse Panel
  $("#close").click(function(){
      $("div#panel").slideUp("slow"); 
  });     
 
  // Switch buttons from "Log In | Register" to "Close Panel" on click
  $("#toggle a").click(function () {
      $("#toggle a").toggle();
  });     
     
});

Vá em templates> Geral> overall_header
procure por este código:
Código:
 <a id="top" name="top" accesskey="t"></a>

(se não encontrar nada apague os espaços do inicio do código)

Quando encontrar cole este código em cima:
Código:
 <!-- BEGIN switch_user_logged_out -->
  <div id="rep-mail-bar">
<div id="toppanel">
  <div id="panel" style="display: none; ">
      <div class="content clearfix">
        <div class="left">
            <h1>Desenvolvido por Max Kyle | AjudaFM</h1>
            <h2>Por favor, registre e faça login para participar do fórum</h2>     
            <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p>
           
        </div>
        <div class="left">
           
                          <form action="/login?redirect=/" method="post" name="form_login" id="login-vds">
                <h1 class="padlock">Entrar</h1>
                            <label class="grey" for="log">Nome de Utilizador:</label>
 <input class="field" id="log" type="text" size="10" name="username">
<label class="grey" for="pwd">Senha:</label>
<input class="field" id="pwd" type="password" size="10" name="password">
 <input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar">
 <label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label>
                <div class="clear"></div>
 </form>
 <script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script>
 
           
        </div>
        <div class="left right">
                          <form action="/register?agreed=true&step=2" method="post">
              <h1>Registe-se rápido !</h1>           
              <label class="grey" for="signup">Nome de Utilizador : *</label>
<input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25">
              <label class="grey" for="email">Email: *</label>
              <input class="field" type="text" name="email" id="email" size="23">
                                        <label class="grey" for="signup">Senha : *</label>
<input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25">
 
              <input type="submit" name="submit" value="Registe-se" class="bt_register">
            </form>
        </div>
      </div>
  </div> <!-- /login --> 
 
    <!-- Guia no topo | AjudaFM | Max Kyle --> 
  <div class="tab">
      <ul class="login">
          <li class="left"> </li>
          <li>AjudaFM!</li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a>
            <a id="close" style="display: none; " class="close" href="#">Fechar</a>       
        </li>
          <li class="right"> </li>
      </ul>
  </div> <!-- / top -->
 
</div>
  <!-- END switch_user_logged_out -->
Player Will

Player Will
Nível 5

Masculino
Inscrito dia : 17/12/2012
Mensagens : 42
Pontos Ativos : 60

Ver perfil do usuário http://www.exptech.com.br/forum

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:11

Man meu forum nao tem template '-' e invision
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:13

@Heero escreveu:Man meu forum nao tem template '-' e invision
O código que eu te passei não funcionou? Sempre quando você responder após uma resposta diga se funcionou ou não, assim fico na dúvida se você viu minha resposta.

Até mais.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:15

Holmes eu respondi sim , FUNCIONOU mais quando eu cliquei a ABA desceu e estava tudo embaraçado dentro do painel.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:29

@Heero escreveu:Holmes eu respondi sim , FUNCIONOU mais quando eu cliquei a ABA desceu e estava tudo embaraçado dentro do painel.
Exatamente, se você verificar, você verá que eu já respondi a mensagem que você diz isso.

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:31

entao amigo eu susbistitiu o codigo q vc mando e continuou a msm coisa,
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:35

Saudações,

Use esse código no Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}#panel .content{font-size:.85em;margin:0 auto;padding-top:15px;text-align:left;width:960px}#panel .content .left{border-left:1px solid #333;float:left;padding:0 15px;width:280px}#panel .content .right{border-right:1px solid #333}#panel .content form{margin:0 0 10px}#panel .content label{clear:both;display:block;float:left;padding-top:2px;width:280px}#panel .content input.field{background:#414141;border:1px #1A1A1A solid;color:#fff;height:16px;margin-right:5px;margin-top:4px;width:200px}#panel .content input:focus.field{background:#545454}#panel .content input.bt_login,#panel .content input.bt_register{border:none;clear:left;cursor:pointer;display:block;float:left;font-weight:700;height:24px;margin:10px 0;text-align:center}#panel .content input.bt_login{background:transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;width:74px}#panel .content input.bt_register{background:transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;color:#fff;width:94px}#panel .lost-pwd{clear:right;display:block;float:left;font-size:.95em;padding:15px 5px 0;text-decoration:underline}.content{background-color:white}</style><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div></div>

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:44

Olhe como ficou ,

COmo mudo a cor do fundo disso ai ? e coloco um cinza claro ?

Do lado do registre-se rapido tem uma linha e um espaço em branco e possivel removelo ?
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 22:47

Saudações,

Use esse código no Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}#panel .content{font-size:.85em;margin:0 auto;padding-top:15px;text-align:left;width:960px}#panel .content .left{border-left:1px solid #333;float:left;padding:0 15px;width:280px}#panel .content .right{border-right:1px solid #333}#panel .content form{margin:0 0 10px}#panel .content label{clear:both;display:block;float:left;padding-top:2px;width:280px}#panel .content input.field{background:#414141;border:1px #1A1A1A solid;color:#fff;height:16px;margin-right:5px;margin-top:4px;width:200px}#panel .content input:focus.field{background:#545454}#panel .content input.bt_login,#panel .content input.bt_register{border:none;clear:left;cursor:pointer;display:block;float:left;font-weight:700;height:24px;margin:10px 0;text-align:center}#panel .content input.bt_login{background:transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;width:74px}#panel .content input.bt_register{background:transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;color:#fff;width:94px}#panel .lost-pwd{clear:right;display:block;float:left;font-size:.95em;padding:15px 5px 0;text-decoration:underline}</style><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div></div>

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 22:51

Pq o quadrado dos outro negocio de preencher estao amarelos e nao cinza ?

https://i.imgur.com/4ntml.png <--
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 28.12.12 23:00

@Heero escreveu:Pq o quadrado dos outro negocio de preencher estao amarelos e nao cinza ?

https://i.imgur.com/4ntml.png <--
Não entendi, não encontrei nada amarelo.

Você se refere aos campos que estão brancos? Você quer que eles fiquem cinza?

Assombrosamente.


Última edição por Holmes em 28.12.12 23:04, editado 1 vez(es)
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 28.12.12 23:02

Pra mim e amarelo mais se vc acha q e branco , se puder poem cinza pra eu ;D
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 0:30

UP
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Holmes em 29.12.12 0:41

Saudações,

Use esse código no Widget:
Código:
<style>#rep-mail-bar{font-size:11px;height:25px;left:0;position:fixed;top:0;width:100%;z-index:999}.tab{background:url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;height:22px;position:relative;top:0;z-index:999}.tab ul.login{clear:right;color:#fff;display:block;float:right;font-size:80%;font-weight:700;height:42px;line-height:42px;margin:0;position:relative;right:150px;text-align:center;width:auto}.tab ul.login li.left{background:url(http://i.imgur.com/XwNu2.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li.right{background:url(http://i.imgur.com/QmQzs.png) no-repeat left 0;display:block;float:left;height:42px;margin:0;padding:0;width:30px}.tab ul.login li{background:url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;display:block;float:left;height:42px;padding:0 6px;text-align:left}.tab ul.login li a{color:#15ADFF}.tab ul.login li a:hover{color:#fff}.tab .sep{color:#414141}.tab a.close,.tab a.open{cursor:pointer;display:block;height:20px;line-height:20px!important;padding-left:30px!important;position:relative;top:11px;width:120px}.tab a.open{background:url(http://i.imgur.com/NWFec.png) no-repeat left 0}.tab a.close{background:url(http://i.imgur.com/GGiBD.png) no-repeat left 0}.tab a:hover.open{background:url(http://i.imgur.com/mboPc.png) no-repeat left -19px}.tab a:hover.close{background:url(http://i.imgur.com/xztqF.png) no-repeat left -19px}#toppanel{margin-left:auto;margin-right:auto;position:absolute;text-align:center;top:0;width:100%;z-index:999}#panel{background:#272727;color:#999;display:none;height:210px;overflow:hidden;position:relative;width:100%;z-index:3}#panel .content{font-size:.85em;margin:0 auto;padding-top:15px;text-align:left;width:960px}#panel .content .left{border-left:1px solid #333;float:left;padding:0 15px;width:280px}#panel .content .right{border-right:1px solid #333}#panel .content form{margin:0 0 10px}#panel .content label{clear:both;display:block;float:left;padding-top:2px;width:280px}#panel .content input.field{background:#414141;border:1px #1A1A1A solid;color:#fff;height:16px;margin-right:5px;margin-top:4px;width:200px}#panel .content input:focus.field{background:#545454}#panel .content input.bt_login,#panel .content input.bt_register{border:none;clear:left;cursor:pointer;display:block;float:left;font-weight:700;height:24px;margin:10px 0;text-align:center}#panel .content input.bt_login{background:transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;width:74px}#panel .content input.bt_register{background:transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;color:#fff;width:94px}#panel .lost-pwd{clear:right;display:block;float:left;font-size:.95em;padding:15px 5px 0;text-decoration:underline}#panel .left input{background-color:#414141!important}</style><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Desenvolvido por Max Kyle | Fórum - Caminhoneiros na Estrada</h1><h2>Por favor, registre e faça login para participar do fórum</h2>      <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Entrar</h1><label class="grey" for="log">Nome de Utilizador:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Senha:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Registe-se rápido !</h1>            <label class="grey" for="signup">Nome de Utilizador : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email: *</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Senha : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Registe-se" class="bt_register"></form></div></div></div><!--
 /login --><!--
 Guia no topo | Fórum - Caminhoneiros NA. | Max Kyle -->  <div class="tab"><ul class="login"><li class="left"> </li><li>Fórum - Caminhoneiros na Estrada!</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a><a id="close" style="display: none; " class="close" href="#">Fechar</a>        </li><li class="right"> </li></ul> </div><!--
 / top --></div></div>

Assombrosamente.
Holmes

Holmes
Usuário avançado

Inscrito dia : 11/11/2012
Mensagens : 303
Pontos Ativos : 413

Ver perfil do usuário

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por [S]herlock em 29.12.12 0:49

Olá Heero ,

Aceda em :

Painel de Controle :seta2: Visualização :seta2: Imagens e Cores :seta2: Cores :seta2: Folha de Estilho CSS


Adicione este código na folha :


Código:

#rep-mail-bar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  height: 25px;
  font-size: 11px;
  width: 100%;
  z-index: 999;
}
/* Panel Tab/button */
 
.tab {
    background: url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;
  height: 22px;
  position: relative;
    top: 0;
    z-index: 999;
}
 
 
 
 
.tab ul.login {
  display: block;
  position: relative;
    float: right;
    clear: right;
    height: 42px;
  width: auto;
    font-weight: bold;
  line-height: 42px;
  margin: 0;
  right: 150px;
    color: white;
    font-size: 80%;
  text-align: center;
}
 
.tab ul.login li.left {
    background: url(http://i.imgur.com/XwNu2.png) no-repeat left 0;
    height: 42px;
  width: 30px;
  padding: 0;
  margin: 0;
    display: block;
  float: left;
}
 
.tab ul.login li.right {
    background: url(http://i.imgur.com/QmQzs.png) no-repeat left 0;
    height: 42px;
  width: 30px;
  padding: 0;
  margin: 0;
    display: block;
  float: left;
}
 
.tab ul.login li {
    text-align: left;
    padding: 0 6px;
  display: block;
  float: left;
  height: 42px;
    background: url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;
}
 
.tab ul.login li a {
  color: #15ADFF;
}
 
.tab ul.login li a:hover {
  color: white;
}
 
.tab .sep {color:#414141}
 
.tab a.open, .tab a.close {
  height: 20px;
  line-height: 20px !important;
  padding-left: 30px !important;
  cursor: pointer;
  display: block;
  width: 100px;
  position: relative;
  top: 11px;
  width: 120px;
}
 
.tab a.open {background: url(http://i.imgur.com/NWFec.png) no-repeat left 0;}
.tab a.close {background: url(http://i.imgur.com/GGiBD.png) no-repeat left 0;}
.tab a:hover.open {background: url(http://i.imgur.com/mboPc.png) no-repeat left -19px;}
.tab a:hover.close {background: url(http://i.imgur.com/xztqF.png) no-repeat left -19px;}
/* sliding panel */
#toppanel {
    position: absolute;  /*Panel will overlap  content */
    /*position: relative;*/  /*Panel will "push" the content down */
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
 
#panel {
  width: 100%;
  height: 210px;
  color: #999999;
  background: #272727;
  overflow: hidden;
  position: relative;
  z-index: 3;
  display: none;
}
 
#panel h1 {
  font-size: 1.6em;
  padding: 5px 0 10px;
  margin: 0;
  color: white;
}
 
#panel h2{
  font-size: 1.2em;
  padding: 10px 0 5px;
  margin: 0;
  color: white;
}
 
#panel p {
  margin: 5px 0;
  padding: 0;
}
 
#panel a {
  text-decoration: none;
  color: #15ADFF;
}
 
#panel a:hover {
  color: white;
}
 
#panel a-lost-pwd {
  display: block;
  float: left;
}
 
#panel .content {
  width: 960px;
  margin: 0 auto;
  padding-top: 15px;
  text-align: left;
  font-size: 0.85em;
}
 
#panel .content .left {
  width: 280px;
  float: left;
  padding: 0 15px;
  border-left: 1px solid #333;
}
 
#panel .content .right {
  border-right: 1px solid #333;
}
 
#panel .content form {
  margin: 0 0 10px 0;
}
 
#panel .content label {
  float: left;
  padding-top: 2px;
  clear: both;
  width: 280px;
  display: block;
}
 
#panel .content input.field {
  border: 1px #1A1A1A solid;
  background: #414141;
  margin-right: 5px;
  margin-top: 4px;
  width: 200px;
  color: white;
  height: 16px;
}
 
#panel .content input:focus.field {
  background: #545454;
}
 
/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
  display: block;
  float: left;
  clear: left;
  height: 24px;
  text-align: center;
  cursor: pointer;
  border: none;
  font-weight: bold;
  margin: 10px 0;
}
 
#panel .content input.bt_login {
  width: 74px;
  background: transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;
}
 
#panel .content input.bt_register {
  width: 94px;
  color: white;
  background: transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;
}
 
#panel .lost-pwd {
  display: block;
  float:left;
  clear: right;
  padding: 15px 5px 0;
  font-size: 0.95em;
  text-decoration: underline;
}
 
 
.main .tieude .page-title{color:#fff!important;background:#fff;opacity:0.8}
.main .tieude {
height: 28px;
padding: 6px;
border: 4px solid
#DAD3D3;
-webkit-box-shadow: 0 2px 2px -2px
rgba(0, 0, 0, .52);
font-size: 12px;
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-weight: 700;
background-color:
#DAD3D3;
color:
black;
}
.pun div, .pun td, .sig-line {
border-color: #
#DDD;
color: #
#DDD;
}
.main .tieude .page-title{padding: 5px;}.noidungthongbao{padding: 0px;height:27px!important}
 
a {
cursor: pointer;
color:
#3B5998;
text-decoration: none;
}

Agora , aceda em :

Painel de Controle :seta2: Módulos :seta2: Java Script e HTML'S :seta2: Códigos Java Script



Código:

$(document).ready(function() {
 
  // Expand Panel
  $("#open").click(function(){
      $("div#panel").slideDown("slow");
 
  }); 
 
  // Collapse Panel
  $("#close").click(function(){
      $("div#panel").slideUp("slow"); 
  });     
 
  // Switch buttons from "Log In | Register" to "Close Panel" on click
  $("#toggle a").click(function () {
      $("#toggle a").toggle();
  });     
     
});

Aceda novamente em :

Painel de Controle :seta2: Visualização :seta2: Templates :seta2: Geral


overall_header
Procure por este código:

Código:

    <a id="top" name="top" accesskey="t"></a>

(Se não encontrar nada apague os espaços do inicio do código)


Quando encontrar cole este código em cima:


Código:

 <!-- BEGIN switch_user_logged_out -->
  <div id="rep-mail-bar">
<div id="toppanel">
  <div id="panel" style="display: none; ">
      <div class="content clearfix">
        <div class="left">
            <h1>Desenvolvido por Max Kyle | AjudaFM</h1>
            <h2>Por favor, registre e faça login para participar do fórum</h2>     
            <p class="grey">Fórum melhor vizualizado em <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-3.0.10&os=win&lang=en-US" onmouseover="showtip('Baixar Firefox ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/ff1011.png"></a> e <a href="http://www.google.com/chrome?hl=br" onmouseover="showtip('Baixar Google Chrome ..!');" onmouseout="hidetip();" target="_blank"><img src="http://i43.servimg.com/u/f43/17/63/07/30/gc1010.png"></a><br>com uma resolução de 1024x768 ou superior. <br></p>
           
        </div>
        <div class="left">
           
                          <form action="/login?redirect=/" method="post" name="form_login" id="login-vds">
                <h1 class="padlock">Entrar</h1>
                            <label class="grey" for="log">Nome de Utilizador:</label>
 <input class="field" id="log" type="text" size="10" name="username">
<label class="grey" for="pwd">Senha:</label>
<input class="field" id="pwd" type="password" size="10" name="password">
 <input id="bt_login" class="bt_login" type="submit" name="login" value="Entrar">
 <label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever">  Lembra de min</label>
                <div class="clear"></div>
 </form>
 <script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script>
 
           
        </div>
        <div class="left right">
                          <form action="/register?agreed=true&step=2" method="post">
              <h1>Registe-se rápido !</h1>           
              <label class="grey" for="signup">Nome de Utilizador : *</label>
<input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25">
              <label class="grey" for="email">Email: *</label>
              <input class="field" type="text" name="email" id="email" size="23">
                                        <label class="grey" for="signup">Senha : *</label>
<input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25">
 
              <input type="submit" name="submit" value="Registe-se" class="bt_register">
            </form>
        </div>
      </div>
  </div> <!-- /login --> 
 
    <!-- Guia no topo | AjudaFM | Max Kyle --> 
  <div class="tab">
      <ul class="login">
          <li class="left"> </li>
          <li>AjudaFM!</li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#" style="display: block; ">Entrar | Registrar</a>
            <a id="close" style="display: none; " class="close" href="#">Fechar</a>       
        </li>
          <li class="right"> </li>
      </ul>
  </div> <!-- / top -->
 
</div>
  <!-- END switch_user_logged_out -->

Pronto . Só salvar e publicar .

OBS : Para aparecer , precisa estar deslogado no fórum .

Créditos : AjudaFM
[S]herlock

[S]herlock
Usuário avançado

Masculino
Inscrito dia : 18/07/2012
Mensagens : 399
Pontos Ativos : 597

Ver perfil do usuário http://www.projectgames.ativoforum.com

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 1:23

Holmes , ficou um quadrado cinza atraz dos dois botoes .'' Entrar '' e o '' Registrar-se'' ..
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 1:24

HugoPimenta meu forum e INVISION nao tem como acessar as opções do template.
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 2:28

up
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 3:10

Resolvido PODE FECHAR O TOPICO
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

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

Atendido / Resolvido Re: Como coloco isso no meu forum ?

Mensagem por Heero em 29.12.12 3:11

Resolvido PODE FECHAR O TOPICO
Heero

Heero
Usuário avançado

Masculino
Inscrito dia : 03/12/2012
Mensagens : 373
Pontos Ativos : 504

Ver perfil do usuário http://heerocheats.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