Caixa de login e outros

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

Resolvido Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 01:36 pm

Qual é minha questão:
Queria saber como posso estar colocando essa "caixa" de login no meu forum, como podem ver na imagem ->> http://i.imgur.com/7LBSW.png

Fórum aonde vi ->> http://www.mobitehk.com/


Medidas que eu tomei para corrigir o problema:
N/D

Links e imagens do meu problema:
http://i.imgur.com/7LBSW.png

Endereço do meu fórum:
http://mundotec.foruns.com.pt

Versão do meu fórum:
PUNBB


Última edição por MineCraft em 05/06/12, 06:20 pm, editado 1 vez(es)
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 02:46 pm



Widget Login personalizado


Com um pequeno código em HTML, vamos criar um efeito em um widget ao qual não será mais necessário usar-mos-ei o widget pré-definido de Login, podendo personalizar quando desejado.


--> Tutoriais <--
Widget "Login" personalizado



- Gestão dos widgets do fórum:
Vamos criar um widget personalizado em nosso fórum e adicionar o código, como criar de forma correcta um widget, tendo em conta todas as suas opções:

(carregue na imagem para aumentar)
Nome do widget - Terá de colocar um título para o widget, de forma a poder identifica-lo na lista dos widgets pessoais do Painel de Controle.
Utilizar um table type - Caso opte pale opção "Sim" o widget terá a moldura padrão dos restantes widgets, caso opte por "Não" o conteúdo não estará rodeado por qualquer moldura.
Título do widget - Neste campo, terá de atribuir um título, o que será visualizado no seu fórum. Caso tenha marcado a opção "Não" na opção anterior, colocar ou não um título será indiferente.
Fonte do widget - Aqui deverá colocar o conteúdo do widget, poderá colocar variáveis mas não poderá colocar BBcode e sim HTML. Veremos nos pontos seguintes como poderá utilizar o editor HTML.
Salvar - Por fim, após colocar o conteúdo, terá de "Salvar" o seu widget personalizado.


- Código HTML necessário para reproduzir o efeito:
Agora, você poderá copiar e colar no nosso novo widget o código abaixo, personalizando os pontos desejados:
Código:
<form action="/login" method="post" name="form_login">

<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" /></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" />

<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://illiweb.com/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://illiweb.com/fa/admin/icones/small_ico/utilisateur.png"/>  Registrar-se</a><br></br>

<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>

</form>


- Autorizações do widget:
Para deixar-mos o trabalho muito bem feito, vamos aplicar um outro efeito que o próprio widget já tem, que é as autorizações. Depois de criar e adicionar o widget a coluna de widgets do fórum, você vai editar as permissões de visualização dele, clicando no botão :


Deixe esse widget visível apenas aos Convidados, já que ele não terá utilidade nenhuma para os que já estiverem logados no fórum.


  • Posso aplicar um efeito CSS?
    Pode. Basta você adicionar uma DIV ou uma SPAN contendo o atributo CLASS com o valor CSS. Por exemplo:
    <div class="plogin">CÓDIGO DO SEU WIDGET</div>

  • Resultado:

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 03:33 pm

Olá amigo,

Desculpa não ter falado melhor mais queria um igual aquele =)
e aquilo é WIDGET?

Até mais.
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 03:34 pm

Sim senhor, ele só modificou o tamanho da fonte. Piscada

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 03:38 pm

Olá

Assim mais como ele colocou lá observe que não ta juntos com widgts esta do lado, e não tem como você pegar codigo usado por ele?

Até mais
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 04:01 pm

Olá!

Aqui está o código usado:
Código:
<form action="/login" method="post"><p><label for="username"><strong>Username:</strong></label></p><p style="height:2em;valign:top;"><input type="text" name="username" id="username" size="15" maxlength="40" value="" class="inputbox autowidth" /></p><p><label for="password"><strong>Password:</strong></label></p><p style="height:2em;valign:top;"><input type="password" id="password" name="password" size="15" maxlength="25" class="inputbox autowidth" /></p><p align="center"><a href="/profile?mode=sendpassword" rel="nofollow">I forgot my password</a></p><p align="center"><input type="checkbox" name="autologin" id="autologin" tabindex="4" class="checkbox" checked="checked" /><label for="autologin"> Log on automatically</label></p><p align="center"><input type="submit" name="login" tabindex="6" value="Log in" class="button1" /></p></form>
Atenciosamente,
Shek

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 04:08 pm

Olá assim o seu não ficou igual, porém consegui um ate melhor que fica do lado certo e posição certa escrito tudo certo só falta a "CAIXA", sabe acho que deve ser algum CSS que cria aquele modelo, não sei bem.

Aqui esta codigo que peguei.

Código:
<td><div align="right" id="panel"><div class="panel_bar"><b>Logged as <strong>Matfwar</strong>  <img src="http://i49.servimg.com/u/f49/16/89/33/06/online10.png">  </b></div><b> <div class="panel_bar"><a href="/profile?mode=editprofile">Profile  <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_profile.png">  </a> - <a href="/login?logout">Log out  <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_logout.png">  </a></div><form method="get" action="/search.forum" id="search" class="search_box"><table cellspacing="0" cellpadding="0"><tbody><tr><td><input type="text" name="search_keywords" id="srch_input" value="Search Mobitehk..." onfocus="if(this.value=='Search Mobitehk...') this.value='';" onblur="if(this.value=='') this.value='Search Mobitehk...';"></td><td><input id="srch_button" value=" " type="submit"></td> </tr></tbody></table></form>  </b></div><b><br></b></td>


Até mais.
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 04:33 pm

Olá Mine!

Desculpe eu! Pensei que estava dizendo a caixa de Login. O código creio eu é esse:
Código:
<style>.cpr {
margin-left: 0px;
float:  left;}

.srch {
margin-right: 0px;
float: right;}

#panel {
background: transparent url(http://i49.servimg.com/u/f49/15/59/36/28/contai10.png) top left repeat;
width: 240px;
color: #fff;
margin: auto auto;
padding: 6px;
text-align: left;
border: 1px solid #333;
float: right;
margin: 10px 10px 0 0;
margin-top: 10px;
margin-bottom: 10px;
font-size: 11px;
-moz-border-radius: 0.5em 0.5em 0.5em 0.5em;
border-radius: 0.5em 0.5em 0.5em 0.5em;}

#panel .panel_bar {
background: transparent url(http://i49.servimg.com/u/f49/15/59/36/28/panel_10.png) top left repeat;
color: #fff;
padding: 4px;
border: 1px solid #404040;
margin: 2px;
-moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
border-radius: 0.3em 0.3em 0.3em 0.3em;}

#panel .links {
margin: 0;
float: right;}

#panel a {
color: #fff;
text-decoration: none;}

#panel img.tools {
margin: 2px;}

/*SEARCH BOX----------------------------------*/

.search_box #srch_input{
border: 1px solid #404040;
height: 28px;
width: 169px;
color: #fff;
font-weight: bold;
text-shadow: 1px 1px 0 black;
background: transparent url(http://i49.servimg.com/u/f49/15/59/36/28/panel_10.png) top left repeat;
color: #fff;
padding: 8px;
margin: 4px;
font-weight: bold;
text-shadow: 1px 1px 0 black;

-moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
border-radius: 0.3em 0.3em 0.3em 0.3em;}







.search_box #srch_button{
display: block;
width: 50px;
height: 50px;
border: 0;
background: url('http://i48.servimg.com/u/f48/16/98/34/40/button10.png') bottom;
text-indent: -99999px;
}


.search_box #srch_button:hover {
background-position: 0 0;
}</style><td><div align="right" id="panel"><div class="panel_bar"><b>Logged as <strong>Matfwar</strong>  <img src="http://i49.servimg.com/u/f49/16/89/33/06/online10.png">  </b></div><b> <div class="panel_bar"><a href="/profile?mode=editprofile">Profile  <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_profile.png">  </a> - <a href="/login?logout">Log out  <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_logout.png">  </a></div><form method="get" action="/search.forum" id="search" class="search_box"><table cellspacing="0" cellpadding="0"><tr><td><input type="text" name="search_keywords" id="srch_input" value="Search Mobitehk..." onfocus="if(this.value=='Search Mobitehk...') this.value='';" onblur="if(this.value=='') this.value='Search Mobitehk...';"></td><td><input id="srch_button" value=" " type="submit"></td> </tr></table></form>  </b></div><b><br></b></td>

Novamente, peço-lhes desculpas pelo erro.

Atenciosamente,
Shek

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 05:33 pm

Olá amigo funcionou perfeitamente o CSS porém o HTML não ta ajustado corretamente assim creio eu kkk, olha oque acontece ->>
http://i.imgur.com/TulZM.png

A "caixa" fica sobre uma parte do meu forum.

avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 05:37 pm

Que parte seria aquela? Você mudou algo no código? Leia o conteúdo do seguinte tópico: http://ajuda.forumeiros.com/t56964-tutorial-caixa-de-login-fixa-no-forum?highlight=Caixa+de+login

Atenciosamente,
Shek

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 05:49 pm

Olá amigo,

Não mudei apenas colocei lugar errado, colocei como mensagem de HOME-PAGE lugar certo é PAGINA principal editando template ae ficou perfeito, porém há mais 1 problema kkk, assim quando eu aperto log out ou seja aperto sair não aparece igual no site que passei aparece Logged as Convidado
Profile - Log out , no site aparece assim: Welcome, Guest! Log in - Create account muda as opção para Logar ou criar conta, não sei se me entendeu kkk.

Até mais.
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 05:54 pm

Olá!

Isso é o famoso jogo de variáveis.
Welcome, Guest!: Ele usa a variável USERNAME : http://ajuda.forumeiros.com/t9204-
Log in - Create account: Neste caso, creio que seja algo relaciona a autorização, porque não existe vairável para tal efeito ao não ser em Invision. Muito feliz

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 05:59 pm

Olá

Assim sobre USERNAME eu sei, mais esse login - create account que é problema, não existe um modo de fazer o de logado sumir deixando ele "invisível" assim aparecendo somente o de visitante, porque o site aonde tem esse efeito é Punbb deve ter alguma maneira.

codigos visitante é este

Código:
<td><div align="right" id="panel"><div class="panel_bar"><b>Welcome, Guest! <img src="http://i49.servimg.com/u/f49/16/89/33/06/user_i10.png"> </b></div><b> <div class="panel_bar"><a href="/login">Log in <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_login.png"> </a> - <a href="/register">Create account <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_register.png"> </a></div><form method="get" action="/search.forum" id="search" class="search_box"><table cellspacing="0" cellpadding="0"><tbody><tr><td><input type="text" name="search_keywords" id="srch_input" value="Search Mobitehk..." onfocus="if(this.value=='Search Mobitehk...') this.value='';" onblur="if(this.value=='') this.value='Search Mobitehk...';"></td><td><input id="srch_button" value=" " type="submit"></td> </tr></tbody></table></form><a href="/profile?mode=sendpassword">  Forgot Password   <img src="http://hitskin.com/themes/17/89/80/i_icon_mini_faq.png">  </a>  </b></div><b><br></b></td>

Até mais.
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 06:01 pm

Então amigo, ele deve usar um widget personalizado para um, e outro personalizado com o efeito de Logado. Muito feliz

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 06:12 pm

Sei assim então mais se colocar como WidGet não fica certo fica so pelo meio, acho que não vai ter jeito neh?

Até mais.
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

Resolvido Re: Caixa de login e outros

Mensagem por Convidad em 05/06/12, 06:17 pm

Positivo Exato!

Convidad
Convidado


Resolvido Re: Caixa de login e outros

Mensagem por MineCraft em 05/06/12, 06:20 pm

Então muito obrigado Shek ;D

Resolvido!
avatar

MineCraft
Nível 9

Masculino
Inscrito dia : 18/05/2012
Mensagens : 155
Pontos Ativos : 222

Ver perfil do usuário http://sourcesize.forumaqui.com/

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

- Tópicos similares

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