Personalizar a estrutura e visualização dos Tópicos

boa noite à todos!
gostaria de implementar um 'code' em um parte do fórum, sendo ela a parte das 'Categorias dos Tópicos' e para isso, vou fazer um post com ilustrações junto do conteúdo, todas as informações que tenho a respeito do pedido:  (esse pedido se baseia no anterior, para visualizar o peido anterior clique aqui).

Onde viu: Fórum.
Meu Fórum: Fórum.
Versão: PunBB.

1º Categoria dos Tópicos:
atualmente, os tópicos se encontram assim:


no entanto, com base no pedido anterior, gostaria de que esse visual fosse editado para o seguinte:

esse pedido se baseia mais no pedido anterior do que de onde vi, no entanto vou explicar melhor, à baixo se encontra um ilustração da ideia do pedido, nela estará numerada as partes de alterações, veja:


1 o ícone 1 representa o ícone do tópico, que, igual ao pedido anterior, está desalinhado, está colado com a linha esquerda do fórum, nesse ponto, gostaria de que ele fosse justificada.

2 o ícone 2 diz respeito aos "ícones de mensagens", gostaria de que ele também fosse ajustado como o padrão do Fórum dos Fóruns.

3 o ícone 3 diz respeito a duas coisas, sendo elas: Título do Tópico e quem o criou, gostaria de quem ficasse igual na ilustração à cima, o título em cima e o autor em baixo, como mostra na ilustração.

4 o ícone 4 diz respeito as "respostas e as visualizações do tópico" ao qual gostaria que fosse implementado como na ilustração, cada um com um ícone da frente ( bem similar ao pedido anterior, porém aqui se trata de respostas e visualizações).
- Resposta (ícone).
- Visualização (ícone).

5 & 6 o ícone 5 & 6 diz respeito a uma linha vertical, a qual separa o última mensagem do conteúdo. é somente isso, adicionar essa linha ajustada ao lado de quem postou a última mensagem. (pode utilizar o mesmo padrão do que foi utilizado na edição das categorias do fórum).

é isso, a ideia do pedido se baseia nisso, desde já agradeço aqueles que se proporem a me ajudar, atenciosamente كوي!

E lá vamos nós!
Mande-me o Template topics_list_box.

Até mais.
Sennior

segue:

Código:

<!-- BEGIN topics_list_box -->
<!-- BEGIN row -->
<!-- BEGIN header_table -->
   <!-- BEGIN multi_selection -->
      <script type="text/javascript">
      function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
         var all_checked = true;
         for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
         if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
            all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
         }
         }
         document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
      }
      function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
         for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
         if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
            document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
         }
         }
      }
      </script>
   <!-- END multi_selection -->

   <div class="main-head">
      <!-- BEGIN multi_selection -->
      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
      <!-- END multi_selection -->
      <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
   </div>
   <div class="main-content">
   <table cellspacing="0" class="table">
      <thead>
         <tr>
            <th class="tcl">{L_TOPICS}</th>
            <th class="tc2">{topics_list_box.row.L_REPLIES}</th>
            <th class="tc3">{topics_list_box.row.L_VIEWS}</th>
            <th class="tcr">{topics_list_box.row.L_LASTPOST}</th>
         </tr>
      </thead>
      <tbody class="statused">
<!-- END header_table -->

<!-- BEGIN header_row -->
<strong>{topics_list_box.row.L_TITLE}</strong>
<!-- END header_row -->

<!-- BEGIN topic -->
   <!-- BEGIN table_sticky -->
      </tbody>
   </table>
   </div>

   <div class="main-head">
      <!-- BEGIN multi_selection -->
      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /   >
      <!-- END multi_selection -->
      <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
   </div>
   <div class="main-content">
   <table cellspacing="0" class="table">
      <thead>
         <tr>
            <th class="tcl">{L_TOPICS}</th>
            <th class="tc2">{topics_list_box.row.topic.table_sticky.L_REPLIES}</th>
            <th class="tc3">{topics_list_box.row.topic.table_sticky.L_VIEWS}</th>
            <th class="tcr">{topics_list_box.row.topic.table_sticky.L_LASTPOST}</th>
         </tr>
      </thead>
      <tbody class="statused">
   <!-- END table_sticky -->
      <tr>
         <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
            <span class="status">
               <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
            </span>
            <!-- BEGIN single_selection -->
            <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
            <!-- END single_selection -->
            {topics_list_box.row.ICON}&nbsp;
            {topics_list_box.row.NEWEST_POST_IMG}
            {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
            <span id="color_fixe">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;
            <h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
            {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;
            {topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}
            <!-- BEGIN switch_description -->
            <br />
            &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
            <!-- END switch_description -->
         </td>
         <td class="tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.REPLIES}</td>
         <td class="tc3 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.VIEWS}</td>
         <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                <!-- BEGIN avatar -->
                <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                <!-- END avatar -->

                {topics_list_box.row.LAST_POST_TIME} {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
            </td>
         <!-- BEGIN multi_selection -->
         <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
         <!-- END multi_selection -->
      </tr>
<!-- END topic -->
<!-- BEGIN no_topics -->
<tr>
   <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
</tr>
<!-- END no_topics -->

<!-- BEGIN bottom -->
      </tbody>
   </table>
   </div>
   <div class="main-foot clearfix">
      <!-- BEGIN multi_selection -->
      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
      <!-- END multi_selection -->
      <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
      <p class="options">
         <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
      </p>
   </div>
<!-- END bottom -->
<!-- BEGIN spacer --><br /><!-- END spacer -->
<!-- END row -->
<!-- END topics_list_box -->

Olá!

Troque o template por este:

Código:

    <style>
   span.status img {
    left: -7px !important;
}
td.tcl.tdtopics img {
    position: relative;
    left: -17px;
}
.autor {
    position: relative;
    top: -7px;
    left: 37px;
}
.pun table .tcl.tdtopics {
    width: unset !important;
}
.infotopic img {
    position: unset !important;
    vertical-align: top !important;
}
.infotopic {
    position: relative;
    left: 50px;
}
.table td.tcl.tdtopics {
    border-right: 1px solid #B9C4CD !important;
}
</style>
   <!-- BEGIN topics_list_box -->
    <!-- BEGIN row -->
    <!-- BEGIN header_table -->
      <!-- BEGIN multi_selection -->
          <script type="text/javascript">
          function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
            var all_checked = true;
            for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
            if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
            }
            }
            document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
          }
          function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
            for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
            if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
            }
            }
          }
          </script>
      <!-- END multi_selection -->

      <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
      </div>
      <div class="main-content">
      <table cellspacing="0" class="table">
          <thead>
            <tr>
                <th class="tcl">{L_TOPICS}</th>
                <th class="tc2">{topics_list_box.row.L_REPLIES}</th>
                <th class="tc3">{topics_list_box.row.L_VIEWS}</th>
                <th class="tcr">{topics_list_box.row.L_LASTPOST}</th>
            </tr>
          </thead>
          <tbody class="statused">
    <!-- END header_table -->

    <!-- BEGIN header_row -->
    <strong>{topics_list_box.row.L_TITLE}</strong>
    <!-- END header_row -->

    <!-- BEGIN topic -->
      <!-- BEGIN table_sticky -->
          </tbody>
      </table>
      </div>

      <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /  >
          <!-- END multi_selection -->
          <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
      </div>
      <div class="main-content">
      <table cellspacing="0" class="table">
          <tbody class="statused">
      <!-- END table_sticky -->
          <tr>
            <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                <span class="status">
                  <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                </span>
                <!-- BEGIN single_selection -->
                <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
                <!-- END single_selection -->
                {topics_list_box.row.ICON}&nbsp;
                {topics_list_box.row.NEWEST_POST_IMG}
                {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
                <span id="color_fixe">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;
                <h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
                {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;<br />
                <span class="autor">{topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}</span><br />
            <span class="infotopic"><img src="http://i59.tinypic.com/9vjls8.png"> Respostas: {topics_list_box.row.REPLIES} &nbsp;<img src="http://i62.tinypic.com/14ky2jt.gif"> Visualizações: {topics_list_box.row.VIEWS}</span>
                <!-- BEGIN switch_description -->
                <br />
                &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                <!-- END switch_description -->
            </td>
            <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                    <!-- BEGIN avatar -->
                    <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                    <!-- END avatar -->

                    {topics_list_box.row.LAST_POST_TIME} <br /> {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
                </td>
            <!-- BEGIN multi_selection -->
            <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
            <!-- END multi_selection -->
          </tr>
    <!-- END topic -->
    <!-- BEGIN no_topics -->
    <tr>
      <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
    </tr>
    <!-- END no_topics -->

    <!-- BEGIN bottom -->
          </tbody>
      </table>
      </div>
      <div class="main-foot clearfix">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
          <p class="options">
            <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
          </p>
      </div>
    <!-- END bottom -->
    <!-- BEGIN spacer --><br /><!-- END spacer -->
    <!-- END row -->
    <!-- END topics_list_box -->

Atenciosamente.

Olá Raffy, boa tarde!
o template que o senhor postou funcionou, no entanto algumas coisas não ficaram ajustadas, veja:


gostaria que ficasse as seguintes alterações:


1º ícone, diz respeito a estrutura do tópico e do autor, gostaria de que elas ficassem alinhadas, em baixo do titulo, pois na ilustração à cima algumas letras do autor pega no aviso global.

2º ícone, diz repeito as respostas, visualizações e descrição do tópico, gostaria de quem ficassem alinhadas também, da mesma forma dos demais itens à cima.

3º ícone, diz respeito a linha cinza, ela ainda exibe "tópicos, respostas, visto e última mensagem", gostaria de que fosse removido, para ficar padrão com as categorias do Fórum.

se tudo der certo, a visualização dos tópicos ficara assim:

1º ícone, só deixe como na ilustração à cima, com aquele espaço entre a linha esquerda.

2 & 3º ícones, podemos ver que eles estão alinhados e que a linha cinza à cima desapareceu (como a Categoria dos Fórum).

é somente isso, desde já, obrigado pela atenção e disposição! atenciosamente كوي!

Olá!

Peço desculpa, ignorei totalmente os anúncios.
Mas quanto aos tópicos está tudo bem?

Atenciosamente.

Raffy, funcionou em partes, no entanto, quando vou visualizar uma categoria que tem mais de um tópico a linha que os divide, some, ou não tem.
o campo que o senhor configurou para os ícones de visualização e mensagens (os ícones estão muito separados).
a linha cinza que contém "Tópicos, mensagens, visualizações e última mensagem" ainda estar a aparecer, no entanto, gostaria que esse pedido se baseasse no anterior, ao requisito da estrutura geral, Raffy por favor utilize, ou tente utilizar os mesmos padrões de estrutura do pedido anterior.
utilize as informações à cima também! obrigado pela atenção! até mais.

Olá!

O senhor está se referindo aos anúncios, certo?
Eu estou me referindo aos tópicos em si:



Deseja mais alguma alteração quanto aos tópicos? Se não, passaremos então para os anúncios.

Atenciosamente.

me desculpe pelo meu engano, estava vendo o tópico errado.
está na ideia! no entanto, aqui para min, eu visualizo assim:

se o senhor conseguir deixar assim:


pois aqui eu vejo o ícone de visualização em cima do 'número de visualização', e se possível, alinhe e deixe ajustado, e alinhado o autor com o título do tópico como mostrado na ilustração à cima.

me desculpe pelo engano, mas em relação aos tópicos é isso, e em relação aos anúncios, gostaria de que eles tenham essa mesma estrutura, obrigado pela disposição!

Olá!

Troque por este:

Código:

        <style>
      span.status img {
        left: -7px !important;
    }
    td.tcl.tdtopics img {
        position: relative;
        left: -17px;
    }
    .autor {
        position: relative;
        top: -7px;
        left: 37px;
    }
    .pun table .tcl.tdtopics {
        width: unset !important;
    }
    .infotopic img {
        position: unset !important;
        vertical-align: top !important;
    }
    .infotopic {
        position: relative;
        left: 50px;
    }
    .table td.tcl.tdtopics {
        border-right: 1px solid #B9C4CD !important;
    }
    </style>
      <!-- BEGIN topics_list_box -->
        <!-- BEGIN row -->
        <!-- BEGIN header_table -->
          <!-- BEGIN multi_selection -->
              <script type="text/javascript">
              function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
                var all_checked = true;
                for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
                if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                    all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
                }
                }
                document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
              }
              function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
                for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
                if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                    document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
                }
                }
              }
              </script>
          <!-- END multi_selection -->

          <div class="main-head">
              <!-- BEGIN multi_selection -->
              <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
              <!-- END multi_selection -->
              <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
          </div>
          <div class="main-content">
          <table cellspacing="0" class="table">
              <tbody class="statused">
        <!-- END header_table -->

        <!-- BEGIN header_row -->
        <strong>{topics_list_box.row.L_TITLE}</strong>
        <!-- END header_row -->

        <!-- BEGIN topic -->
          <!-- BEGIN table_sticky -->
              </tbody>
          </table>
          </div>

          <div class="main-head">
              <!-- BEGIN multi_selection -->
              <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /  >
              <!-- END multi_selection -->
              <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
          </div>
          <div class="main-content">
          <table cellspacing="0" class="table">
              <tbody class="statused">
          <!-- END table_sticky -->
              <tr>
                <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                    <span class="status">
                      <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                    </span>
                    <!-- BEGIN single_selection -->
                    <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
                    <!-- END single_selection -->
                    {topics_list_box.row.ICON}&nbsp;
                    {topics_list_box.row.NEWEST_POST_IMG}
                    {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
                    <span id="color_fixe">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;
                    <h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
                    {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;<br />
                    <span class="autor">{topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}</span><br />
                <span class="infotopic"><img src="http://i59.tinypic.com/9vjls8.png"> Respostas: {topics_list_box.row.REPLIES} &nbsp;&nbsp;&nbsp;<img src="http://i62.tinypic.com/14ky2jt.gif"> Visualizações: {topics_list_box.row.VIEWS}</span>
                    <!-- BEGIN switch_description -->
                    <br />
                    &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                    <!-- END switch_description -->
                </td>
                <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                        <!-- BEGIN avatar -->
                        <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                        <!-- END avatar -->

                        {topics_list_box.row.LAST_POST_TIME} <br /> {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
                    </td>
                <!-- BEGIN multi_selection -->
                <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
                <!-- END multi_selection -->
              </tr>
        <!-- END topic -->
        <!-- BEGIN no_topics -->
        <tr>
          <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
        </tr>
        <!-- END no_topics -->

        <!-- BEGIN bottom -->
              </tbody>
          </table>
          </div>
          <div class="main-foot clearfix">
              <!-- BEGIN multi_selection -->
              <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
              <!-- END multi_selection -->
              <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
              <p class="options">
                <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
              </p>
          </div>
        <!-- END bottom -->
        <!-- BEGIN spacer --><br /><!-- END spacer -->
        <!-- END row -->
        <!-- END topics_list_box -->

Atenciosamente.

Olá Raffy!
está ficando bom, no entanto observado os tópicos, você poderia adicionar uma linha para dividir os Tópicos, e deixar um espaço uniforme dentre os Ícones de Visualização e Mensagem como mostra na ilustração à baixo.

como podemos ver, o Tópico Skin's foi editado para o senhor ver como gostaria que ficasse, os demais tópicos ilustrados a cima estão oficialmente assim, estruturados, se o senhor conseguir adicionar a linha para dividir os tópicos, deixar os ícones de resposta e visualização como mostrado na ilustração à cima, junto da estrutura a qual está o autor e o título do tópico, eu ficaria muito grato!
desde já agradeço pelo trabalho Raffy! até mais كوي!

Olá!

Desde já agradeço por ilustrar o que deseja, isso realmente ajuda

Aqui está o novo código:

Código:

            <style>
          span.status img {
            left: -7px !important;
        }
        td.tcl.tdtopics img {
            position: relative;
            left: -17px;
        }
        .pun table .tcl.tdtopics {
            width: unset !important;
        }
        .infotopic img {
    vertical-align: top !important;
    left: 0px !important;
}
        .infotopic {
    position: relative;
    top: 5px;
}
.main-content .table .statused tr {
    border-bottom: 1px solid #B9C4CD;
}
.raffy {
    text-align: left;
    position: relative;
    top: -21px;
    right: -36px;
}
        .table td.tcl.tdtopics {
            border-right: 1px solid #B9C4CD !important;
        }
        </style>
          <!-- BEGIN topics_list_box -->
            <!-- BEGIN row -->
            <!-- BEGIN header_table -->
              <!-- BEGIN multi_selection -->
                  <script type="text/javascript">
                  function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
                    var all_checked = true;
                    for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
                    if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                        all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
                    }
                    }
                    document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
                  }
                  function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
                    for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
                    if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                        document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
                    }
                    }
                  }
                  </script>
              <!-- END multi_selection -->

              <div class="main-head">
                  <!-- BEGIN multi_selection -->
                  <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
                  <!-- END multi_selection -->
                  <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
              </div>
              <div class="main-content">
              <table cellspacing="0" class="table">
                  <tbody class="statused">
            <!-- END header_table -->

            <!-- BEGIN header_row -->
            <strong>{topics_list_box.row.L_TITLE}</strong>
            <!-- END header_row -->

            <!-- BEGIN topic -->
              <!-- BEGIN table_sticky -->
                  </tbody>
              </table>
              </div>

              <div class="main-head">
                  <!-- BEGIN multi_selection -->
                  <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /  >
                  <!-- END multi_selection -->
                  <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
              </div>
              <div class="main-content">
              <table cellspacing="0" class="table">
                  <tbody class="statused">
              <!-- END table_sticky -->
                  <tr>
                    <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                        <span class="status">
                          <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                        </span>
                        <!-- BEGIN single_selection -->
                        <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
                        <!-- END single_selection -->
                        {topics_list_box.row.ICON}&nbsp;
                        {topics_list_box.row.NEWEST_POST_IMG}
                        {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
                        <span id="color_fixe">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;
                        <div class="raffy"><h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
                        {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;<br />
                        <span class="autor">{topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}</span><br />
                        <span class="infotopic"><img src="http://i59.tinypic.com/9vjls8.png"> Respostas: {topics_list_box.row.REPLIES} &nbsp;&nbsp;&nbsp;<img src="http://i62.tinypic.com/14ky2jt.gif"> Visualizações: {topics_list_box.row.VIEWS}</span></div>
                        <!-- BEGIN switch_description -->
                        <br />
                        &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                        <!-- END switch_description -->
                    </td>
                    <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                            <!-- BEGIN avatar -->
                            <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                            <!-- END avatar -->

                            {topics_list_box.row.LAST_POST_TIME} <br /> {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
                        </td>
                    <!-- BEGIN multi_selection -->
                    <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
                    <!-- END multi_selection -->
                  </tr>
            <!-- END topic -->
            <!-- BEGIN no_topics -->
            <tr>
              <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
            </tr>
            <!-- END no_topics -->

            <!-- BEGIN bottom -->
                  </tbody>
              </table>
              </div>
              <div class="main-foot clearfix">
                  <!-- BEGIN multi_selection -->
                  <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
                  <!-- END multi_selection -->
                  <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
                  <p class="options">
                    <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
                  </p>
              </div>
            <!-- END bottom -->
            <!-- BEGIN spacer --><br /><!-- END spacer -->
            <!-- END row -->
            <!-- END topics_list_box -->

Atenciosamente.

muito obrigado Raffy, eu que agradeço por me auxiliar e ajudar neste requisito!
a questão dos tópicos está resolvida! no entanto, os anúncios, aviso e único estão com um probleminha, veja na ilustração abaixo como está:

não faço ideia de onde ele pode ser enquadrado, no entanto, pensei se o senhor poderia colocado na frente do autor do tópico, como na ilustração baixo;

é somente isso Raffy, pois as demais alterações já feitas estão como desejado! desde já agradeço pela atenção e pelo trabalho, obrigado!
até mais كوي!

Olá!

De nada, é o meu trabalho

Troque por este código:

Código:

                <style>
              span.status img {
                left: -7px !important;
            }
            td.tcl.tdtopics img {
                position: relative;
                left: -17px;
            }
            .pun table .tcl.tdtopics {
                width: unset !important;
            }
            .infotopic img {
        vertical-align: top !important;
        left: 0px !important;
    }
            .infotopic {
        position: relative;
        top: 5px;
    }
    .main-content .table .statused tr {
        border-bottom: 1px solid #B9C4CD;
    }
    .raffy {
        text-align: left;
        position: relative;
        top: -21px;
        right: -36px;
    }
            .table td.tcl.tdtopics {
                border-right: 1px solid #B9C4CD !important;
            }
            </style>
              <!-- BEGIN topics_list_box -->
                <!-- BEGIN row -->
                <!-- BEGIN header_table -->
                  <!-- BEGIN multi_selection -->
                      <script type="text/javascript">
                      function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
                        var all_checked = true;
                        for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
                        if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                            all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
                        }
                        }
                        document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
                      }
                      function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
                        for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
                        if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                            document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
                        }
                        }
                      }
                      </script>
                  <!-- END multi_selection -->

                  <div class="main-head">
                      <!-- BEGIN multi_selection -->
                      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
                      <!-- END multi_selection -->
                      <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
                  </div>
                  <div class="main-content">
                  <table cellspacing="0" class="table">
                      <tbody class="statused">
                <!-- END header_table -->

                <!-- BEGIN header_row -->
                <strong>{topics_list_box.row.L_TITLE}</strong>
                <!-- END header_row -->

                <!-- BEGIN topic -->
                  <!-- BEGIN table_sticky -->
                      </tbody>
                  </table>
                  </div>

                  <div class="main-head">
                      <!-- BEGIN multi_selection -->
                      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /  >
                      <!-- END multi_selection -->
                      <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
                  </div>
                  <div class="main-content">
                  <table cellspacing="0" class="table">
                      <tbody class="statused">
                  <!-- END table_sticky -->
                      <tr>
                        <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                            <span class="status">
                              <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                            </span>
                            <!-- BEGIN single_selection -->
                            <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
                            <!-- END single_selection -->
                            {topics_list_box.row.ICON}&nbsp;
                            {topics_list_box.row.NEWEST_POST_IMG}
                            {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
                            <div class="raffy"><h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
                            {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;<br />
                            <span id="color_fixe">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;&nsbp;<span class="autor">{topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}</span><br />
                            <span class="infotopic"><img src="http://i59.tinypic.com/9vjls8.png"> Respostas: {topics_list_box.row.REPLIES} &nbsp;&nbsp;&nbsp;<img src="http://i62.tinypic.com/14ky2jt.gif"> Visualizações: {topics_list_box.row.VIEWS}</span></div>
                            <!-- BEGIN switch_description -->
                            <br />
                            &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                            <!-- END switch_description -->
                        </td>
                        <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                                <!-- BEGIN avatar -->
                                <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                                <!-- END avatar -->

                                {topics_list_box.row.LAST_POST_TIME} <br /> {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
                            </td>
                        <!-- BEGIN multi_selection -->
                        <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
                        <!-- END multi_selection -->
                      </tr>
                <!-- END topic -->
                <!-- BEGIN no_topics -->
                <tr>
                  <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
                </tr>
                <!-- END no_topics -->

                <!-- BEGIN bottom -->
                      </tbody>
                  </table>
                  </div>
                  <div class="main-foot clearfix">
                      <!-- BEGIN multi_selection -->
                      <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
                      <!-- END multi_selection -->
                      <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
                      <p class="options">
                        <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
                      </p>
                  </div>
                <!-- END bottom -->
                <!-- BEGIN spacer --><br /><!-- END spacer -->
                <!-- END row -->
                <!-- END topics_list_box -->

Atenciosamente.

muito obrigado Raffy! essa questão está resolvida!
obrigado por me ajudar, pela disposição e empenho, mais uma vez solucionou um code para min! obrigado!