X

Paginação Sem Plugin

Snippets por IsItWP

Você está procurando uma maneira de criar paginação manual sem plugin? Embora provavelmente exista um plugin para isso, criamos um trecho de código rápido que você pode usar para criar uma navegação de paginação clássica e controlar a saída do seu conteúdo no WordPress.

Instruções:

Tudo o que você precisa fazer é adicionar este código ao arquivo functions.php do seu tema ou a um plugin específico do site:

function pagination($prev = '«', $next = '»') {
    global $wp_query, $wp_rewrite;
    $wp_query->query_vars['paged'] > 1 ? $current = $wp_query->query_vars['paged'] : $current = 1;
    $pagination = array(
        'base' => @add_query_arg('paged','%#%'),
        'format' => '',
        'total' => $wp_query->max_num_pages,
        'current' => $current,
        'prev_text' => __($prev),
        'next_text' => __($next),
        'type' => 'plain'
);
    if( $wp_rewrite->using_permalinks() )
        $pagination['base'] = user_trailingslashit( trailingslashit( remove_query_arg( 's', get_pagenum_link( 1 ) ) ) . 'page/%#%/', 'paged' );

    if( !empty($wp_query->query_vars['s']) )
        $pagination['add_args'] = array( 's' => get_query_var( 's' ) );

    echo paginate_links( $pagination );
};

Opcionalmente, use este código para o array $pagination para exibir um visual diferente:

$pagination = array(
  'base' => @add_query_arg('paged','%#%'),
  'format' => '',
  'total' => $wp_query->max_num_pages,
  'current' => $current,
  'prev_text' => __('« Previous'),
  'next_text' => __('Next »'),
  'end_size' => 1,
  'mid_size' => 2,
  'show_all' => true,
  'type' => 'list'
);

Em seguida, você pode adicionar a paginação usando a função pagination(). Você pode adicioná-la em algum lugar fora do loop, mas dentro da instrução if( have_post() ) do seu arquivo de template.

<?php if ( have_posts() ) : ?>
    <?php while ( have_posts() ) : the_post(); ?>
        // post goes here
    <?php endwhile; ?>

    <div class="pagination"><?php pagination('»', '«'); ?></div>

<?php endif; ?>

O WordPress também permite que você adicione classes CSS personalizadas que você pode usar para gerenciar a aparência da sua nova navegação. Veja este exemplo de CSS para descobrir como estilizar:

.page-numbers { font-size: 15px; }
.page-numbers.current { color: #222; }
.page-numbers .dots { letter-spacing: 1px }
a.page-numbers  { font-size: 14px; color: #3888ff; }

Observação: Se esta é a sua primeira vez adicionando snippets de código no WordPress, consulte nosso guia sobre como adicionar snippets de código corretamente no WordPress, para não quebrar acidentalmente seu site.

Se você gostou deste trecho de código, considere conferir nossos outros artigos no site, como: 43 melhores temas de fotografia para WordPress e como mudar facilmente do Squarespace para o WordPress.

Comentários   Deixe uma resposta

Adicionar um comentário

Ficamos felizes que você tenha escolhido deixar um comentário. Por favor, tenha em mente que todos os comentários são moderados de acordo com nossa política de privacidade, e todos os links são nofollow. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.

Checklist de Lançamento WordPress

O Checklist Definitivo para Lançamento de WordPress

Compilamos todos os itens essenciais da lista de verificação para o lançamento do seu próximo site WordPress em um e-book prático.
Sim, envie-me o eBook Gratuito!