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

Ir para baixo

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

Mensagem por Ace 05.02.13 22:15

[TUTORIAL] Widget "Edição do perfil do usuário" Groupe10 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.
[TUTORIAL] Widget "Edição do perfil do usuário" Versio11 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>

[TUTORIAL] Widget "Edição do perfil do usuário" Versio12 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>
[TUTORIAL] Widget "Edição do perfil do usuário" Versio15 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


[TUTORIAL] Widget "Edição do perfil do usuário" Act_bottom 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"
Ace
Ace
Membro Entusiasta

Membro desde : 06/07/2011
Mensagens : 8881
Pontos : 11608

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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