[Resolvido] Login e sair como nesse site

+8
Loki
HeLL (ShadowsMadame)
Epic Eric
Street CS
Byte
Nicker
KakáBrasil
Mah
12 participantes

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

Tópico resolvido [Resolvido] Login e sair como nesse site

Mensagem por Mah 23.10.10 18:37

Boa tarde!
Pessoal veja se é possível adicionar,
Gostaria de inserir esse tipo de login em meu fórum (Invision).
Link: http://web-kreation.com/demos/login_form_mootools_1.2/

Aguardo respostas, espero que alguém possa me ajudar!


Última edição por Mah em 26.10.10 22:53, editado 1 vez(es)
Mah

Mah
*

Membro desde : 27/03/2010
Mensagens : 31
Pontos : 73

http://www.google.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por KakáBrasil 23.10.10 20:52

acho que não há como fazer isto .
KakáBrasil

KakáBrasil
Novo Membro

Membro desde : 23/10/2010
Mensagens : 12
Pontos : 21

http://halloweentown.forume.biz/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Nicker 23.10.10 23:12

Olá,
Lamento, mais como ja foi dito acima isto ainda não é possivel, mais faça um sugestão. Rindo
Até mais.
Nicker

Nicker
Membro

Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 24.10.10 4:58

Olá Mah!

Estive a adaptar o código, e fiz para ele funcionar em fóruns, ele funciona na "Mensagem na Home page", para ir lá faça assim:

Vá em:
>>> Painel de Controle >>> Visualização >> Home Page >> Geral > Mensagem na Home page > Conteúdo da mensagem
[Resolvido] Login e sair como nesse site Byte2
E coloque o seguinte código:
Código:
Código:
<!-- The main style sheet -->
     <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/style.css" type="text/css" media="screen" />

<!-- The CSS -->
    <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<!-- Mootools - the core -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
<!--Toggle effect (show/hide login form) -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>


<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write('   <style>   ');
document.write('   #loginn{display:none!important;}   ');
document.write('   </style>   ');
}
</script>

   <!-- Login -->
   <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

   <div id="login">

      <div class="loginContent">

         <form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

            <label for="log"><b>Username: </b></label>
            <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

            <label for="pwd"><b>Password:</b></label>
            <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

            <input class="menuoption button_login" type="submit" name="login" value=" " />

            <input type="hidden" name="redirect" value="" />

         </form>

         <div class="left">

               <label for="rememberme">
               <input name="autologin"      id="autologin" type="checkbox"  tabindex="4" checked="checked" class="radio" /> Conexão automática
               </label>

            </div>

         <div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

      </div>

      <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>

   </div>


<!-- /login -->



    <div id="container">

      <div id="top">

      <!-- login -->

         <ul class="login">

             <li class="left"> </li>

              <li>Olá Visitante!</li>

            <li>|</li>

            <li><a id="toggleLogin" href="#">Entrar</a></li>

         </ul> <!-- / login -->

      </div> <!-- / top -->



        <div class="clearfix"></div>   </div>
[Resolvido] Login e sair como nesse site Byte2
E então clique em "[Resolvido] Login e sair como nesse site Icon_okSalvar".

Espero ter lhe ajudado Mah!
Byte

PS: Fiquem a vontade para modificar o código para poder aparecer em todas as páginas, eu estou um pouco cansado pois aqui já é tarde ( Não ), boa noite e boa sorte para todos que quiserem continuar o meu trabalho! Desculpem não ter feito isso ainda
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Mah 24.10.10 19:51

Sim funciona!
Obrigada Byte, mas me diga uma coisa, caso eu queira alterar as imagens que aparecem como devo fazer?

Aguardo sua resposta.
Mah

Mah
*

Membro desde : 27/03/2010
Mensagens : 31
Pontos : 73

http://www.google.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Street CS 24.10.10 22:29

Byte poderia fazer também para phpbb3 ?

Pois testei assim e não deu...

Abraços.
Street CS

Street CS
Novo Membro

Membro desde : 09/09/2010
Mensagens : 19
Pontos : 29

http://csstreet.foro.bz/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 24.10.10 23:55

Desculpem-me pessoal, havia esquecido de fechar uma div, o que estragava o layout do PHPBB3, aqui o código ajeitado (recomendo colocar este, pois no outro mesmo que não aparecesse havia um erro):

Código:
Código:
<!-- The CSS -->
   <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<!-- Mootools - the core -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
<!--Toggle effect (show/hide login form) -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>


<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write('  <style>  ');
document.write('  #loginn{display:none!important;}  ');
document.write('  </style>  ');
}
</script>

  <!-- Login -->
  <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

  <div id="login">

      <div class="loginContent">

        <form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

            <label for="log"><b>Username: </b></label>
            <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

            <label for="pwd"><b>Password:</b></label>
            <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

            <input class="menuoption button_login" type="submit" name="login" value=" " />

            <input type="hidden" name="redirect" value="" />

        </form>

        <div class="left">

              <label for="rememberme">
              <input name="autologin"      id="autologin" type="checkbox"  tabindex="4" checked="checked" class="radio" /> Conexão automática
              </label>

            </div>

        <div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

      </div>

      <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>

  </div>


<!-- /login -->



    <div id="container">

      <div id="top">

      <!-- login -->

        <ul class="login">

            <li class="left"> </li>

              <li>Olá Visitante!</li>

            <li>|</li>

            <li><a id="toggleLogin" href="#">Entrar</a></li>

        </ul> <!-- / login -->

      </div> <!-- / top -->



        <div class="clearfix"></div> 
   </div>
   </div>
[Resolvido] Login e sair como nesse site Byte2



Olá Mah!
Em relação a mudar as imagens, sim é possível, eu lhe faço as alterações de imagens por código!
Mas preciso que você me mande imagens referentes a estas:

Login Top - [Resolvido] Login e sair como nesse site Login_top
Login Left - [Resolvido] Login e sair como nesse site Login_l
Login Middle - [Resolvido] Login e sair como nesse site Login_m
Login Right - [Resolvido] Login e sair como nesse site Login_r
Button Login - [Resolvido] Login e sair como nesse site Button_login
Button Close - [Resolvido] Login e sair como nesse site Button_close

Até logo Mah!
Byte
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Street CS 25.10.10 20:03

Byte tipo nesta imagens:

[Resolvido] Login e sair como nesse site Login_l
[Resolvido] Login e sair como nesse site Login_r

Podia apagar a parte branca destas imagens e só ficar com a preta e fazer de novo o código ?

Obrigado ..
Street CS

Street CS
Novo Membro

Membro desde : 09/09/2010
Mensagens : 19
Pontos : 29

http://csstreet.foro.bz/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Epic Eric 25.10.10 21:14

Para isso, faça um pedido gráfico na seção correta. Precisará ter pelo menos 30 posts neste fórum.
Epic Eric

Epic Eric
***

Membro desde : 31/08/2010
Mensagens : 144
Pontos : 183

http://narutorpglife.co.cc/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 26.10.10 2:44

Olá novamente pessoal ^^

Desta vez eu faço as imagens para você Street CS!

O CSS de modificação das imagens está bem no início do código, já tem as laterais transparentes:

Código:
Código:
<!-- The CSS -->
   <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<style>
/* Login Panel */
#top {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}

#top ul.login {
background: url(http://img832.imageshack.us/img832/2707/loginr.png) no-repeat right 0;}

#top ul.login li.left {
background: url(http://img823.imageshack.us/img823/1687/loginl.png) no-repeat left 0;}

#top ul.login li {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}

/*Login*/
/* toggle effect - show/hide login*/
#login {
background: #1E1E1E;}

#login .loginContent input:focus.field {
background: #545454;}

#login .loginContent input.button_login {
background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}

#login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}

#login .loginClose a:hover {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
</style>

<!-- Mootools - the core -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
<!--Toggle effect (show/hide login form) -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>


<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write('  <style>  ');
document.write('  #loginn{display:none!important;}  ');
document.write('  </style>  ');
}
</script>

  <!-- Login -->
  <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

  <div id="login">

      <div class="loginContent">

        <form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

            <label for="log"><b>Username: </b></label>
            <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

            <label for="pwd"><b>Password:</b></label>
            <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

            <input class="menuoption button_login" type="submit" name="login" value=" " />

            <input type="hidden" name="redirect" value="" />

        </form>

        <div class="left">

              <label for="rememberme">
              <input name="autologin"      id="autologin" type="checkbox"  tabindex="4" checked="checked" class="radio" /> Conexão automática
              </label>

            </div>

        <div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

      </div>

      <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>

  </div>


<!-- /login -->



    <div id="container">

      <div id="top">

      <!-- login -->

        <ul class="login">

            <li class="left"> </li>

              <li>Olá Visitante!</li>

            <li>|</li>

            <li><a id="toggleLogin" href="#">Entrar</a></li>

        </ul> <!-- / login -->

      </div> <!-- / top -->



        <div class="clearfix"></div> 
   </div>
   </div>
[Resolvido] Login e sair como nesse site Byte2

Até logo Street CS!
Byte
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por HeLL (ShadowsMadame) 26.10.10 6:30

Olá Byte!

E para deslogar? Será que também haveria algum código para PHPBB3?

Estou querendo mudar os botões do meu menu, na verdade eu fiz isso mas tive que mudar porque não haveria como deslogar do fórum. Se tivesse um código desse para deslogar também, seria perfeito. É possível?
HeLL (ShadowsMadame)

HeLL (ShadowsMadame)
Novo Membro

Membro desde : 19/01/2009
Mensagens : 23
Pontos : 35

http://rockandrollclan.team-forum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 26.10.10 17:39

Olá ShadowsMadame!

Bom, creio que um código que funcione normalmente, como quando clicamos no botão, não, pois o código de sair exige o SID da pessoa e mais uma outra key, que (aos meus conhecimentos) não conseguimos pegar com outros códigos.

A diferença do modo normal e este, é que quando a pessoa clicar para sair, ele pede uma confirmação. "Você tem certeza de querer desconectar-se?"
E então a pessoa clica em "Sim" e sai do fórum.

Para fazer deste segundo modo descrito no parágrafo acima basta adicionar este link no menu:

Endereço do link para sair do fórum:
http://URL_DO_SEU_FORUM/login.forum?logout=true
[Resolvido] Login e sair como nesse site Byte2

Espero ter lhe ajudado ShadowsMadame!
Byte
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Loki 26.10.10 18:40

Eu adicionei esse código, só que bugou o " Últimos Assuntos " do meu fórum, ou seja, o widget de ultimos assuntos fica em scrool, os ultimos assuntos vem de baixo para cima, só que agora os ultimos assuntos não está mais em scrool, ficaram parados, e o widget ficou gigante para conter os tópicos.
Loki

Loki
****

Membro desde : 30/12/2009
Mensagens : 291
Pontos : 388

http://cshp.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Mah 26.10.10 22:59

Muito Obrigada Byte,
No momento peço só que instale as imagens abaixo,
Era somente isso que gostaria de fazer, pensei em mudar de cor, mas mudei de idéia Muito feliz

Código:
http://img41.imageshack.us/img41/3439/loginlc.png
http://img18.imageshack.us/img18/3017/loginrw.png

[Resolvido] Login e sair como nesse site Loginlc[Resolvido] Login e sair como nesse site Loginrw

Obrigada por tudo!
Mah

Mah
*

Membro desde : 27/03/2010
Mensagens : 31
Pontos : 73

http://www.google.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 27.10.10 1:22

De nada Mah, pode sempre contar comigo!!
^^

Refiz o código com as imagens que você me mandou:

Código:
Código:
<!-- The CSS -->
   <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<style>
/* Login Panel */
#top {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}

#top ul.login {
background: url(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}

#top ul.login li.left {
background: url(http://img41.imageshack.us/img41/3439/loginlc.png) no-repeat left 0;}

#top ul.login li {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}

/*Login*/
/* toggle effect - show/hide login*/
#login {
background: #1E1E1E;}

#login .loginContent input:focus.field {
background: #545454;}

#login .loginContent input.button_login {
background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}

#login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}

#login .loginClose a:hover {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
</style>

<!-- Mootools - the core -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
<!--Toggle effect (show/hide login form) -->
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
   <script type="text/javascript" src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>


<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write('  <style>  ');
document.write('  #loginn{display:none!important;}  ');
document.write('  </style>  ');
}
</script>

  <!-- Login -->
  <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

  <div id="login">

      <div class="loginContent">

        <form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

            <label for="log"><b>Username: </b></label>
            <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

            <label for="pwd"><b>Password:</b></label>
            <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

            <input class="menuoption button_login" type="submit" name="login" value=" " />

            <input type="hidden" name="redirect" value="" />

        </form>

        <div class="left">

              <label for="rememberme">
              <input name="autologin"      id="autologin" type="checkbox"  tabindex="4" checked="checked" class="radio" /> Conexão automática
              </label>

            </div>

        <div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

      </div>

      <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>

  </div>


<!-- /login -->



    <div id="container">

      <div id="top">

      <!-- login -->

        <ul class="login">

            <li class="left"> </li>

              <li>Olá Visitante!</li>

            <li>|</li>

            <li><a id="toggleLogin" href="#">Entrar</a></li>

        </ul> <!-- / login -->

      </div> <!-- / top -->



        <div class="clearfix"></div> 
   </div>
   </div>
[Resolvido] Login e sair como nesse site Byte2

Espero ter lhe ajudado Mah!
Byte



Olá ellber!
Eu não consigo nem ver os últimos assuntos no seu fórum, o script não foi feito por mim, não sei nem em que parte do código que pode estar acontecendo isso.
Tem alguma maneira de você colocar os últimos assuntos para os visitantes poderem ver? Se não for incômodo é claro!

Até logo ellber!
Byte
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por HeLL (ShadowsMadame) 27.10.10 1:50

Olá, Byte!

Acabei tendo o mesmo problema do Ellber. O widget de Últimos Assuntos acabou ficando estático também. Aí acabei retirando o seu código da página por conta disso, pois o widget ficava gigante prejudicando a configuração da página.
HeLL (ShadowsMadame)

HeLL (ShadowsMadame)
Novo Membro

Membro desde : 19/01/2009
Mensagens : 23
Pontos : 35

http://rockandrollclan.team-forum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 28.10.10 20:16

Certo ShadowsMadame e ellber!

Resolvi o problema de vocês, modificando o código e colocando um novo funcionamento, não tem mais o arquivo JS externo. O efeito do código funciona com CSS3 um novo padrão da web, porém não suportado por alguns navegadores antigos, os navegadores antigos somente vão ver a barra piscar e estar visível do nada ao invés de com um deslizamento, nada de extremamente importante na parte de funcionamento.

Eis o novo código, com as laterais de imagens que a Mah mandou, e com o funcionamento novo, testado e eu não achei nenhum defeito até agora (ou seja, não têm mais o defeito do scroll parar):

< Código >
<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write(' <style> ');
document.write(' #loginn{display:none!important;} ');
document.write(' </style> ');
}
</script>


<!-- The CSS -->
<link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<style>
#login {
overflow: visible;
height: auto;
-webkit-transition: margin-top 0.5s ease-in-out 0s;
-moz-transition: margin-top 0.5s ease-in-out 0s;
-o-transition: margin-top 0.5s ease-in-out 0s;
transition: margin-top 0.5s ease-in-out 0s;

}

/* Login Panel I */
#topp {
height: 38px;
position: relative;
}

#topp ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 38px;
width: auto;
font-weight: bold;
line-height: 38px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
padding-right: 45px;
}

#topp ul.login li.left {
height: 38px;
width: 45px;
padding: 0;
margin: 0;
display: block;
float: left;
}

#topp ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 38px;
}
#topp ul.login li a {color: #33CCCC;}
#topp ul.login li a:hover {color: white;}

/* Login Panel */
#topp {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}

#topp ul.login {
background: url(https://2img.net/r/ihimizer/img18/3017/loginrw.png) no-repeat right 0;}

#topp ul.login li.left {
background: url(https://2img.net/r/ihimizer/img41/3439/loginlc.png) no-repeat left 0;}

#topp ul.login li {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}

/*Login*/
/* toggle effect - show/hide login*/
#login {
background: #1E1E1E;}

#login .loginContent input:focus.field {
background: #545454;}

#login .loginContent input.button_login {
background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}

#login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}

#login .loginClose a:hover {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
</style>

<!-- Login -->
<div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

<div id="login" style="margin-top:-105px;">

<div class="loginContent">

<form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

<label for="log"><b>Username: </b></label>
<input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

<label for="pwd"><b>Password:</b></label>
<input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

<input class="menuoption button_login" type="submit" name="login" value=" " />

<input type="hidden" name="redirect" value="" />

</form>

<div class="left">

<label for="rememberme">
<input name="autologin" id="autologin" type="checkbox" tabindex="4" checked="checked" class="radio" /> Conexão automática
</label>

</div>

<div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

</div>

<div class="loginClose"><a href="#" id="closeLogin" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-105px' : '0px');">Fechar Painel</a></div>

</div>


<!-- /login -->



<div id="container">

<div id="topp">

<!-- login -->

<ul class="login">

<li class="left"> </li>

<li>Olá Visitante!</li>

<li>|</li>

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-105px' : '0px');">Entrar</a></li>

</ul> <!-- / login -->

</div> <!-- / topp -->



<div class="clearfix"></div>
</div>



</div>
< /Código > [Resolvido] Login e sair como nesse site Byte2

Espero ter ajudado a todos!
De bem com a vida

Até logo!
Byte


Última edição por Byte em 16.12.10 15:15, editado 2 vez(es)
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Loki 28.10.10 20:48

Olá Byte, com esse novo código o script funcionou perfeitamente.

Obrigado.
Loki

Loki
****

Membro desde : 30/12/2009
Mensagens : 291
Pontos : 388

http://cshp.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por HeLL (ShadowsMadame) 29.10.10 23:22

Olá, Byte!
Realmente, agora está funcionando perfeitamente.
Muito obrigada.
Muito feliz

Caso eu deseje alterar a cor, substituir o azul/verde por vermelho, onde devo alterar?
Feliz
HeLL (ShadowsMadame)

HeLL (ShadowsMadame)
Novo Membro

Membro desde : 19/01/2009
Mensagens : 23
Pontos : 35

http://rockandrollclan.team-forum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Taqueto 29.10.10 23:46

Olá, Byte!
Teria como você fazer para o phpBB2?
Obrigado!
Taqueto

Taqueto
***

Membro desde : 08/09/2010
Mensagens : 149
Pontos : 216

http://kingscross.forumeiro.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Talissa Andr. 30.10.10 20:46

Byte muito obrigada ajudou muitãoo
avatar

Talissa Andr.
Membro

Membro desde : 29/10/2010
Mensagens : 834
Pontos : 1130

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Talissa Andr. 30.10.10 21:12

Taqueto escreveu:Olá, Byte!
Teria como você fazer para o phpBB2?
Obrigado!
--
Byte,
Se podesse faser o phpBB2 como o Taqueto diz tbm,
Estaria grata! ^^
avatar

Talissa Andr.
Membro

Membro desde : 29/10/2010
Mensagens : 834
Pontos : 1130

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Byte 31.10.10 1:19

ShadowsMadame escreveu:
Caso eu deseje alterar a cor, substituir o azul/verde por vermelho, onde devo alterar?
Olá ShadowsMadame!

Para fazer isso você deve alterar o código CSS que se encontra no início de tudo, vou colorir e mexer com os tamanhos de um modo que possam entender como modificar, note os comentários (proprios do CSS) dentro de /* e */, vou explicar por meio deles:


< Código >
<script>
var nnome = "{USERNAME}" ;
if ( nnome != "Convidado"){
document.write(' <style> ');
document.write(' #loginn{display:none!important;} ');
document.write(' </style> ');
}
</script>


<!-- The CSS -->
<link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
<style>
#login {
color: #FFFFFF; /* Este é o local onde você irá colocar o código hexadecimal da cor de texto desta barra de login */
overflow: visible;
height: auto;
-webkit-transition: margin-top 0.5s ease-in-out 0s;
-moz-transition: margin-top 0.5s ease-in-out 0s;
-o-transition: margin-top 0.5s ease-in-out 0s;
transition: margin-top 0.5s ease-in-out 0s;
}

#login a{
color: #33CCCC;/* Este é o local onde você irá colocar o código hexadecimal da cor do link desta barra de login */
}

/* Login Panel I */
#topp {
height: 38px;
position: relative;
}

#topp ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 38px;
width: auto;
font-weight: bold;
line-height: 38px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
padding-right: 45px;
}

#topp ul.login li.left {
height: 38px;
width: 45px;
padding: 0;
margin: 0;
display: block;
float: left;
}

#topp ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 38px;
}
#topp ul.login li a {color: #33CCCC;}
#topp ul.login li a:hover {color: white;}


/* Login Panel */
#topp {
background: url([Resolvido] Login e sair como nesse site Login_top) repeat-x 0 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

#topp ul.login {
background: url(
[Resolvido] Login e sair como nesse site Loginrw) no-repeat right 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

#topp ul.login li.left {
background: url([Resolvido] Login e sair como nesse site Loginlc) no-repeat left 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

#topp ul.login li {
background: url([Resolvido] Login e sair como nesse site Login_m) repeat-x 0 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

/*Login*/
/* toggle effect - show/hide login*/
#login {
background: #1E1E1E;/* Este é o local onde você irá colocar o código hexadecimal da cor de fundo desta barra de login */
}

#login .loginContent input:focus.field {
background: #545454;}

#login .loginContent input.button_login {
background: transparent url([Resolvido] Login e sair como nesse site Button_login) no-repeat 0 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

#login .loginClose a {
color: #FFFFFF;/* Este é o local onde você irá colocar o código hexadecimal da cor do link ao lado do botão de fechar (X) desta barra de login */
background: url([Resolvido] Login e sair como nesse site Button_close) no-repeat right 0;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}

#login .loginClose a:hover {
background: url([Resolvido] Login e sair como nesse site Button_close) no-repeat right -20px;/* Substitua esta imagem pela URL da imagem que deseja trocar, esta outra imagem tem que ter os mesmos tamanhos */
}
</style>

<!-- Login -->
<div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">

<div id="login" style="margin-top:-105px;">

<div class="loginContent">

<form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">

<label for="log"><b>Username: </b></label>
<input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />

<label for="pwd"><b>Password:</b></label>
<input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />

<input class="menuoption button_login" type="submit" name="login" value=" " />

<input type="hidden" name="redirect" value="" />

</form>

<div class="left">

<label for="rememberme">
<input name="autologin" id="autologin" type="checkbox" tabindex="4" checked="checked" class="radio" /> Conexão automática
</label>

</div>

<div class="right">Não é um membro? <a href="/profile.forum?mode=register">Registar-me</a> | <a class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar Senha</a></div>

</div>

<div class="loginClose"><a href="#" id="closeLogin" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-105px' : '0px');">Fechar Painel</a></div>

</div>


<!-- /login -->



<div id="container">

<div id="topp">

<!-- login -->

<ul class="login">

<li class="left"> </li>

<li>Olá Visitante!</li>

<li>|</li>

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-105px' : '0px');">Entrar</a></li>

</ul> <!-- / login -->

</div> <!-- / topp -->



<div class="clearfix"></div>
</div>



</div>
< /Código > [Resolvido] Login e sair como nesse site Byte2

Somente ressaltando, as imagens que estão contidas neste código são as que se alinham assim:

[Resolvido] Login e sair como nesse site Login_top[Resolvido] Login e sair como nesse site Login_top [Resolvido] Login e sair como nesse site Login_top [Resolvido] Login e sair como nesse site Loginlc [Resolvido] Login e sair como nesse site Login_m [Resolvido] Login e sair como nesse site Login_m [Resolvido] Login e sair como nesse site Login_m [Resolvido] Login e sair como nesse site Loginrw [Resolvido] Login e sair como nesse site Login_top

Espero ter lhe ajudado ShadowsMadame!

Olá Taqueto e Talissa13!

Vamos dizer que o código funciona em todas as versões, funcionou no meu forum de testes quando eu coloquei em phpbb2

Se não funciona no fórum de vocês me avisem!!


Até logo pessoal!
Byte


Última edição por Byte em 16.12.10 15:20, editado 2 vez(es)
Byte

Byte
Super Membro

Membro desde : 12/02/2009
Mensagens : 1272
Pontos : 2341

http://gabionicle.forum.st/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Talissa Andr. 31.10.10 1:24

Olá Byte.
Bom no meu ñ funcionou!..
:T

tentei colocar o codigo aonde vc disse
e tbm tentei na folha de css e ñ deu certo..
o meu é phpBB3
avatar

Talissa Andr.
Membro

Membro desde : 29/10/2010
Mensagens : 834
Pontos : 1130

Ir para o topo Ir para baixo

Tópico resolvido Respondendo a sua pergunta fiz um tuto ver aii

Mensagem por The Vingator 31.10.10 15:47

(NOTA:O login / formulário de inscrição não está ativo Este é apenas um exemplo para explicar como usar o formulário de login em sua página /Web!).

Olá caro amiga o sistema de login nâo é tão dificil assim mas requer um otimo conhecimento ou pelo menos ter as noções de manuseio com as ferramentas de (Criaçâo, php, css, js) apesar de que a página principal seria em Html, eu fui até o site e baixei os arquivos completos.ZIP e olhei o conteudo.. o arquivo zipado esta no fim do tutorial so pra lembrar! entao vamos lá..

1. Baixe Todos os Arquivos e Extraia para a sua máquina!
2. Vá até a pasta no diretorio que você salvou e procure no ficheiro a pagina 'index.html', essa pagina seria a parte "Corpo" se poder de preferencia algum editor apropriado vai ser Bom!!
3. Ok agora o que voce irá fazer é procurar a tag form action caso nâo tenha encontrado procure com calma que você irá achar!
4. Se ja encontrou "Beleza", do lado na mesma linha // está escrito assim <form action="#" method"post">
5. A unica coisa que deverá trocar vai ser essa action, que na minha opniâo você poe uma outra pagina aonde os usuários iram ser redirecionados até lá!
6.O Resto dos links é só ir concertando de um por um nâo demorará!

Na prática,
você concertaria os menus deixando o formulario assim e muda somente a pagina que ao apertar no botão vai redirecionar todos usuários do seu site até lá exemplo: O usuário clicou em login ele vai para "LOGAR.HTM" ou se preferir "LOGAR.PHP" lá nesta pagina o sistema irá reconhecer se o mesmo ja é membro ou nâo caso nâo seja ele fica na mesma pagina e tem a chance de se tornar um usuário membro clicando no menu "Registre-me" que já fia logo ai do lado mesmo!

Vale a pena lembrar que os Direitos sâo do Site nâo seus mesmo que você Edite!
"O conhecimento é como a vida: todos têm, mas poucos o valorizam."

link do arquivo:
http://www.megaupload.com/?d=IEES3G8D

Nâo sou tão experte no assunto,
mas espero ter ajudado de alguma forma,
minha itençâo foi só essa espero que consiga esse sistema é muito legal!! abraçss Positivo
The Vingator

The Vingator
Novo Membro

Membro desde : 29/09/2008
Mensagens : 8
Pontos : 19

https://ajuda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Fireloko 31.10.10 20:57

isso tudo n resolveu o que o cara queri(que por sinal eh oq eu qro)
Fireloko

Fireloko
**

Membro desde : 30/10/2010
Mensagens : 50
Pontos : 98

http://g3ro.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por The Vingator 02.11.10 18:05

Fireloko, se ela queria somente o sistema de login para um site eu expliquei agora se for para o forun acho que muda o script de qualquer forma ja tah ai a base
The Vingator

The Vingator
Novo Membro

Membro desde : 29/09/2008
Mensagens : 8
Pontos : 19

https://ajuda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: [Resolvido] Login e sair como nesse site

Mensagem por Street CS 02.11.10 20:42

Olá Byte obrigado por tudo ficou excelente... Feliz
Street CS

Street CS
Novo Membro

Membro desde : 09/09/2010
Mensagens : 19
Pontos : 29

http://csstreet.foro.bz/

Ir para o topo Ir para baixo

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

- Tópicos semelhantes

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