[TUTORIAL] Widget "Edição do perfil do usuário"

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

  • 0

[TUTORIAL] Widget "Edição do perfil do usuário"

Mensagem por Ace em 05/02/13, 08:15 pm

Perfil do usuário
A partir deste tutorial podemos agora adicionar uma função de edição de perfil bem mais rápida e prática nos fóruns.



--> Tutoriais e astúcias <--
Widget "Edição do perfil do usuário"


- Adição do código no widget:
Cada versão tem um código, então terá somente de escolher o da sua versão! A parte em vermelho terá de ser configurada, mas ela será explicada mais para o fim deste pontos.
PhpBB 2
Código:
<style>
input[type="text"] {
width: 170px !important;
}
#perfil #register {
position: absolute;
left: 200px;
background: #D0EEFF;
padding: 10px;
border: 1px solid gray;
z-index: 999 !important;
}</style>
<input type="submit" id="ms-perfil" value="Mostrar/Esonder perfil" /><div id="perfil" style="display: none;"><form action="/profile" enctype="multipart/form-data" method="post" id="register" name="register"></br><input type="hidden" name="page_profil" value="informations"><input type="hidden" name="mode" value="editprofile"><input type="hidden" name="agreed" value="true"><input type="hidden" name="coppa" value=""><input type="hidden" name="current_email" value=""><input class="mainoption" type="submit" name="submit" value="Salvar"> <input class="liteoption" type="reset" name="reset" value="Reiniciar"></br></form></div>
<script>
jQuery(document).ready(function() { jQuery("#ms-perfil").click(function() { jQuery("#perfil").fadeToggle(); });
jQuery.get('/profile?mode=editprofile',function(data) {var i = jQuery('form table.forumline', data); jQuery('#perfil #register').prepend(i); jQuery('#perfil #register tr:gt(11),#perfil #register tr:lt(5)').css('display', 'none'); }); });
</script>

PhpBB 3 & Invision
Código:
<style>
input[type="text"] {
width: 170px !important;
}
#perfil #ucp {
position: absolute;
left: 200px;
background: #D0EEFF;
padding: 10px;
border: 1px solid gray;
z-index: 999 !important;
}</style>
<input type="submit" id="ms-perfil" value="Mostrar/Esonder perfil" /><div id="perfil" style="display: none;"><form action="/profile" enctype="multipart/form-data" method="post" name="post" id="ucp"></br><fieldset class="submit-buttons"><input type="hidden" name="page_profil" value="informations"><input type="hidden" name="mode" value="editprofile"><input type="hidden" name="agreed" value="true"><input type="hidden" name="coppa" value=""><input type="hidden" name="current_email" value=""><input class="button1" type="submit" name="submit" value="Salvar"> <input class="button2" type="reset" name="reset" value="Reiniciar"></fieldset></br></form></div>
<script>
jQuery(document).ready(function() { jQuery("#ms-perfil").click(function() { jQuery("#perfil").fadeToggle(); });
jQuery.get('/profile?mode=editprofile',function(data) {var i = jQuery('fieldset', data); jQuery('#perfil #ucp').prepend(i); jQuery('#perfil #ucp fieldset:eq(1),#perfil #ucp fieldset:eq(3), #perfil #ucp fieldset.submit-buttons:eq(1), #perfil #ucp fieldset.submit-buttons:eq(2)').css('display', 'none'); }); });
</script>
PunBB
Código:
<style>
input[type="text"] {
width: 170px !important;
}
#perfil #ucp {
position: absolute;
left: 200px;
background: #D0EEFF;
padding: 10px;
border: 1px solid gray;
z-index: 999 !important;
}</style>
<input type="submit" id="ms-perfil" value="Mostrar/Esonder perfil" /><div id="perfil" style="display: none;"><form action="/profile" enctype="multipart/form-data" method="post" name="post" id="ucp"></br><fieldset class="submit-buttons"><input type="hidden" name="page_profil" value="informations"><input type="hidden" name="mode" value="editprofile"><input type="hidden" name="agreed" value="true"><input type="hidden" name="coppa" value=""><input type="hidden" name="current_email" value=""><input class="button1" type="submit" name="submit" value="Salvar"> <input class="button2" type="reset" name="reset" value="Reiniciar"></fieldset></br></form></div>
<script>
jQuery(document).ready(function() { jQuery("#ms-perfil").click(function() { jQuery("#perfil").fadeToggle(); });
jQuery.get('/profile?mode=editprofile',function(data) {var i = jQuery('fieldset', data); jQuery('#perfil #ucp').prepend(i); jQuery('#perfil #ucp fieldset:eq(1),#perfil #ucp fieldset:eq(3), #perfil #ucp fieldset.submit-buttons:eq(1),  #perfil #ucp fieldset.submit-buttons:eq(2)').css('display', 'none'); }); });
</script>

Mais informações sobre a edição e adição de widgets poderá consultar o tutorial: Gerenciar os widgets do fórum, Administração e instalação do portal / Widgets.



--> FAQ do Tutorial <--
Widget "Edição do perfil do usuário"




  • Como posso personalizar o fundo do quadro de edição?
    Apenas localize no código a parte que está com o valor hexadecimal: #D0EEFF; este será o valor a ser alterado pelos caracteres hexadecimais correspondentes a cor desejada.





©Fórum dos Fóruns


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Widget "Edição do perfil do usuário"
avatar

Ace
Principal contribuidor
Principal contribuidor

Inscrito dia : 06/07/2011
Mensagens : 8880
Pontos Ativos : 11605

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