Como usar o WP_Query para criar paginação no WordPress
Publicados: 2021-08-31
Uma das formas produtivas de aumentar as visualizações de página do seu site ter uma taxa de rejeição ideal é usar WP_Query para criar paginação no WordPress.
Neste tutorial, vamos orientá-lo através de um guia fácil de seguir para adicionar um loop WordPress personalizado com paginação.
O que é WP_Query?
WP_Query é uma das classes mais importantes do WordPress, pois é o que dá acesso a registros, posts, páginas e tipos de posts personalizados no banco de dados.
Enquanto isso, os desenvolvedores não precisam escrever consultas SQL complexas no banco de dados para receber as informações necessárias sobre postagens, páginas ou tipos de postagem personalizados, porque WP_Query fará tudo por nós.
O que é paginação no WordPress e por que você precisa dela?
A paginação é um dos principais recursos que qualquer usuário do WordPress pode usar para várias finalidades. É uma boa prática dividir postagens longas em várias partes e apresentar cada uma delas com uma nova página.
Se você estiver usando um tema WordPress bem codificado à sua disposição, com toda a probabilidade, usar uma tag em sua postagem adicionada exatamente onde você precisa que a postagem termine e comece na próxima página fará o trabalho para você.
Não é difícil adivinhar que posts longos levarão muito tempo para carregar e serão inconvenientes para os visitantes do site ou seguidores do blog lerem.
Dividir seu artigo ou descrições longas em quantas páginas parecer conveniente tornará mais fácil para os leitores digerir todas as informações sem se incomodar.
Se você é um webmaster do WordPress ou proprietário de um site WordPress, temos certeza de que conhece a funcionalidade de paginação integrada do WP que você pode usar facilmente com links ou paginação numérica para dividir postagens longas em quantas partes diferentes forem necessárias e exibi-las com páginas anteriores e seguintes adequadamente.
Além de tornar seus artigos e postagens mais fáceis de seguir e mais legíveis, a paginação também tem outros benefícios.
Isso tornará a aparência geral do seu site mais precisa e compacta, adicionará visualizações de página do seu site, ajudará a reduzir a taxa de rejeição, contribuirá para a classificação de SEO e fornecerá mais páginas para colocar anúncios e muito mais.
No entanto, esse método nem sempre funciona sem esforço com temas e modelos contemporâneos do WordPress. Portanto, oferecemos a você o uso do WP_Query para criar paginação no WordPress.
Antes de nos aprofundarmos no processo detalhando como usar WP_Query para criar paginação no WordPress, recomendamos que você se familiarize com a referência de classe WP Query no WordPress Codex: https://codex.wordpress.org/Class_Reference/WP_Query#Usage .
Agora, quando você tiver uma ideia geral sobre WP_Query e seus usos, vamos compartilhar um exemplo de consulta com você.
<?php
/**
* Nome do modelo: página personalizada
*/
get_header(); ?>
<?php
$paged = (get_query_var('paged')) ? get_query_var('paginado'): 1;
$args = array(
'posts_per_page' => 4,
'paginado' => $paged
);
$custom_query = new WP_Query( $args );
?>
<!----início-------->
<div class="wrap">
<div class="content-area">
<main class="site-main" role="main">
<?php
while($custom_query->have_posts()):
$custom_query->the_post();
?>
<div>
<ul>
<li>
<h3><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h3>
<div>
<ul>
<div><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a></div>
</ul>
<ul>
<p><?php echo the_content(); ?></p>
</ul>
</div>
<div>
</li>
</ul>
</div> <!-- fim das postagens do blog -->
<?php endwhile; ?>
<?php if (function_exists("paginação")) {
pagination($custom_query->max_num_pages);
} ?>
</main><!-- #main -->
</div><!-- #primary -->
</div><!-- .wrap -->
<!----fim-------->
<?php get_footer();
Como usar WP_Query para criar paginação no WordPress
Código para renderização de paginação
Crie um arquivo de modelo chamado CustomPage.php na pasta do tema e adicione o trecho de código mencionado abaixo em uma página estática personalizada.
<?php if (function_exists("paginação")) {
pagination($custom_query->max_num_pages);
} ?>
Vá para o painel de administração para criar uma página e escolha a página personalizada como modelo.
Além disso, você precisará usar o seguinte código para fazer a paginação personalizada funcionar: Você precisará adicionar este código em functions.php (que pode ser encontrado na pasta do seu tema).
função paginação($páginas = ”, $intervalo = 4)
{
$showitems = ($range * 2)+1;
global $paged;
if(vazio($paginado)) $paginado = 1;
if($páginas == '')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$páginas)
{
$páginas = 1;
}
}
if(1 != $páginas)
{
echo "<div class=\"pagination\"><span>Página ".$paged." de ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo “<a href='”.get_pagenum_link(1).”'>« Primeiro</a>”;
if($paged > 1 && $showitems < $pages) echo “<a href='”.get_pagenum_link($paged – 1).”'>‹ Anterior</a>”;
for ($i=1; $i <= $páginas; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ) )
{
echo ($ paginado == $i)? "<span class=\"current\">".$i."</span>":"<a href='".get_pagenum_link($i)."' class=\"inactive\" >".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Próximo ›</a> "; if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages) ."'>Último »</a>"; echo "</div>\n"; } }
Agora que conseguimos usar WP_Query para criar paginação no WordPress, vamos passar para a parte de estilo. Naturalmente, agora teremos que usar o arquivo style.css em vez de function.php.
Encontre style.css na pasta do tema e adicione o código abaixo.
/* Paginação */
.paginação {
limpar ambos;
posição: relativa;
tamanho da fonte: 11px; /* Tamanho do texto da paginação */
altura da linha: 13px;
flutuar: direita; /* Direção de flutuação de paginação */
}
.pagination span, .pagination a {
exibição: bloco;
flutuar: esquerda;
margem: 2px 2px 2px 0;
preenchimento: 6px 9px 5px 9px;
decoração de texto: nenhuma;
largura: automático;
cor:#ff; /* Cor do texto da paginação */
fundo: #555; /* Cor de fundo não ativa da paginação */
-transição do webkit: facilidade de entrada e saída de .15s em segundo plano;
-moz-transição: facilidade de entrada e saída de .15s em segundo plano;
-ms-transição: facilidade de entrada e saída de .15s em segundo plano;
-o-transição: facilidade de entrada e saída de .15s em segundo plano;
transição: facilidade de entrada e saída de .15s em segundo plano;
}
.paginação a:hover{
cor:#ff;
fundo: #6AAC70; /* Fundo de paginação ao passar o mouse */
}
.paginação .atual{
preenchimento: 6px 9px 5px 9px;
fundo: #6AAC70; /* Plano de fundo da página atual */
cor:#ff;
}
É isso. Nós realmente esperamos que nosso artigo o ajude a usar WP_Query para criar paginação no WordPress sem problemas. Em caso de qualquer dúvida sobre este tutorial ou códigos compartilhados nele, sinta-se à vontade para pedir nossa ajuda!
Quando você está configurando seu site no WordPress, uma das coisas que você pode querer considerar é usar wp_query para criar paginação no WordPress .
Claro, você deve se perguntar por que você deve se preocupar com a paginação, mas eis por que a paginação é um aspecto importante de qualquer site.
Paginação é o processo pelo qual você pode dividir um post longo em posts mais curtos, com seções do post original sendo postadas em outras páginas com um link para o post original.
Isso ajuda a aumentar as visualizações de página em seu site e pode ser inestimável quando se trata de SEO e classificações.
É por isso que você precisa usar wp_query para criar paginação no WordPress para que você possa personalizar a postagem, mantê-la mais curta e, no processo, ajudar a melhorar a experiência do usuário. Aqui estão algumas razões pelas quais a paginação é importante e por que é essencial para o seu site.
- Aparência limpa e nítida: como resultado da paginação, você deve conseguir manter suas postagens mais curtas e, no processo, deixar sua primeira página organizada. Isso deve permitir que você apresente aos seus clientes uma aparência limpa e nítida.
Além disso, com as postagens sendo aparadas mais curtas, você deve ser capaz de fazer uso total do espaço em branco estrategicamente e direcionar a atenção do usuário para as partes relevantes do seu site, talvez para um call to action para que ele possa clicar no mesmo.
- Marketing: Com a paginação, você deve conseguir reduzir o comprimento das postagens e otimizá-lo também no processo.
Com este plug-in, você pode decidir quais postagens deseja que sejam aparadas e até personalizar a postagem, para que pareça mais atraente para o usuário final.
Como resultado, seu tráfego deve aumentar e, no processo, você também poderá se envolver mais com seus usuários do que antes.
- Engajamento do usuário: Nenhum usuário quer ler um post longo logo na primeira página; por isso é essencial que você use a paginação para manter os posts curtos.
Os usuários apreciariam a aparência organizada, as páginas de carregamento rápido e, como resultado, você poderá se envolver mais com eles.
Com a paginação entrando em ação, você deve ser capaz de manter as taxas de rejeição em níveis ideais, manter seu público interessado o suficiente e, mais importante, aumentar as visualizações de página em seu site.
Como resultado, você aumentará seus rankings e aumentará sua taxa de conversão online.
Estas são algumas das razões pelas quais você precisa ter paginação em seu site, pois isso pode ajudar seu site a ter um desempenho ainda melhor do que antes.
Você pode decidir o quão curto deseja que as postagens sejam e, com a paginação, deve poder decidir o comprimento e até a aparência das postagens. Com esse recurso, você poderá oferecer aos usuários uma melhor experiência de usuário.