Como criar o painel do usuario igual ao que tem aqui ?

Qual é minha questão:
Gostaria de criar um painel do usuário que nem esse:
Como faz?

Links e imagens do meu problema:
https://2img.net/h/oi49.tinypic.com/v6682g.png

Endereço do meu fórum:
http://bghcheats.forumeiros.com/ ou www.bghcheats.tk

Versão do meu fórum:
PUNBB

Olá!

Peço que cheque o conteúdo deste tutorial:

https://ajuda.forumeiros.com/t16713-

Abraços.

Olá amigo se preferir ja o painel pronto aqui esta .

Código:

<div class="module"><div class="inner"><span class="corners-top"><span></span></span><script src="http://illiweb.com/fa/js_16/collapsible_faq.js"></script>

<script src="http://illiweb.com/fa/js_16/collapsible_faq.js" type="text/javascript"></script>
<script>
jQuery(document).ready(function(){
 jQuery.get('http://ajuda.forumeiros.com/profile?mode=editprofile&page_profil=avatars', function(data) {
 link = jQuery('#ucp dd:first img', data).attr('src');
 jQuery('#avatar').attr('src', link);
 });
});
</script>

<span style="font-size:1.2em"><img id="avatar" src="http://cdn1.iconfinder.com/data/icons/walle/64/media_player.png" align="left" width="45px" height="70px"><br><font size="4"><a href="http://gamesdesigner.forumeiros.com/profile.forum?mode=viewprofile&amp;u=44997">{USERLINK}</a></font><br>
<b>Mensagens:</b> <span id="usercountpost">{USERCOUNTPOST}</span><br><br>
<span id="friends_cook"></span>
<br></span>
<dl class="faq" style="margin-bottom:-1px!important"><dt></dt>
<dd onclick="return CFAQ.display('l20',false)">
 <div style="cursor:pointer" onclick="return CFAQ.display('l20',true)" onfocus="this.blur()"><img src="http://2img.net/i/fa/admin/icones/editer.png" style="width:15px;height:15px"> Alterar</div></dd><dd style="display:none" id="l20"><span style="margin:0pt 0px 0pt 0px;display:block"><a href="/profile?mode=editprofile&amp;page_profil=informations" target="_blank"> Informações </a></span><span>
<a href="/profile?mode=editprofile&amp;page_profil=preferences" target="_blank"> Preferências </a></span><br><span><a href="/profile?mode=editprofile&amp;page_profil=avatars" target="_blank"> Avatar </a></span></dd>
<dd onclick="return CFAQ.display('l21',false)">
 <div style="cursor:pointer" onclick="return CFAQ.display('l21',true)" onfocus="this.blur()"><img src="http://2img.net/i/fa/admin/icones/small_ico/support.png" style="width:15px;height:15px"> Ver</div></dd>
<dd style="display:none" id="l21"><span style="margin:0pt 0px 0pt 0px;display:block"><a href="/profile?mode=editprofile&amp;page_profil=friendsfoes" target="_blank"> Amigos e ignorados</a></span><span><a href="/search?search_id=watchsearch" target="_blank"> Tópicos supervisionados </a></span><br><span><a href="/search?search_id=draftsearch" target="_blank"> Rascunhos </a></span><br><span><a href="/search?search_id=favouritesearch" target="_blank"> Tópicos favoritos</a></span></dd>
<dd onclick="return CFAQ.display('l22',false)">
 <div style="cursor:pointer" onclick="return CFAQ.display('l22',true)" onfocus="this.blur()"><img src="http://2img.net/i/fa/admin/icones/small_ico/boite_email.png" style="width:15px;height:15px"> Tópicos e mensagens</div></dd><dd style="display:none" id="l22"><span style="margin:0pt 0px 0pt 0px;display:block"><a href="/privmsg" target="_blank"> Mensagens Privadas</a></span><span><a href="/search?search_topics=@Coper" target="_blank"> Meus tópicos</a></span><br><span><a href="/search?search_id=egosearch" target="_blank"> Tópicos que participo </a></span><br><span><a href="/search?search_author=@Coper&amp;show_results=posts" target="_blank"> Minhas mensagens</a></span><br><span><a href="/search?search_id=newposts" target="_blank"> Novas mensagens<br> <small>(Ter 27 Mar 2012)</small></a></span></dd></dl><span class="corners-bottom"><span></span></span></div></div>

Atéé.