[TUTORIAL] Widget "Edição do 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"

1º - 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.

---

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"