Se você deseja adicionar suporte à paginação ao seu tema WordPress com números legais em vez do post padrão seguinte e anterior, você pode fazê-lo usando o famoso plugin PageNavi , no entanto, prefiro adicionar paginação manualmente aos meus temas para que as pessoas não tem que ir à procura de um plugin. Também ajuda a manter o site mais rápido sem todos os scripts externos e CSS.
Felizmente, existe uma ótima função no wordpress chamada “ paginate_links ” que foi adicionada no WordPress 2.1 e permitirá que você crie uma navegação de estilo paginado para qualquer consulta em seu site. Aqui está um tutorial rápido para adicionar uma navegação de página simples ao seu tema que se parece com a paginação no meu Total WordPressTheme .
Paginação PHP
Simplesmente adicione o seguinte código no final do seu arquivo functions.php (ou qualquer arquivo em seu tema onde você deseja mantê-lo).
// Numbered Pagination
if ( !function_exists( ‘wpex_pagination’ ) ) {
function wpex_pagination() {
$prev_arrow = is_rtl() ? ‘→’ : ‘←’;
$next_arrow = is_rtl() ? ‘←’ : ‘→’;
global $wp_query;
$total = $wp_query->max_num_pages;
$big = 999999999; // need an unlikely integer
if( $total > 1 ) {
if( !$current_page = get_query_var(‘paged’) )
$current_page = 1;
if( get_option(‘permalink_structure’) ) {
$format = ‘page/%#%/’;
} else {
$format = ‘&paged=%#%’;
}
echo paginate_links(array(
‘base’ => str_replace( $big, ‘%#%’, esc_url( get_pagenum_link( $big ) ) ),
‘format’ => $format,
‘current’ => max( 1, get_query_var(‘paged’) ),
‘total’ => $total,
‘mid_size’ => 3,
‘type’ => ‘list’,
‘prev_text’ => $prev_arrow,
‘next_text’ => $next_arrow,
) );
}
}
}
CSS de paginação
Copie o CSS a seguir e cole em seu arquivo style.css.
ul.page-numbers {
list-style: none;
margin: 0;
}
.page-numbers:after {
content: “.”;
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
ul.page-numbers li {
display: block;
float: left;
margin: 0 4px 4px 0;
text-align: center;
}
.page-numbers a,
.page-numbers span {
line-height: 1.6em;
display: block;
padding: 0 6px;
height: 18px;
line-height: 18px;
font-size: 12px;
text-decoration: none;
font-weight: 400;
cursor: pointer;
border: 1px solid #ddd;
color: #888;
}
.page-numbers a span { padding: 0 }
.page-numbers a:hover,
.page-numbers.current,
.page-numbers.current:hover {
color: #000;
background: #f7f7f7;
text-decoration: none;
}
.page-numbers:hover { text-decoration: none }
Adicionando a função de paginação ao seu tema
Para chamar de volta a função de paginação é muito simples. Tudo o que você precisa fazer é adicionar o seguinte código aos seus arquivos de tema onde deseja mostrar qualquer tipo de paginação. Os mais comuns são index.php, home.php, category.php, tags.php, archive.php e search.php. Mas se você tiver algum modelo de página personalizado com suporte a paginação, adicione-o aqui.
Substitua a paginação padrão pelo seguinte (normalmente localizado em algum lugar após endif ):
<?php wpex_pagination(); ?>
Consultas personalizadas?
Se você estiver criando uma consulta personalizada usando WP_Query, esta função não funcionará a menos que você tenha definido sua consulta na variável $wp_query (o que é ruim, não faça isso). Para corrigi-lo, geralmente crio novas consultas como as seguintes:
$wpex_query = new WP_Query( $args );
Desta forma posso alterar a função de paginação principal para procurar a variável ao criar a paginação, exemplo (editar o primeiro trecho):
global $wp_query, $wpex_query;
if ( $wpex_query ) {
$total = $wpex_query->max_num_pages;
} else {
$total = $wp_query->max_num_pages;
}
Atualização : Neste exemplo eu verifico a variável global… No entanto, você pode simplesmente passar a variável de consulta diretamente para a função wpex_pagination, que provavelmente é uma escolha melhor
