21
fev
2012
Paginação nos Posts sem Plugin
postado por Suzi ás 00:17

Muitas pessoas usam o Wp-Pagenavi que é um ótimo plugin WordPress que acrescentar paginação na sua página inicial. Mas existe também uma ótima maneira de aplicar essa paginação, e sem plugin!

Exemplo:

1º Passo. Procure pelo arquivo functions.php do seu tema atual, abra-o e acrescente o seguinte código:

function post_pagination($pages = '', $range = 4)
{
     $showitems = ($range * 2)+1;  

     global $paged;
     if(empty($paged)) $paged = 1;

     if($pages == '')
     {
         global $wp_query;
         $pages = $wp_query->max_num_pages;
         if(!$pages)
         {
             $pages = 1;
         }
     }   

     if(1 != $pages)
     {
         echo "<div class='paginacao'><span>P&aacute;ginas</span>";
         if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."' class='current'>&laquo;</a>";
         if($paged > 6 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>1</a> <span class='current'>...</span>";

         for ($i=1; $i <= $pages; $i++)
         {
             if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
             {
                 echo ($paged == $i)? "<span class='current'>".$i."</span>":"<a href='".get_pagenum_link($i)."' class='inactive' >".$i."</a>";
             }
         }

         if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<span class='current'>...</span> <a href='".get_pagenum_link($pages)."'>$pages</a>";
         if ($paged < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($paged + 1)."' class='current'>&raquo;</a>";
         echo "</div>\n";
     }
}

Na primeira linha, em $range = 4, mude o número para a quantidade de páginas que deseja que apareça na paginação.

Clique aqui caso não tenha o arquivo functions.php.
Já que você não tem o arquivo functions.php, vamos ter que criar um certo? Então abra seu bloco de notas e acrescente o código:

<?php
function post_pagination($pages = '', $range = 4)
{
     $showitems = ($range * 2)+1;  

     global $paged;
     if(empty($paged)) $paged = 1;

     if($pages == '')
     {
         global $wp_query;
         $pages = $wp_query->max_num_pages;
         if(!$pages)
         {
             $pages = 1;
         }
     }   

     if(1 != $pages)
     {
         echo "<div class='paginacao'><span>P&aacute;ginas</span>";
         if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."' class='current'>&laquo;</a>";
         if($paged > 6 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>1</a> <span class='current'>...</span>";

         for ($i=1; $i <= $pages; $i++)
         {
             if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
             {
                 echo ($paged == $i)? "<span class='current'>".$i."</span>":"<a href='".get_pagenum_link($i)."' class='inactive' >".$i."</a>";
             }
         }

         if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<span class='current'>...</span> <a href='".get_pagenum_link($pages)."'>$pages</a>";
         if ($paged < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($paged + 1)."' class='current'>&raquo;</a>";
         echo "</div>\n";
     }
}
?>

Salve como functions.php e envie para a pasta do seu tema.

2º Passo. Após salvar seu arquivo, vamos para o CSS. Em seu arquivo style.css, adicione:


.paginacao {
text-transform:uppercase; /* FONTE EM CAIXA ALTA */
font-weight:bold; /* FONTE EM NEGRITO */
font-size:14px; /* TAMANHO DA FONTE */
font-family: Tahoma;
text-align:center;
clear: both;
line-height:18px;
}
.paginacao span, .paginacao a {padding:5px;}
.paginacao a:link, #footlink a:visited, #footlink a:active {
color:#CCCCCC; /* COR DA FONTE */
background-color: #4b4a4a; /* COR DO PLANO DE FUNDO */
}
.paginacao a:hover {
color:#CCCCCC; /* COR DA FONTE */
background-color: #921f1f; /* COR DO PLANO DE FUNDO */
}

Modifique como quiser ;)
3º Passo. Em seguida, abra seu arquivo index.php e adicione o seguinte código após <?php endwhile; ?>

<?php post_pagination();?>
Tutorial criado pelo site kriesi.at e modificado pelo Madly Luv, em seguida fiz algumas modificações para o Cor Seletiva.

Posts Relacionados:

Fotos do Flickr no seu Site
Opacidade nas Imagens
Seleção Colorida
sites que disponibilizam patterns gratuitos
Transição em imagens com CSS3
224 Handwritten fonts para Download

Muitas pessoas usam o Wp-Pagenavi que é um ótimo plugin WordPress que acrescentar paginação na sua página inicial. Mas existe também uma ótima maneira de aplicar essa paginação, e sem plugin! Exemplo: 1º Passo. Procure pelo arquivo functions.php do seu tema atual, abra-o e acrescente o seguinte código: Na primeira linha, em $range = 4, [...]