Staffer Group BR™

Fórum interativo totalmente gratuito!


 VisualizaçõesPermissão deste fórum:
Não podes responder a tópicos


CurtirDiretório deste fórum:
Fóruns » Principal »  » Tutoriais » Tutoriais sobre programação

#1
 Diskete

Diskete
Membro
 INFORMAÇÃO!
  Este tutorial funciona apenas na versão  PunBB  


- > Tutorial < -

- > Personalizar as novidades do portal < -

1º Passo

Para começarmos devemos acessar o Painel de Controle e ir no mod_news

Painel de Controle - > Visualização - > Templates - > Portal - > Mod_News

2º Passo

Selecione tudo que contém nele e substitu-a tudo por este:

Código:

    <!-- BEGIN post_row -->
    <!-- BEGIN saut -->
    <div style="height:2px"></div>
    <!-- END saut -->
    <div class="module main">
       <a name="news_{post_row.ID}"></a>

       <div class="module mod_news">
          <div class="main-head" style="text-align:{LEFT};">{post_row.TITLE}</div>
          <div class="main-content" style="padding:0;">
                      <p class="author"><span class="posteruser15">{BY} <strong>{post_row.POSTER}</strong></span> <span class="date"> em {post_row.TIME} </span></p>
             <div class="body">
                {post_row.TEXT}<br /><br />
                <!-- BEGIN switch_attachments -->
                <dl class="attachbox">
                   <dt>{post_row.switch_attachments.L_ATTACHMENTS}</dt>
                   <dd>
                      <!-- BEGIN switch_post_attachments -->
                      <dl class="file">
                         <dt>
                            <img src="{post_row.switch_attachments.switch_post_attachments.U_IMG}" />

                            <!-- BEGIN switch_dl_att -->
                            <a class="postlink" href="{post_row.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{post_row.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {post_row.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                            <!-- END switch_dl_att -->

                            <!-- BEGIN switch_no_dl_att -->
                            {post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                            <!-- END switch_no_dl_att -->
                         </dt>

                         <!-- BEGIN switch_no_comment -->
                         <dd>
                            <em>{post_row.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                         </dd>
                         <!-- END switch_no_comment -->

                         <!-- BEGIN switch_no_dl_att -->
                         <dd>
                            <em><strong>{post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                         </dd>
                         <!-- END switch_no_dl_att -->

                         <dd>({post_row.switch_attachments.switch_post_attachments.FILE_SIZE}) {post_row.switch_attachments.switch_post_attachments.NB_DL}</dd>
                      </dl>
                      <!-- END switch_post_attachments -->
                   </dd>
                </dl>
                <!-- END switch_attachments -->
                <div class="clear"></div>
                {post_row.OPEN}<a href="{post_row.U_READ_FULL}">{post_row.L_READ_FULL}</a>{post_row.CLOSE}
             </div>
             <p class="comments"><a class="leiamais" href="{post_row.U_VIEW_COMMENTS}">Leia Mais</a>
                              <a href="{post_row.U_VIEW_COMMENTS}">{L_COMMENTS}</a>: {post_row.REPLIES}</p>
          </div>
       </div>

    </div>
    <!-- END post_row -->

    <!-- BEGIN switch_image_resize -->
    <script type="text/JavaScript">
    //<![CDATA[
    $(resize_images({ 'selector' : '.mod_news', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
    //]]>
    </script>
    <!-- END switch_image_resize -->
    <style>
      .module p.comments a.leiamais {
    text-decoration: none !important;
    float: right;
    font-size: 11px;
    font-weight: bold;
    color: #363636;
    text-shadow: #FFC20B 1px 1px 0;
    width: 90px;
    line-height: 20px;
    text-indent: 20px;
    background: url("http://i.imgur.com/KzpxV.png") no-repeat 0 0;
    padding: 2px 10px 6px 5px;
    margin-top: -5px;
    }
    .module p.comments a.leiamais:hover {
    color: #424242;
    text-shadow: #FFD00E 1px 1px 0;
    background: url("http://i.imgur.com/KzpxV.png") no-repeat 0 -25px;
    }
    .module p.comments a {
    background: #F1ECE3 url("http://i.imgur.com/NDarn.png") no-repeat 0px -17px;
    height: 17px;
    color: #B83730;
    padding: 2px 0px 10px 22px;
    }
    .module p.comments {
    background-color: #F1ECE3;
    border-top: 2px solid #F05600;
    padding-top: 0.8em;
    font-size: 11px;
    }
    .posteruser15 {
    padding-left: 20px;
    background-image: url("http://i.imgur.com/kBmMA.png");
    background-repeat: no-repeat;
    margin-right: 10px;
    }
    .date {
    background-image: url(http://i.imgur.com/7Er99.png);
    background-position: left;
    background-repeat: no-repeat;
    padding-left: 20px;
    background-size: 15px 15px;
    padding: 10px 10px 10px 15px;
    }
    </style>

Salve e publique.

OBS: Vocês poderam editar a parte do CSS.

Visualização final:

Antes:

Depois:


Desenvolvido por Diskete | RolandoHM
Editado e Postado por 2012 © Staffer Group BR™

#2
 D'Leandro™

D'Leandro™
Fundador
Atenção: Quem é o criador do código?
Visualização Editada.

#3
 Diskete

Diskete
Membro
O criador é o RolandoHM, mas eu editei o código (traduzir ele para o pt-br e fiz uma pequena modificação no css, mudando apenas um nome da classe, nada mais).
Créditos a RolandoHM pelo código.

#4
 D'Leandro™

D'Leandro™
Fundador
Aceito: Movido para o local correspondente.

#5
 Jose Hamizaki

Jose Hamizaki
Membro
Muito bom, pena que funcione apenas na versão Punbb

#6
 Jose Hamizaki

Jose Hamizaki
Membro
@Gostei muito do código, ótima pedida.

#7
 Games DMG

Games DMG
Membro
Cara isso ficou da hora, vou testar em meu fórum!

#8
 Bookmarlucas654

Bookmarlucas654
Membro
Poxa vida, incrível o código, acho que vou começar a utilizá-lo '-' Vou testar
:cuti:

EDIT: Testado e aprovado, nota 1000!!!!!!!

#9
 » ƒαѕт ϟ

» ƒαѕт ϟ
Membro
Que lindo

#10
 ~[B]art

~[B]art
Membro
Lindo mesmo! Nem há oque falar!
Incrivel :muchwin:

#11
 sapinhu

sapinhu
Membro
Nem tenho o que dizer

#12
 'Fusion

'Fusion
Membro
Tem pra PHPBB3 ??

#13
 D'Leandro™

D'Leandro™
Fundador
Não, pois é nescessário edição de templates!
Mas é possivel fazer um pouco diferente, o senhor pode estar solicitando, na área de suporte!

#14
 'Fusion

'Fusion
Membro
Ok estarei analizando e verei se farei o pedido obrigado pela atenção.

#15
 Hades

Hades
Membro
Vou implantar no forum , muito obrigado !!

#16
 Master Publicitario

Master Publicitario
Membro
Olá,

Muito bom, vou testar obrigado!

#17
 » ƒαѕт ϟ

» ƒαѕт ϟ
Membro
Legal

#18
 xRunning

xRunning
Novato
Ótimo. Vou testar!!

#19
 GyGu

GyGu
Membro
Já procurava isto à muito tempo.
Obrigado

#20
 Master Publicitario

Master Publicitario
Membro
Muito bom!

#21
 Master Publicitario

Master Publicitario
Membro
Muito bom!

#22
 Conteúdo patrocinado