Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Login

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
Kyo Panda
 
Shek Crowley
 
vitorsali
 
while
 
fiapinho
 
iScroll
 
Fou-Lu
 
Kyou
 
Smoke.xX
 
Neimasinho
 

Quem está conectado
316 usuários online :: 11 usuários cadastrados, 1 Invisível e 304 Visitantes :: 1 Motor de busca

E.Jesus, Ednaldo Hitmam, Harleen, Kyo Panda, PESS_dodo, SeuRaymundo, Shek Crowley, TZero, vitorsali, William_iHarDz, xBreninho_.

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Refazendo a área do perfil dos usuários

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

Resolvido Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Sex 18 Nov 2016 - 18:41

Detalhes da questão


Endereço do fórum: http://atelier262.forumeiros.com/
Versão do fórum: PunBB

Descrição


Bom eu quero mudar 100% a área do perfil dos cara!

Olha só como está: http://prnt.sc/d8ymt1

Como eu quero que esteja: http://prnt.sc/d8yo3e e http://prnt.sc/d8yoo7

Bom eu quero retirar tudo do menu que está TUDO mesmo, EXATAMENTE TUDO, e deixar como eu mostrei no print! Tirar aquele troço de:

Bom se possível deixar exatamente igual o print:
Spoiler:
Como eu quero que esteja: http://prnt.sc/d8yo3e e http://prnt.sc/d8yoo7

E na área de editar o perfil deixar assim também.

E SÓ COM ESSAS OPÇÕES:

OBVIAMENTE O NOME
  • Data de inscrição

  • Mensagens privadas

  • Mensagens

  • ON/OFF

  • Sexo

  • E-mail

  • Amigos (NESTA OPÇÃO AO CLICAR EM VER TODOS, QUERO QUE CARREGA NA MESMA ORDEM ALFABÉTICA E PARA BAIXO, E NÃO ABRINDO UMA NOVA ABA COM OS AMIGOS, QUERO QUE CARREGA NA MESMA ABA MESMO, NORMAL)

  • Humor





-> Com o fundo daquela cor cinza mesmo.

-> O avatar no lado esquerdo e na ponta.

-> Com os bordados:

-> Aquele negócio de cargo obviamente é o GRUPO.





Questão do designer


• Imagem da bolinha cinza (de quando está off): http://i.imgur.com/8A63BXr.png

• Imagem da bolinha de quando estiver ONLINE (a verde): http://i.imgur.com/EOjT8Wg.png

• Imagem da engrenagem perto do nome: http://i.imgur.com/yEzgXxC.png

• Imagem do sexo masculino: http://i.imgur.com/QLo7x1v.png (obviamente o tamanho é menor, tamanho 16x16)

• Imagem do sexo feminino: http://i.imgur.com/Npj5BGp.png

___________________________________________________

Imagens do menu interno, que aparece ao clicar na engrenagem:

Imagem do perfil: http://imgur.com/a/9QBVX.png

Todos os tópicos: http://imgur.com/a/kX04Q.png

Enviar mensagem: http://imgur.com/a/tjnjB.png

Imagem do cargo (mas é o grupo): http://imgur.com/a/Y6M6w.png





Colors


Cor do nome do usuário: #009d9d
Cor de fundo: #2f363f
Cor dos nome dos amigos: #009d9d
Cor da mensagem do humor: #d963a3
Cor das coisas brancas: #C2C2DA <<< Aqui tem um texto.

Obrigado. ^^
Acho que fui bastante detalhista, mas se tiver dúvidas só falar...

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/
  • 0

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Kyo Panda em Sab 19 Nov 2016 - 23:14

Dado a quantidade de trabalho necessário para alcançar tal aparência, não prometerei fidelidade ao pedido.

Se estiver de acordo com isso:

  • Em Painel de Controle :seta2: Usuários & Grupos :seta2: Usuários :seta2: Perfis :seta2: Aba: Opções gerais, certifique-se que a opção Ativar o perfil avançado esteja marcada em Não. Não há como alterarmos o HTML de perfis avançados, mas acredito que o seu já esteja marcado em Não.

  • Seguindo as orientações desse tópico, em Painel de Controle :seta2: Visualização :seta2: Templates :seta2: Perfil, passe-nos o conteúdo do profile_view_body.

  • Em Painel de controle :seta2: Visualização :seta2: Imagens e Cores :seta2: Cores :seta2: Folha de estilo CSS, passe-nos o conteúdo da caixa de texto.


---

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 2287
Pontos Ativos : 5209

http://ajuda.forumeiros.com

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Dom 20 Nov 2016 - 21:16

-> A opção NÃO já está marcada.
Spoiler:

profile_view_body:

Código:
<!-- BEGIN switch_user_logged_in -->
<p class="right rightside">{LAST_VISIT_DATE}</p>
<!-- END switch_user_logged_in -->
<p>{CURRENT_TIME}</p>

<h1 class="page-title">{L_VIEWING_PROFILE}</h1>
<div class="panel bg1">
   <div class="inner"><span class="corners-top"><span></span></span>

   <div class="column1">
      <div class="h3">{L_USER_PRESENCE}</div>
      <dl class="left-box details" style="width: 80%;">
         <dt>{L_AVATAR_IMG}</dt><dd>{AVATAR_IMG}</dd>
      </dl>
      <dl class="left-box details" style="width: 80%;">
         <dt>{L_RANK}:</dt><dd><strong>{POSTER_RANK}</strong></dd>
         <!-- BEGIN switch_show_status -->
         <dt>{L_STATUT}:</dt><dd><strong>{USER_ONLINE}</strong></dd>
         <!-- END switch_show_status -->
      </dl>
      <!-- BEGIN switch_allow_friendsfoes -->
      <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">
         <dt>{L_FRIENDS_AND_FOES}:</dt><dd><strong>{FRIENDSFOES}</strong></dd>
      </dl>
      <!-- END switch_allow_friendsfoes -->
      <!-- BEGIN switch_auth_user -->
      <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">
         <dt>{L_ADMINISTRATE_USER}:</dt><dd><strong>{ADMINISTRATE_USER}{BAN_USER}</strong></dd>
      </dl>
      <!-- END switch_auth_user -->
   </div>
   <div class="column2">
      <div class="h3">{L_PROFILE}</div>
      <!-- BEGIN profile_field -->
      <dl id="field_id{profile_field.ID}" class="left-box details" style="width: 80%;">
         <dt>{profile_field.LABEL}</dt> <dd>{profile_field.CONTENT}<!-- BEGIN profil_type_user_posts --> [{POST_PERCENT_STATS} / {POST_DAY_STATS}]
            <br /><span style="margin-left: 10px;"><a rel="nofollow" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS} :</a></span>
            <br /><span style="margin-left: 15px;">- <a rel="nofollow" href="/sta/{PUSERNAME}">{L_TOPICS}</a></span>
            <br /><span style="margin-left: 15px;">- <a rel="nofollow" href="/spa/{PUSERNAME}">{L_POSTS}</a></span><!-- END profil_type_user_posts --></dd>
      </dl>
      <!-- END profile_field -->
   </div>
   <div class="clear"></div>
   <span class="corners-bottom"><span></span></span></div>
</div>

<div class="panel bg2">
   <div class="inner"><span class="corners-top"><span></span></span>

   <div class="column1">
   <form action="{S_PROFILE_ACTION}" method="post" name="post">
      <div class="h3">{L_CONTACT} {USERNAME}</div>
      <!-- BEGIN contact_field -->
      <dl id="field_id{contact_field.ID}" class="left-box details" style="width: 80%;">
         <dt>{contact_field.LABEL}</dt> <dd>{contact_field.CONTENT}</dd>
      </dl>
      <!-- END contact_field -->

      <!-- BEGIN switch_admin_user_comment_active -->
      <dl class="details">
         <dt>{L_COMMENTS} :<br /><span class="italic">{L_MODS_AND_ADMINS}</span></dt>
         <dd><textarea class="inputbox" name="admin_user_comment_text" rows="8" cols="30">{ADMIN_USER_COMMENT}</textarea></dd>
      </dl>
      <fieldset class="submit-buttons">
         <input type="hidden" value="update_admin_user_comment" name="mode" />
         <input type="hidden" value="{USER_ID}" name="userid" />
         <input type="submit" class="button2" name="user_comment_maj" value="{L_UPDATE}" />
      </fieldset>
      <!-- END switch_admin_user_comment_active -->
   </form>
   </div>

   <div class="column2">
      <div class="h3">{L_STATS}</div>
      <dl class="left-box details" style="width: 80%;"><dt>{L_LAST_VISITED}:&nbsp;</dt> <dd>{LAST_VISIT_TIME}</dd></dl>
      <!-- BEGIN switch_dhow_mp -->
      <dl class="left-box details" style="width: 80%;"><dt>{L_PRIVATE_MSG}:&nbsp;</dt> <dd>{PRIVATE_MSG}</dd></dl>
      <!-- END switch_dhow_mp -->
   </div>

   <div class="clear"></div>
   <span class="corners-bottom"><span></span></span></div>
</div>

<!-- BEGIN switch_rpg -->
<h1 class="page-title">{L_VIEWING_RPG}</h1>
<div class="panel bg1">
   <div class="inner"><span class="corners-top"><span></span></span>

   <p style="text-align: center;">{RPG_IMAGE}</p>
   <hr />

   <!-- BEGIN rpg_fields_left -->
   <div class="column1">
      <dl class="details">
         <dt>{switch_rpg.rpg_fields_left.F_NAME} :</dt>
         <dd>{switch_rpg.rpg_fields_left.F_VALUE_NEW}</dd>
      </dl>
   </div>
   <!-- END rpg_fields_left -->

   <!-- BEGIN rpg_fields -->
   <div class="column2">
      <dl class="details">
         <dt>{switch_rpg.rpg_fields.F_NAME} :</dt>
         <dd>{switch_rpg.rpg_fields.F_VALUE_NEW}</dd>
      </dl>
   </div>
   <!-- END rpg_fields -->
   <div class="clear"></div>
   <fieldset class="submit-buttons">
      {U_ADMIN_RPG_NEW}
   </fieldset>
   <span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_rpg -->
<script src="{JS_DIR}jquery/json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
   $(document).ready(function(){
      $('[id^=field_id]').each(function(){
         if ( $(this).find('.field_editable').is('span, div') )
         {
            $(this).hover(function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
                  $(this).find('.ajax-profil_edit').attr({
                        alt: "{L_FIELD_EDIT_VALUE}",
                        title: "{L_FIELD_EDIT_VALUE}"
                     }).click(function(){
                     $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
                     $(this).prev().find('.ajax-profil_valid').attr({
                        alt: "{L_VALIDATE}",
                        title: "{L_VALIDATE}"
                     }).click(function(){
                        var content = new Array();
                        $(this).parent().find('[name]').each(function(){
                           var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                           if ( (type_special && $(this).is(':checked')) || !type_special )
                           {
                              content.push(new Array($(this).attr('name'), $(this).attr('value')));
                           }
                        });
                        var id_name = $(this).parents('[id^=field_id]').attr('id');
                        var id = id_name.substring(8, id_name.length);
                        $.post(
                           "{U_AJAX_PROFILE}",
                           {id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
                           function(data){
                              $.each(data, function(i, item){
                                 $('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                              });
                           },
                           "json"
                        );
                     });
                     $(this).remove();
                  });
               }
            },function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                  $(this).find('.ajax-profil_edit').remove();
               }
            });
         }
      });
   });
//]]>
</script>

Meu CSS:

Código:
div#page-footer .navbar {
  display: block !important;
  background: #3c3f41 !important;
}
.topic-actions  {
    float: left;
}
 
#main-content > .pagination {
    margin-top: 10px;
}
/** Pagination begin **/
#main-content > .pagination {
    display: block !important;
}
 
#main-content > .pagination ul {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
    height: 30px;
    line-height: 30px;
    color: #ccc;
}
 
#main-content > .pagination li {
    float: left;
    background-color: #2b2b2b;
}
 
#main-content > .pagination li:first-child,
#main-content > .pagination li:first-child a {
    border-radius: 3px 0 0 3px;
}
 
#main-content > .pagination li:last-child,
#main-content > .pagination li:last-child a {
    border-radius: 0 3px 3px 0;
}
 
#main-content > .pagination a {
    display: block;
    color: #fff;
    font-size: 12px;
    padding: 0 10px;
    background: rgb(68,68,68);
    background: -moz-linear-gradient(top,  rgba(68,68,68,1) 0%, rgba(34,34,34,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(68,68,68,1) 0%,rgba(34,34,34,1) 100%);
    background: linear-gradient(to bottom,  rgba(68,68,68,1) 0%,rgba(34,34,34,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 );
    border: 1px rgba(0, 0, 0, 0.1) solid;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.1);
}
 
#main-content > .pagination a:hover,
#main-content > .pagination a:focus {
    background: #222;
}
 
#main-content > .pagination .pagination-data {
    padding: 0 10px;
}
 
#main-content > .pagination .pagination-input input {
    margin: 0;
    padding: 0 5px;
    background: #2b2b2b;
    height: 30px;
    outline: none;
    border: 1px #666 solid;
    box-sizing: border-box;
    width: 60px;
    color: #ccc;
    vertical-align: top;
}
/** Pagination end */
body #fa_toolbar #fa_right .fa_separator {
    background: #e5e5e5!important;
    color: #525252;
    display: block!important;
    font-size: 12px!important;
    font-weight: 700!important;
    height: 30px!important;
    margin: 0!important;
    padding: 0!important;
    text-align: left!important;
    width: 100%!important;
}
body #fa_menulist li:nth-child(9)::before {
    content: "Outras Opções";
    margin-left: 5px;
}
body #fa_menulist li:nth-child(4)::before {
    content: "Conteúdo";
    margin-left: 5px;
}
body #fa_menulist li:nth-child(2)::before {
    color: rgb(82, 82, 82);
    content: " Configurações";
    display: block;
    font-size: 12px;
    font-weight: 700;
    height: 30px;
    width: 100%;
    background: rgb(229, 229, 229) !important;
    margin: 0px !important;
    padding: 0px !important;
}
 #fa_menulist li a[href*="admin"]:before {
    content: "\f013";
}
body #fa_menulist a:hover {
    background: #f0f0f0!important;
    color: #333!important;
}
body #fa_usermenu img {
    float: right!important;
    max-width: 55px!important;
}
body #fa_usermenu {
    border-radius: 5px;
    float: right;
    font-size: 10px!important;
    margin-left: 185px;
    margin-top: 35px;
    padding: 0!important;
    text-align: right!important;
}
#fa_usermenu {
    position: absolute;
    left: 0px;
    width: 120px;
    padding: 10px 20px 10px 10px;
    color: #333333;
    font-size: 12px;
    text-align: center;
}
#fa_menu:hover :visited, #fa_toolbar > #fa_right.notification > #fa_notifications {
    color: #333333;
    background-color: #FFFFFF;
}
body #fa_menulist a:link, body #fa_menulist a:visited {
    color: #333!important;
    display: block!important;
    font-family: 'Roboto Condensed', Arial!important;
    font-size: 14px;
    font-weight: 300;
}
#fa_menulist li a[href*="/sta"]:before {
    content: "\f02b";
}
#fa_menulist li a:before {
    color: #525252!important;
    font-family: FontAwesome;
    font-size: 14px;
    margin: 0 5px;
}
body #fa_menulist {
    background-color: #fff!important;
    margin-left: 150px!important;
    padding: 5px!important;
    width: 300px!important;
}
#fa_menulist{
left: 732.5px!important;
}
#fa_ranktitle {display:none!important;}
#fa_usermenu td {display:none!important;}
#fa_menulist li a[href*="/u"]:before {
    content: "\f007";
}
#fa_menulist li a[href*="preference"]:before {
    content: "\f013";
}
#fa_menulist li a[href*="/spa"]:before {
    content: "\f086";
}
#fa_menulist li a[href*="watchsearch"]:before {
    content: "\f1d8";
}
#fa_menulist li a[href*="inbox"]:before {
    content: "\f0e0";
}
#fa_menulist li a[href*="logout"]:before {
    content: "\f08b";
}
#main-content > p:nth-child(1) ,  ul.linklist , #picture_legend {display:none;}
/* button image */
.sceditor-button-mention div { background-image:url(https://i19.servimg.com/u/f19/18/21/60/73/scemen10.png) !important }
 
/* drop down input */
#fa-mention {
  background:url(https://i19.servimg.com/u/f19/18/21/60/73/scemen10.png) no-repeat 3px 50% #FFF;
  padding-left:22px;
}
form#search {display:none!important;}
#page-header .navbar ul.navlinks, #page-header .navbar {
margin-top: -15px !important;
}
/********************************
cepheus - Informações do membro no tópico em dropdown
*********************************/
.profile-icons {
  display: none;
}
.menu-contextuel {
  background-color: #2b2b2b;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 999;
  float: left;
  min-width: 270px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  list-style-type: none;
  display: none;
  border: 1px solid #ccc;
  border: 1px solid rgba(0,0,0,0.2);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  -moz-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
.liste-menu-contextuel>li>a:hover, .liste-menu-contextuel>li>a:focus {
  color: #fff;
  text-decoration: none;
  background-color: #0081c2;
  background-image: -moz-linear-gradient(top,#08c,#0077b3);
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#08c),to(#0077b3));
  background-image: -webkit-linear-gradient(top,#08c,#0077b3);
  background-image: -o-linear-gradient(top,#08c,#0077b3);
  background-image: linear-gradient(to bottom,#08c,#0077b3);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc',endColorstr='#ff0077b3',GradientType=0);
}
.menu-contextuel table tr:nth-child(odd) td, .menu-contextuel table tr:nth-child(odd) th {
  background-color: #2b2b2b;
}
.table-cadre td {
  vertical-align: top;
}
.liste-menu-contextuel {
  top: 100%;
  left: 0;
  min-width: 100px;
  padding: 2px 0;
  margin: 2px 0 0;
  list-style: none;
  float: left;
}
.nav-header {
  display: block;
  padding: 3px 15px;
  font-size: 11px;
  font-weight: bold;
  line-height: 20px;
  color: #999;
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
  text-transform: uppercase;
}
.liste-menu-contextuel>li>a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 20px;
  white-space: nowrap;
  color: #c2c2da!important;
}
.element-menu-contextuel {
  color: #c2c2da!important;
  cursor: pointer;
}
.liste-menu-contextuel img {
  vertical-align: middle;
}
.liste-menu-contextuel {
  list-style-type: none!important;
}
.liste-menu-contextuel>li.nav-header>a strong {
  color: #999!important;
}
.liste-menu-contextuel>li.nav-header>a {
  clear: none;
  display: inline!important;
  padding: 0!important;
  margin: 0!important;
  white-space: none;
  vertical-align: top;
  text-decoration: none;
}
.navbar {
        background: #2D3134!important;
        border: none!important;
        margin: -5px 0px 0!important;
}
a.mainmenu {
    background: url(https://i18.servimg.com/u/f18/18/45/41/65/nav10.png) repeat-x 0 45px;
    color: #FFF;
    display: inline-block;
    font-family: "Trebuchet MS", Arial, Verdana, Sans-serif;
    font-size: 13px;
    font-weight: 700;
    height: 45px;
    line-height: 45px;
    padding: 0 12px;
    transition: 250ms;
}
#page-header a.mainmenu.fa_navactif, #page-header a.mainmenu:hover {
    background-position: 0 40px;
}
#page-footer, div.navbar, div.navbar ul.linklist {
    display: block !important;
}
ul.navlinks {
    border-bottom: transparent!Important;
}
div.navbar {
height: 35px!important;
 
}
.row1, .row2 {
    border-bottom: 1px solid #050C0D;
    border-top: 1px solid #314E52;
}
ul.topiclist.topics .header {
  display: none!important;
}
 
.forumbg {
  background-color: transparent!important;
  background-image: none!important;
  border: 0px solid #2d555e!important;
}
 
ul.topiclist.topics li {
  margin-bottom: 10px;
  border-radius: 5px;
  border-bottom: 1px solid #050C0D;
  border-top: 1px solid #314E52;
}
#profile-advanced-add a, a.button1, a.button2, button.button2, input.button, input.button1, input.button2 {
    background: #006CCC;
    border: none;
    border-radius: 3px;
    color: #FFF!important;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: normal!important;
    margin: 2px;
    padding: 6px 9px!important;
    transition: 300ms;
}
input[type="button"], input[type="reset"], input[type="submit"]{
    background: #006CCC;
    border: none;
    border-radius: 3px;
    color: #FFF!important;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: normal!important;
    margin: 2px;
    padding: 6px 9px!important;
    transition: 300ms;
}
#divPub {
        display: none !important;
}
dl.codebox {
  background-color: #0E242D;
  border: 0px solid #C9D2D8;
  font-size: 1em;
  padding: 5px;
  border-radius: 8px;
}
 
dl.codebox dts {
  border-radius: 8px;
  padding: 5px;
  border-bottom: 0px solid #CCC;
}
 
dl.codebox dt {
  color: #fff;
  display: inline-block;
  background-color: #1C3C41;
  border-radius: 8px;
  padding: 5px;
  border-bottom: 0px solid #CCC;
}
hr {
    border-top: 1px solid #0e222b;
    border-bottom: 1px solid #2A4F58;
    height: 0px!important;
}
#search input[value="Buscar"] {
        background: url('http://i.imgur.com/zKewnXy.png') no-repeat white center !important;
        border: 1px solid white !important;
        font-size: 0px !important;
        height: 26px !important;
        width: 40px !important;
        -webkit-border-top-right-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-topright: 5px;
        -moz-border-radius-bottomright: 5px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
}
#search-box #keywords {
        color: grey !important;
        border: 1px solid silver !important;
        background: #2B2B2B!important;
        padding-left: 4px;
        height: 20px;
        font-size: 13px;
        width: 150px !important;
}
li > a.mainmenu[href="/faq"] { display : none; }
li > a.mainmenu[href="/groups"] { display : none; }
li > a.mainmenu[href="/memberlist"] { display : none; }
li > a.mainmenu[href="/register"] { display : none; }
li > a.mainmenu[href="/search"] { display : none; }
#info_open, #main-content p.rightside, #main-content div[style="height"] + p, #page-footer .navbar, .h3, .pagination, form[action="/viewforum"], topic-actions, ul.linklist, ul.ul-icons, .headerbar, .pathname-box, div.buttons a img[src="http://i.imgur.com/sNOnUxV.png"], div.postbody h2.topic-title, div.postbody p.author, div.postbody div.blank  {
    display: none!important;
}
div.postbody {width: 87%}
div.postprofile {width: 12%; height: 155px;}
div.postprofile dl dt a img {margin-top: 10px}
.row2, .row1 {border-radius: 10px; margin-bottom: 20px;}
div.postbody div.content.clearfix {margin-top: -20px;}
div.usercountpost {float: right} div.usercountpost:before {content: "#"}
#forum-search {display: none;}
a.topictitle {
color: #C2C2DA;
}

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Seg 21 Nov 2016 - 13:58

Correção: A versão do meu fórum é phpBB3

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/
  • 0

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Kyo Panda em Ter 22 Nov 2016 - 2:34

Vou passar uma lista do que não foi possível fazer:

  • Lista de amigos, pois o template do Forumeiros não oferece nenhuma variável para adicioná-la.

  • E-mail, pois não há variável para isso. Mas você pode criar um campo de perfil personalizado para isso, mas eu não aconselho, pois não é "saudável" expor o e-mail dos usuários.

  • A ordem dos quatro primeiros campos (Sexo, Mensagens, Data de Inscrição e Humor) não podem ser alteradas, pois são gerados automaticamente nessa ordem pelo template.

A ordem dos quatro primeiros itens pode até ser alterada por jQuery, mas isso passa um pouco dos limites da minha edição.

---

Se estiver de acordo com os itens acima, troque o profile_view_body por esse:

Código:
<div class="panel bg1 profile-custom">
    <div class="inner">
        <div class="profile-avatar-column">
            {AVATAR_IMG}
        </div>
        <div class="profile-information-column">
            <h1 class="profile-row profile-username">
                <a href="javascript:void(0);">
                    <img src="http://i.imgur.com/yEzgXxC.png" alt="Perfil de {PUSERNAME}" />
                </a> {PUSERNAME}
            </h1>
            <ul class="profile-menu">
                <li class="profile-menu-header">
                    {PUSERNAME} <span>PERFIL</span>
                </li>
                <li>
                    <a href="/u{USER_ID}">
                        <img src="http://i.imgur.com/Pr3tUCg.png" alt="Perfil" /> Perfil
                    </a>
                </li>
                <li>
                    <a href="/spa/{PUSERNAME}">
                        <img src="http://i.imgur.com/iGu3xps.png" alt="Últimos posts" /> Últimos posts
                    </a>
                </li>
                <li>
                    <a href="/privmsg?mode=post&u={USER_ID}">
                        <img src="http://i.imgur.com/Ll9tn1p.png" alt="Enviar mensagem" /> Enviar mensagem
                    </a>
                </li>
                <li>
                    <img src="http://i.imgur.com/UABC8KS.png" alt="Cargo" /> Cargo: {POSTER_RANK}
                </li>
            </ul>
            <!-- BEGIN profile_field -->
            <div data-id="{profile_field.ID}" class="profile-row profile-field">
                {profile_field.LABEL} {profile_field.CONTENT}
            </div>                   
            <!-- END profile_field -->
            <!-- BEGIN switch_dhow_mp -->
            <div class="profile-row profile-field profile-field-privmsg">
                {L_PRIVATE_MSG}: {PRIVATE_MSG}
            </div>
            <!-- END switch_dhow_mp -->
            <div class="profile-row profile-field profile-field-status profile-field-status-{USER_ONLINE}">{USER_ONLINE}</div>
        </div>
    </div>
</div>
<script type="text/javascript">
    /*global jQuery*/

    (function($) {
        'use strict';

        $('.profile-username a').on('click', function() {
            $('.profile-menu').toggleClass('profile-menu-open');
        });
    })(jQuery);
</script>

E adicione ao CSS:

Código:
/** BEGIN Custom Profile */

div.profile-custom {
  padding: 0;
  margin-bottom: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

div.profile-custom *,
div.profile-custom *:before,
div.profile-custom *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

div.profile-custom .inner {
  background-color: #2f363f;
  padding: 10px 0;
  border-radius: 10px;
}

div.profile-custom .profile-avatar-column {
  width: 120px;
  text-align: center;
  float: left;
}

div.profile-custom .profile-avatar-column img {
  max-width: 100px;
  border: 2px #070000 solid;
}

div.profile-custom .profile-information-column {
  margin-left: 120px;
}

div.profile-custom .profile-row {
  font-size: 12px;
  line-height: 1.5em;
  color: #c2c2da;
}

div.profile-custom .profile-username {
  border: none;
  margin: 0;
  color: #009d9d;
  font-size: 24px;
}

div.profile-custom .profile-username img {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

div.profile-custom .profile-field {
  display: none;
}

div.profile-custom .profile-field[data-id="-4"],
div.profile-custom .profile-field[data-id="-6"],
div.profile-custom .profile-field[data-id="-7"],
div.profile-custom .profile-field[data-id="-8"],
div.profile-custom .profile-field-status,
div.profile-custom .profile-field-privmsg {
  display: block;
}

div.profile-custom .profile-field span {
  color: inherit !important;
}

div.profile-custom .profile-field div {
  display: inline;
}

div.profile-custom .profile-field div.invisible {
  display: none;
}

div.profile-custom .profile-field[data-id="-8"] div {
  color: #d963a3;
  font-weight: 700;
}

div.profile-custom .profile-field-status {
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 15px;
}

div.profile-custom .profile-field-status-conectado {
  background-image: url(http://i.imgur.com/EOjT8Wg.png);
}

div.profile-custom .profile-field-status-Desconectado {
  background-image: url(http://i.imgur.com/8A63BXr.png);
}

div.profile-custom ul.profile-menu {
  position: absolute;
  padding: 10px 20px 0 !important;
  list-style: none !important;
  background: #2b2b2b;
  border-radius: 10px;
  color: #c2c2da;
  font-size: 12px;
  border: 1px #232323 solid;
  opacity: 0;
  visibility: hidden;
  transition: 250ms ease opacity;
}

div.profile-custom ul.profile-menu-open {
  opacity: 1;
  visibility: visible;
}

div.profile-custom ul.profile-menu a {
  color: inherit;
}

div.profile-custom ul.profile-menu img {
  vertical-align: middle;
}

div.profile-custom ul.profile-menu li {
  margin-bottom: 10px;
}

div.profile-custom li.profile-menu-header {
  position: relative;
  text-transform: uppercase;
}

div.profile-custom li.profile-menu-header span {
  position: absolute;
  right: 0;
}

/** END Custom Profile */

Resultado: http://ajuda-phpbb3.forumeiros.com/u1

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 2287
Pontos Ativos : 5209

http://ajuda.forumeiros.com

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Qua 23 Nov 2016 - 0:47

http://atelier262.forumeiros.com/u1

a cor que vc colocou nas bordinhas é diferente da do meu fórum :/

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Cream em Qua 23 Nov 2016 - 14:19

Olá,

A qual borda se refere? Você pode procurar no código referências à "border:" e modificar a cor para a desejada.

Até mais!

Cream
Principal contribuidor
Principal contribuidor

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

http://ajuda.forumeiros.com

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Qua 23 Nov 2016 - 15:24



Um pequeno detalhe mesmo ^^ amei, obrigado, eu realmente pensei que teria umas semanas de "UP" primeiro... HAHAHA! Thanks.

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Sex 25 Nov 2016 - 21:13

iup

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Dom 27 Nov 2016 - 15:44

UP

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/
  • 0

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Kyo Panda em Dom 27 Nov 2016 - 22:09

@Vinicius Reis escreveu:a cor que vc colocou nas bordinhas é diferente da do meu fórum :/

A qual cor se refere, a cor de fundo? Pois estou usando #2f363f, como orientado no tópico.

A imagem que passou como referência acima possuem setas que apontam para o espaçamento entre o perfil, o menu e o rodapé. Essa seriam as "bordas" que se refere?

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 2287
Pontos Ativos : 5209

http://ajuda.forumeiros.com

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Dom 27 Nov 2016 - 23:52

Não!

As bordas que eu me refiro, foi a tentativa de fazer com que o modelo fique em formato de bordas, e não de um quadrado.

Como pode ver aparentemente parece um quadrado no meu fórum!

Pois a cor que vc está usando para diferenciar o quadrado para borda é #1c3b40 e está um pouco quanto errada! A cor correta seria: #0e252e

Olha do que eu estou falando!

Spoiler:

Obrigado. :p

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/
  • 0

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Kyo Panda em Seg 28 Nov 2016 - 0:22

Oooowwww... Percebo.

Adicione ao CSS:

Código:
div.profile-custom {
  background: none;
}

div.profile-custom .inner {
  min-height: 120px;
}

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 2287
Pontos Ativos : 5209

http://ajuda.forumeiros.com

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Vinicius Reis em Seg 28 Nov 2016 - 0:26

Ae! Obrigadooo....

Vinicius Reis
Nível 9

Masculino
Inscrito dia : 22/04/2016
Mensagens : 193
Pontos Ativos : 569

http://atelier262.forumeiros.com/

Resolvido Re: Refazendo a área do perfil dos usuários

Mensagem por Kyo Panda em Seg 28 Nov 2016 - 0:28

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 2287
Pontos Ativos : 5209

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