Madly Luv - O mLuv é um blog pessoal no qual aborda vários assuntos como design, músicas, literatura, arte, televisão etc. Desenvolvido e mantido por Ana Flávia Cador.

WP: Página de Arquivos Personalizada

Tutorial Wordpress

Uma página de arquivos (veja exemplo) é sempre bom quando você possui um blog com bastante conteúdo. São dezenas de posts e muitos caem no esquecimento e aquele post que você amou tanto escrever foi para o fundo do baú. Eu tive este problema. Por isso resolvi fazer o tutorial para ajudar quem está numa mesma situação que eu estive.

Crie uma página em PHP com o nome arquivos-blog.php (ou qualquer outros que você queria) com o conteúdo abaixo. Esta será a página que você terá dentro da pasta do seu Tema atual.

<?php
/*
Template Name: Arquivos do blog
*/
?>

<?php get_header(); ?>

  <section class="coluna-dos-posts">
   

                        <header>
                          <h1><?php the_title(''); ?></h1>
                        </header>

                        <article>
                            
                            <h2>&Uacute;ltimos 20 posts</h2>
                              <div class="lista-das-colunas">
                                    <ul>
                                      <?php $lastposts = get_posts('numberposts=20&offset=1');foreach($lastposts as $post) : setup_postdata($post);?>
                                        <li><a href="<?php bloginfo('home'); ?>/?p=<?php the_ID(); ?>" title="Em <?php the_time('d.m.y') ?>, por <?php the_author(); ?>"><?php the_title(''); ?></a></li>
                                      <?php endforeach; ?>
                                    </ul>
                              </div><!--fim lista-->


                            <h2>Por m&ecirc;s</h2>
                              <div class="lista-das-colunas">
                                <ul>
                                    <?php
                                      $args=array(
                                        'title_li' => __( '&nbsp;' ),
                                        'type' => 'monthly',
                                        //'limit' => 0,
                                      );
                                      wp_get_archives($args);
                                    ?>
                                </ul>
                              </div>


                            <h2>Por ano</h2>
                              <div class="lista-das-colunas">
                                <ul>
                                    <?php
                                      $args=array(
                                        'title_li' => __( '&nbsp;' ),
                                        'type' => 'yearly',
                                        //'limit' => 0,
                                      );
                                      wp_get_archives($args);
                                    ?>
                                </ul>
                              </div>



                            <h2>Por categoria</h2>
                              <div class="lista-das-colunas">
                                <ul>
                                    <?php wp_list_categories('title_li='); ?>
                                </ul>
                              </div>


                            <h2>Por tag</h2>
                            <?php wp_tag_cloud('smallest=8&largest=16&separator=, &order=ASC'); ?>


                        </article><!--fim artigo-->

    	
</section><!--fim col-posts-->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Ao contrário do tutorial antigo, não precisa-se fazer diversas alterações na programação do WordPress. Os códigos acima se comportam perfeitamente. Só basta colocar um CSS fofo para eles fiarem mais arrumadinhas e em duas colunas (ou três, você que escolhe).

/*lista sidebar*/
.lista-das-colunas ul {margin: 0; padding: 0; list-style: none;}
.lista-das-colunas ul li {margin: 0; padding: 1px 0; list-style: none;}
.lista-das-colunas ul li a {color: #8bbac2; font-style: italic; text-decoration: none; text-indent: 12px; -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out; float: left; width: 50%;}
.item-aside .area-util ul li a:hover, .item-aside .area-util div li a:hover, .lista-qualquer ul li a:hover {text-indent: 14px; color: #e9a5a0}

  /*impedindo que se sobrepoe*/
  .lista-das-colunas ul:before, .lista-qualquer ul:after {display: table; content: " ";}
  .lista-das-colunas ul:after {clear: both; margin-bottom: 20px;}

Para finalizar salve o arquivo dentro do seu tema atual. Mande por FTP na pasta do tema, vá no seu painel de controle, clique em "Pages" » "Add New", crie um nome para sua página e deixe o espaço do conteúdo da página em branco — o arquivo que você acabou de mandar irá fazer este papel. Em seguida, vá em Attributes que fica abaixo e em "Template", mude Default Template para Arquivos do Blog e sua página de arquivos já está prontinha e no ar. :D

Veja também...

Resenha: Protetor Solar Perfect Bright Milk, da Bioré
Além da Henna: Como ter reflexos dourados com Cassia Obovata
As ilustrações de Pauline (a.k.a. Punziella)

11 Comentário(s)

(11 pelo blog e pelo facebook)
  • Giulianna
    Visitar blog
    06 . 11 . 2014

    ATE QUE ENFIM JESUS
    eu achei um tutorial disso que me ajudou direito hahah não sei porque mas isso sempre foi super complicado de fazer pra mim x.x
    abençoada seja a aninha! haha

    Responder

  • Luanna
    Visitar blog
    13 . 06 . 2014

    Ana, o fundo da minha página ficou transparente. Você sabe por que? Obrigada!!

    Responder

    • Aninha
      Visitar blog
      14 . 06 . 2014

      @Luanna, perdoemos pela ultima resposta. Eu enfeito outra coisa kkkkk agora que fui ver ali no cantinho do painel de controle q vc perguntou sobre a página de arquivos, haha.

      Bom Lu, acho que vc deve ter esquecido a div. principal que engloba o seu blog. Vc precisa seguir a mesma lógica q vc fez no arquivo page.php e nas demais páginas de single.php, índex.php e etc.

      Caso não de certo, me envie por email (madly_luv@yahoo.com.br) um arquivo original de seu tema e o seu novo arquivo da página de arquivos q deu problema que posso te ajudar! :)

      Responder