Mudar estilo da lista dos membros

Detalhes da questão

Endereço do fórum: policiadse.forumeiros.com
Versão do fórum: Invision

Descrição

Bom, no modelo de meu fórum acabei não gostando do modelo que veio, sendo ele:

Print: http://prntscr.com/cbioi6

Andei observando em alguns fóruns e gostei mais do modelo deles, que no caso é em lista, assim:

Print: http://prntscr.com/cbinpk

- Lembrando que gostaria que a cor do meu fórum continuasse a mesma, aquela azul!

Me ajudem por favor!!!

Olá autor, poderia me fornecer o link do seu fórum por gentileza?

No mais, acesse:

Painel de Controle -> Visualização -> Templates -> Geral

E clique em do lado do template chamado: memberlist_body
E troque por esse código:

Código:

<ul id="navstrip" class="clearfix">
   <li class="begin"><a href="{U_INDEX}"><span>{L_INDEX}</span></a></li>
   {NAV_CAT_DESC}
   <li>{L_MEMBERLIST}</li>
</ul>

<!-- BEGIN switch_pagination -->
<div class="pagination">
   {PAGINATION}
</div>
<div class="clearfix"></div>
<br />
<!-- END switch_pagination -->

<form action="{S_MODE_ACTION}" method="get" class="ipbform">
   <div class="borderwrap memberlist">
      <div class="maintitle">
         <h3>{L_ORDER_OR_SELECT}</h3>
      </div>
      <fieldset>
         <legend>{L_USER_SELECT}</legend>
         <dl>
            <dt></dt>
            <dd><input type="text" class="inputbox" name="username" maxlength="25" size="20" value="{L_USER_SELECT_VALUE}" /></dd>
         </dl>
      </fieldset>
      <div class="formbuttonrow in-padding clearfix">
         <div class="centerer">
            <del>
               <dl class="search-filter">
                  <dt>{L_SELECT_SORT_METHOD}</dt>
                  <dd>{S_MODE_SELECT}</dd>
               </dl>
               <dl class="search-filter">
                  <dt>{L_ORDER}</dt>
                  <dd>{S_ORDER_SELECT}</dd>
               </dl>

               <dl class="search-filter">
                  <dt>&nbsp;</dt>
                  <dd>
                     {S_HIDDEN_SID}
                     <input type="submit" name="submit" value="{L_SUBMIT}" class="button" />
                  </dd>
               </dl>
            </del>
         </div>
      </div>
   </div>
</form>
<br />

<div class="borderwrap member-list">
   <div class="maintitle">
      <h3>{PAGE_TITLE}</h3>
   </div>
   <div class="box-content member-list clearfix">

   <!-- BEGIN memberrow -->
      <div class="member">
         <div class="member-header clearfix">
            
            <div class="popmenubutton-new-out popmenubutton">
               <a href="#" onclick="return togglePopUpMenu('pm{memberrow.ROW_NUMBER}');">
                  <span class="membername">{memberrow.USERNAME}</span>
               </a>

               <div class="mini-avatar">{memberrow.AVATAR_IMG}</div>
            </div>

            <div id="pm{memberrow.ROW_NUMBER}" class="popupmenu clearfix" style="display:none;">
               <div class="avatar">{memberrow.AVATAR_IMG}</div>
               <ul>
                  <li class="popupmenu-item">{memberrow.PROFILE_IMG}&nbsp;</li>
                  <li class="popupmenu-item">{memberrow.PM_IMG}&nbsp;</li>
                  <!-- BEGIN switch_user_email -->
                  <li class="popupmenu-item">{memberrow.EMAIL_IMG}&nbsp;</li>
                  <!-- END switch_user_email -->
                  <!-- BEGIN switch_user_website -->
                  <li class="popupmenu-item">{memberrow.WWW_IMG}&nbsp;</li>
                  <!-- END switch_user_website -->
                  <li class="popupmenu-item last">{memberrow.USER_POSTS_IMG}&nbsp;</li>
               </ul>
            </div>
         </div>
         <p>
            <span class="label">{L_VISITED}</span>: {memberrow.LASTVISIT}
            <br />
            <!-- BEGIN switch_th_group -->
            <span class="label">{L_GROUPS}</span>:
            <!-- END switch_th_group -->
            <!-- BEGIN switch_td_group -->
            {memberrow.GROUPS}<br />
            <!-- END switch_td_group -->
            <span class="label">{L_INTERESTS}</span>: {memberrow.INTERESTS}
            <br />
            <span class="label">{L_JOINED}</span>: {memberrow.JOINED}
            <br />
            <span class="label">{L_POSTS}</span>: {memberrow.POSTS}
            <br />
         </p>
      </div>
   <!-- END memberrow -->

   <!-- BEGIN switch_no_user -->
   {switch_no_user.L_NO_USER}
   <!-- END switch_no_user -->

   </div>
</div>

<!-- BEGIN switch_pagination -->
<div class="pagination">
   {PAGINATION}
</div>
<br />
<!-- END switch_pagination -->
<br />
<style>
  .member-list .popmenubutton .mini-avatar img {
    height: 38px;
    width: 38px;
}
  .member-list .popmenubutton .mini-avatar {
    background: url(http://2img.net/i/fa/invision/pp-blank-thumb-38px.png) no-repeat;
    background-color: #fff;
    border: 1px solid #222;
    display: block;
    float: right;
    height: 38px;
    margin: 5px;
    width: 38px;
}
  .member {
    background-color: #fff;
    border: 1px solid #979ba0;
    float: left;
    margin-bottom: 10px;
    margin-right: 10px;
    padding: 5px;
    width: 22%;
}
  div.borderwrap .member-list {
    background-color: #c4c4c4;
    border: none;
    padding: 5px;
}
  div.maintitle {
    background-color: #303b4a;
    background-image: url(http://2img.net/i/fa/empty.gif);
    background-repeat: repeat-x;
    color: #fff;
    padding: 8px 8px 8px 15px;
    vertical-align: middle;
    zoom: 1;
}
  .borderwrapm, div.borderwrap {
    background-color: #fff;
    border: 1px solid #c4c4c4;
    padding: 1px;
}
  .borderwrap.member-list {
    margin-bottom: 4em;
}
  .ipbform fieldset legend {
    color: #222;
    font-weight: 700;
    margin: 0;
    padding: 0 .5em;
}
  .ipbform fieldset {
    border: 1px solid #000;
    margin: .5em;
    padding: 0 1em 1em;
}
</style>

Depois clique em salvar. E consequentemente em que estará ao lado desse template clique em para validar.
Até mais.

http://policiadse.forumeiros.com/

Esse é meu fórum!

Não conseguir, mudou a cor, e eu quero mudar o mode de CAIXA para lista...

Autor, é proibido mensagens consecutivas em menos de 24 horas.

Parece que ordenei errado as imagens...

Troque seu template por este memberlist_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 solo">{PAGE_TITLE}</h1>

<form action="{S_MODE_ACTION}" method="get">
<div class="panel">
   <div class="inner"><span class="corners-top"><span></span></span>
   <h2 class="h3">{L_ORDER_OR_SELECT}</h2>
   <p style="text-align:right; margin: 0; padding: 0;">
      {L_USER_SELECT}&nbsp;<input type="text" class="inputbox tiny" name="username" maxlength="25" size="20" value="{L_USER_SELECT_VALUE}" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {L_SELECT_SORT_METHOD}&nbsp;{S_MODE_SELECT}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {L_ORDER}&nbsp;{S_ORDER_SELECT}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {S_HIDDEN_SID}
      <input class="button2" type="submit" name="submit" value="{L_SUBMIT}" />
   </p>
   <span class="corners-bottom"><span></span></span></div>
</div>
</form>

<div class="forumbg forumbg-table">
   <div class="inner"><span class="corners-top"><span></span></span>

   <table class="table1" cellspacing="1" id="memberlist">
   <thead>
   <tr>
      <th class="number">#</th>
      <th class="name">{L_AVATAR} - {L_USERNAME}</th>
      <!-- BEGIN switch_th_group -->
         <th class="group">{L_GROUPS}</th>
      <!-- END switch_th_group -->
      <th class="interests">{L_INTERESTS}</th>
      <th class="joined">{L_JOINED}</th>
      <th class="active">{L_VISITED}</th>
      <th class="posts">{L_POSTS}</th>
      <th class="pm">{L_PM}</th>
      <th class="website">{L_WEBSITE}</th>
   </tr>
   </thead>
   <tbody>
   <!-- BEGIN memberrow -->
   <tr class="{memberrow.ROW_CLASS}">
      <td>&nbsp;{memberrow.ROW_NUMBER}&nbsp;</td>
      <td class="avatar-mini"><a href="{memberrow.U_VIEWPROFILE}">{memberrow.AVATAR_IMG}&nbsp;{memberrow.USERNAME}</a></td>
      <!-- BEGIN switch_td_group -->
         <td>{memberrow.GROUPS}</td>
      <!-- END switch_td_group -->
      <td>{memberrow.INTERESTS}</td>
      <td>{memberrow.JOINED}</td>
      <td>{memberrow.LASTVISIT}</td>
      <td>{memberrow.POSTS}</td>
      <td>&nbsp;{memberrow.PM_IMG}&nbsp;</td>
      <td>&nbsp;{memberrow.WWW_IMG}&nbsp;</td>
   </tr>
   <!-- END memberrow -->
   <!-- BEGIN switch_no_user -->
   <tr class="row1">
      <td colspan="{switch_no_user.COLSPAN_NUMBER}">{switch_no_user.L_NO_USER}</td>
   </tr>
   <!-- END switch_no_user -->
   </tbody>
   </table>

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

<div class="pagination" style="float:none;">
   <!-- BEGIN switch_pagination -->
   {PAGINATION}<br /><br />
   <!-- END switch_pagination -->
</div>

<style>
  table.table1 thead th {
    color: #fff;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.3em;
    padding: 0 0 4px 3px;
    text-transform: uppercase;
}
  table.table1 .name {
    text-align: left;
}
  table.table1 .joined {
    text-align: left;
    width: 15%;
}
  table.table1 .active {
    text-align: left;
    width: 15%;
}
  table.table1 .posts {
    text-align: center!important;
    width: 7%;
}
  td.avatar-mini img {
    background-color: #fff;
    border: 1px solid #303b4a;
    height: 38px;
    vertical-align: middle;
    width: 38px;
}
 
</style>


Seria assim?
Até mais.

Gostaria que ficasse a barra na parte "Nome de usuário".

Assim: http://prntscr.com/cbj46y

Porém eu gostaria dessa faixa, da cor azul (#188E9E)

Troque novamente o código do seu template memberlist_body por este :

Código:

<!-- BEGIN switch_user_logged_in -->
<p class="right rightside">{LAST_VISIT_DATE}</p>
<!-- END switch_user_logged_in -->
 
<p>{CURRENT_TIME}</p>
 
<form action="{S_MODE_ACTION}" method="get">
<div class="panel">
  <div class="inner"><span class="corners-top"><span></span></span>
  <h2 class="h3">{L_ORDER_OR_SELECT}</h2>
  <p style="text-align:right; margin: 0; padding: 0;">
      {L_USER_SELECT}&nbsp;<input type="text" class="inputbox tiny" name="username" maxlength="25" size="20" value="{L_USER_SELECT_VALUE}" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {L_SELECT_SORT_METHOD}&nbsp;{S_MODE_SELECT}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {L_ORDER}&nbsp;{S_ORDER_SELECT}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      {S_HIDDEN_SID}
      <input class="button2" type="submit" name="submit" value="{L_SUBMIT}" />
  </p>
  <span class="corners-bottom"><span></span></span></div>
</div>
</form>
 
<div class="forumbg forumbg-table">
  <div class="inner"><span class="corners-top"><span></span></span>
 
  <table class="table1" cellspacing="1" id="memberlist">
  <thead>
  <tr>
      <th class="number">#</th>
      <th class="name">{L_AVATAR} - {L_USERNAME}</th>
      <!-- BEGIN switch_th_group -->
        <th class="group">{L_GROUPS}</th>
      <!-- END switch_th_group -->
      <th class="interests">{L_INTERESTS}</th>
      <th class="joined">{L_JOINED}</th>
      <th class="active">{L_VISITED}</th>
      <th class="posts">{L_POSTS}</th>
      <th class="pm">{L_PM}</th>
      <th class="website">{L_WEBSITE}</th>
  </tr>
  </thead>
  <tbody>
  <!-- BEGIN memberrow -->
  <tr class="{memberrow.ROW_CLASS}">
      <td>&nbsp;{memberrow.ROW_NUMBER}&nbsp;</td>
      <td class="avatar-mini"><a href="{memberrow.U_VIEWPROFILE}">{memberrow.AVATAR_IMG}&nbsp;{memberrow.USERNAME}</a></td>
      <!-- BEGIN switch_td_group -->
        <td>{memberrow.GROUPS}</td>
      <!-- END switch_td_group -->
      <td>{memberrow.INTERESTS}</td>
      <td>{memberrow.JOINED}</td>
      <td>{memberrow.LASTVISIT}</td>
      <td>{memberrow.POSTS}</td>
      <td>&nbsp;{memberrow.PM_IMG}&nbsp;</td>
      <td>&nbsp;{memberrow.WWW_IMG}&nbsp;</td>
  </tr>
  <!-- END memberrow -->
  <!-- BEGIN switch_no_user -->
  <tr class="row1">
      <td colspan="{switch_no_user.COLSPAN_NUMBER}">{switch_no_user.L_NO_USER}</td>
  </tr>
  <!-- END switch_no_user -->
  </tbody>
  </table>
 
  <span class="corners-bottom"><span></span></span></div>
</div>
 
<div class="pagination" style="float:none;">
  <!-- BEGIN switch_pagination -->
  {PAGINATION}<br /><br />
  <!-- END switch_pagination -->
</div>
 
<style>
  table.table1 thead th {
    color: #fff;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.3em;
    padding: 0 0 4px 3px;
    text-transform: uppercase;
}
  table.table1 .name {
    text-align: left;
}
  table.table1 .joined {
    text-align: left;
    width: 15%;
}
  #main-content > form > div > div > h2 {display:none;}
  table.table1 .active {
    text-align: left;
    width: 15%;
}
  table.table1 .posts {
    text-align: center!important;
    width: 7%;
}
  td.avatar-mini img {
    background-color: #fff;
    border: 1px solid #303b4a;
    height: 38px;
    vertical-align: middle;
    width: 38px;
}
  .forumbg {
    background-color: #188E9E;
    background-image: url();
    background-position: 0 0;
    background-repeat: repeat-x;
    border: 2px solid #979ba0;
    clear: both;
    margin-bottom: 4px;
    padding: 0 5px;
}
</style>

Seria Assim?
Até mais.

Obrigado, consegui!

Pode fechar o tópico.