Painel de usuário

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

Resolvido Painel de usuário

Mensagem por Rhaegar em 15/01/12, 11:07 am

Qual é minha questão:
Gostaria de colocar um painel de usuário igual o das imagens apresentadas abaixo.

Medidas que eu tomei para corrigir o problema:
Nenhuma.

Imagens do meu problema:
http://i47.servimg.com/u/f47/17/17/94/61/hhhh10.png
http://i47.servimg.com/u/f47/17/17/94/61/hhhhhh10.png

Endereço do meu fórum:
onepieceadventure.forumeiros.com.pt

Versão do meu fórum:
PHPBB3

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por Cream em 15/01/12, 12:19 pm

Olá,

Tente o seguinte 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 {
            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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}
     
            #topp ul.login li.left {
            background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}
     
            #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:-100px;"><div class="loginContent">
     
     
     
     
            <table  style="width:100%;"  border="0">
            <tr>
     
            <td style="text-align:center;">
            <table border="0">
            <tr>
     
            <td>
            <script>
            jQuery(document).ready(function(){
              jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
                  link = jQuery('.panel dl:first img', data).attr('src');
                  if(link){
                    jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
                  }else{
                    jQuery('#avatar').html('');
                  }
              });
            });
            </script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
            </td>
     
            <td>
            <span style="font-size: 1.2em;">
            <font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&amp;u=283">{USERNAME}</a></font>
     
            <b>Mensagens:</b> {USERCOUNTPOST}
            </span>
            </td>
     
            </tr>
            </table>
            </td>
     
     
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Alterar</b>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a>
     
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Ver</b>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a>
     
            <a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>
     
            <a href="../search.forum?search_id=draftsearch">Rascunhos</a>
     
            <a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a>
     
                 
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b>
     
            <a href="../msg.forum?folder=inbox">Mensagens Privadas</a>
     
            <a href="../search.forum?search_topics=Victor">Meus tópicos</a>
     
            <a href="../search.forum?search_id=egosearch">Tópicos que participa</a>
     
            <a href="../search.forum?search_author=Victor&show_results=posts">Minhas mensagens</a>
     
            <a href="../search.forum?search_id=newposts">Últimos tópicos</a>
     
            </span>
            </td>
     
            </tr>
            </table>
     
     
     
     
            </div>
     
            </div>
     
     
            <!-- /login --><div id="container"><div id="topp">
     
            <!-- login -->
     
            <ul class="login">
     
            <li class="left"> </li>
     
            <li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>
     
            </ul> <!-- / login -->
     
            </div> <!-- / topp --><div class="clearfix"></div>
            </div></p></div>

Coloque em um WidGet!
Painel de Controles -> Módulo -> Gestão dos widgets do fórum -> Criar um widget personalizado

Melhores cumprimentos!
avatar

Cream
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 15/12/2010
Mensagens : 8540
Pontos Ativos : 11636

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

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 01:34 pm

Olá.

Resultou, mas ficou uma sombra cinza em volta da aba Painel de Usuário.
Veja :http://onepieceadventure.forumeiros.com.pt/

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por Izzy em 15/01/12, 02:14 pm

Olá,

Crie um widget com esse codigo:
Código:
<span style="font-size: 12px; line-height: normal"> <!-- 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>
 </div></span>
Mude a visualização dele só para convidados
Painel de controle Módulos Configuração dos widgets do fórum Clique nesse simbolo no widget do Painel ""

Desmarque a opção Membros, Administradores e Moderadores, apenas deixe convidados.


Depois substitua o codigo que o Cream disse por esse:
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 {
            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: transparent;
            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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}
     
            #topp ul.login li.left {
            background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}
     
            #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:-100px;"><div class="loginContent">
     
     
     
     
            <table  style="width:100%;"  border="0">
            <tr>
     
            <td style="text-align:center;">
            <table border="0">
            <tr>
     
            <td>
            <script>
            jQuery(document).ready(function(){
              jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
                  link = jQuery('.panel dl:first img', data).attr('src');
                  if(link){
                    jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
                  }else{
                    jQuery('#avatar').html('');
                  }
              });
            });
            </script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
            </td>
     
            <td>
            <span style="font-size: 1.2em;">
            <font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&amp;u=283">{USERNAME}</a></font>
     
            <b>Mensagens:</b> {USERCOUNTPOST}
            </span>
            </td>
     
            </tr>
            </table>
            </td>
     
     
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Alterar</b>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a>
     
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Ver</b>
     
            <a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a>
     
            <a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>
     
            <a href="../search.forum?search_id=draftsearch">Rascunhos</a>
     
            <a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a>
     
                 
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b>
     
            <a href="../msg.forum?folder=inbox">Mensagens Privadas</a>
     
            <a href="../search.forum?search_topics=Victor">Meus tópicos</a>
     
            <a href="../search.forum?search_id=egosearch">Tópicos que participa</a>
     
            <a href="../search.forum?search_author=Victor&show_results=posts">Minhas mensagens</a>
     
            <a href="../search.forum?search_id=newposts">Últimos tópicos</a>
     
            </span>
            </td>
     
            </tr>
            </table>
     
     
     
     
            </div>
     
            </div>
     
     
            <!-- /login --><div id="container"><div id="topp">
     
            <!-- login -->
     
            <ul class="login">
     
            <li class="left"> </li>
     
            <li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>
     
            </ul> <!-- / login -->
     
            </div> <!-- / topp --><div class="clearfix"></div>
            </div></p></div>

Depois vá em:
Painel de controle Módulos Configuração dos widgets do fórum Clique nesse simbolo no widget do Painel ""

E desmarque a opção Convidados.

Diga se funcionou!

Att, FirstTime.
avatar

Izzy
Nível 9

Masculino
Inscrito dia : 11/03/2011
Mensagens : 157
Pontos Ativos : 282

Ver perfil do usuário http://ihabbi-forum.forumeiros.com/

Resolvido Re: Painel de usuário

Mensagem por Thor em 15/01/12, 02:26 pm

Painel de controle Seta Visualização Seta Página inicial ou home page Seta Geral.

Procure por: Mensagem na página inicial, Conteúdo da mensagem.
Adicione este 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 {
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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}

#topp ul.login li.left {
background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}

#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:-100px;"><div class="loginContent">




<table  style="width:100%;"  border="0">
<tr>

<td style="text-align:center;">
<table border="0">
<tr>

<td>
<script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
</td>

<td>
<span style="font-size: 1.2em;">
<font size="4">{USERLINK}</font>

<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>



<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Alterar</b>

<a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a>

<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a>

<a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a>

<a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a>

</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Ver</b>

<a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a>

<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>

<a href="../search.forum?search_id=draftsearch">Rascunhos</a>

<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a>

<a href="../rpg_sheet_edit.forum">Ficha de personagem</a>

</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b>

<a href="../msg.forum?folder=inbox">Mensagens Privadas</a>

<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a>

<a href="../search.forum?search_id=egosearch">Tópicos que participa</a>

<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a>

<a href="../search.forum?search_id=newposts">Últimos tópicos</a>

</span>
</td>

</tr>
</table>




</div>

</div>


<!-- /login --><div id="container"><div id="topp">

<!-- login -->

<ul class="login">

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

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>

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

</div> <!-- / topp --><div class="clearfix"></div>
</div>

Resulto(a)? Não esqueça de agradecer com um obrigado!
avatar

Thor
Usuário destaque

Masculino
Inscrito dia : 16/11/2011
Mensagens : 627
Pontos Ativos : 932

Ver perfil do usuário http://www.techarte.co.cc/forum

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 02:39 pm

Olá.

FirstTime, não resultou, até bagunçou a estrutura do fórum como convidado. Feliz

Mr.King, resultou, mas deixou a fonte dos títulos das categoriais muito grande.

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por Thor em 15/01/12, 03:00 pm

Como assim deixou muito grande? aqui aparece normalmente!
avatar

Thor
Usuário destaque

Masculino
Inscrito dia : 16/11/2011
Mensagens : 627
Pontos Ativos : 932

Ver perfil do usuário http://www.techarte.co.cc/forum

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 03:18 pm


Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por ShockWave™ em 15/01/12, 03:22 pm

Aqui Está :
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 {
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: red;}
#topp ul.login li a:hover {color: red;}

/* 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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}

#topp ul.login li.left {
background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}

#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:-100px;"><div class="loginContent">




<table  style="width:100%;"  border="0">
<tr>

<td style="text-align:center;">
<table border="0">
<tr>

<td>
<script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
</td>
<td>
<span style="font-size: 1.2em;">
<font size="4">{USERLINK}</font><br />
<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Alterar</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a><br />
</span>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Ver</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a><br />
<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a><br />
<a href="../search.forum?search_id=draftsearch">Rascunhos</a><br />
<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a><br />
<a href="../rpg_sheet_edit.forum">Ficha de personagem</a><br />
</span>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b><br />
<a href="../msg.forum?folder=inbox">Mensagens Privadas</a><br />
<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a><br />
<a href="../search.forum?search_id=egosearch">Tópicos que participa</a><br />
<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a><br />
<a href="../search.forum?search_id=newposts">Últimos tópicos</a><br />
</span>
</td>

</tr>
</table>




</div>

</div>


<!-- /login --><div id="container"><div id="topp">

<!-- login -->

<ul class="login">

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

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>

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

</div> <!-- / topp --><div class="clearfix"></div>
</div>


Está Satisfeito(a) ? Clique no botão Obrigado Logo Acina.
avatar

ShockWave™
Nível 10

Masculino
Inscrito dia : 04/03/2011
Mensagens : 296
Pontos Ativos : 449

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

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 03:50 pm

Continua do mesmo jeito. D=

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por ShockWave™ em 15/01/12, 03:51 pm

mande uma imagem
avatar

ShockWave™
Nível 10

Masculino
Inscrito dia : 04/03/2011
Mensagens : 296
Pontos Ativos : 449

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

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 03:59 pm

Fica da mesma forma da imagem que mostrei acima, quando coloco na Mensagem da pagina inicial.
http://i47.servimg.com/u/f47/17/17/94/61/dddddd10.png

Quando coloco no Widget fica normal, mas fica um sombra abaixo da aba Painel de usuário.

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por ShockWave™ em 15/01/12, 04:02 pm

Olá Va Em Painel de Comtrole :seta2: Módulos :seta2: Gestão de Widgets :seta2: Criar Um Wibjet personalizado. e Cole o Seguinte 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 {
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: red;}
#topp ul.login li a:hover {color: red;}

/* 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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}

#topp ul.login li.left {
background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}

#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:-100px;"><div class="loginContent">




<table  style="width:100%;"  border="0">
<tr>

<td style="text-align:center;">
<table border="0">
<tr>

<td>
<script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
</td>
<td>
<span style="font-size: 1.2em;">
<font size="4">{USERLINK}</font><br />
<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Alterar</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a><br />
</span>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Ver</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a><br />
<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a><br />
<a href="../search.forum?search_id=draftsearch">Rascunhos</a><br />
<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a><br />
<a href="../rpg_sheet_edit.forum">Ficha de personagem</a><br />
</span>
</td>

<td style="text-align:center; color: red">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b><br />
<a href="../msg.forum?folder=inbox">Mensagens Privadas</a><br />
<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a><br />
<a href="../search.forum?search_id=egosearch">Tópicos que participa</a><br />
<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a><br />
<a href="../search.forum?search_id=newposts">Últimos tópicos</a><br />
</span>
</td>

</tr>
</table>




</div>

</div>


<!-- /login --><div id="container"><div id="topp">

<!-- login -->

<ul class="login">

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

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>

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

</div> <!-- / topp --><div class="clearfix"></div>
</div>
Satisfeito(a) ? Clique no Botão Obrigado Logo Acima
avatar

ShockWave™
Nível 10

Masculino
Inscrito dia : 04/03/2011
Mensagens : 296
Pontos Ativos : 449

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

Resolvido Re: Painel de usuário

Mensagem por King Gz; em 15/01/12, 04:08 pm

Olá,

Tente este
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 {
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(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}

#topp ul.login li.left {
background: url(http://img41.imageshack.us/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{padding-top:0px;width:790px;height:100px;}

#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:-100px;"><div class="loginContent">




<table  style="width:100%;"  border="0">
<tr>

<td style="text-align:center;">
<table border="0">
<tr>

<td>
<script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
</td>

<td>
<span style="font-size: 1.2em;">
<font size="4">{USERLINK}</font>

<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>



<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Alterar</b>

<a href="../profile.forum?mode=editprofile&page_profil=informations">Informações</a>

<a href="../profile.forum?mode=editprofile&page_profil=preferences">Preferências</a>

<a href="../profile.forum?mode=editprofile&page_profil=signature">Assinatura</a>

<a href="../profile.forum?mode=editprofile&page_profil=avatars">Avatar</a>

</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Ver</b>

<a href="../profile.forum?mode=editprofile&page_profil=friendsfoes">Amigos & ignorados</a>

<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>

<a href="../search.forum?search_id=draftsearch">Rascunhos</a>

<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a>

<a href="../rpg_sheet_edit.forum">Ficha de personagem</a>

</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b>

<a href="../msg.forum?folder=inbox">Mensagens Privadas</a>

<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a>

<a href="../search.forum?search_id=egosearch">Tópicos que participa</a>

<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a>

<a href="../search.forum?search_id=newposts">Últimos tópicos</a>

</span>
</td>

</tr>
</table>




</div>

</div>


<!-- /login --><div id="container"><div id="topp">

<!-- login -->

<ul class="login">

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

<li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>

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

</div> <!-- / topp --><div class="clearfix"></div>
</div>

Até mais Piscada
avatar

King Gz;
Membro do Fórum

Masculino
Inscrito dia : 20/11/2011
Mensagens : 1827
Pontos Ativos : 2486

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

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 04:33 pm

Nenhum dos códigos resolveram o problema. Feliz

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

Resolvido Re: Painel de usuário

Mensagem por - Pride - em 15/01/12, 05:25 pm

Testei o codigo de Nathan-zinho e funcionou perfeitamente, Pesso que veja se marcou não em usar um table type e se adcionou e salvou o widiget na estrutura do seu forum. Piscada
avatar

- Pride -
Nível 6

Masculino
Inscrito dia : 18/12/2011
Mensagens : 66
Pontos Ativos : 87

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

Resolvido Re: Painel de usuário

Mensagem por Rhaegar em 15/01/12, 05:29 pm

XD
Meu problema era o table type, nunca soube o quê é isso. .-.
Obrigado, pode bloquear. ^^

Rhaegar
Nível 7

Masculino
Inscrito dia : 15/01/2012
Mensagens : 93
Pontos Ativos : 136

Ver perfil do usuário

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