Veja como no wordpress pode facilmente exibir uma lista artigos relacionados / postagens relacionadas / related posts, sem usar plugins…
Os artigos relacionados no WordPress são muito úteis para envolver o público do seu site. O WordPress oferece a capacidade de mostrar as artigos relacionadas de um tipo de categoria específica.
Exibir outros artigos que sejam relacionados com um artigo é muito fácil e pode faze-lo sem usar nenhum plug-in. Neste artigo, mostraremos como exibir facilmente uma lista de artigos relacionados na pagina de singular de seu artigo. Veja o exemplo aqui em nosso site.
Artigos relacionados no WordPress
Nós fornecemos o código e explicamos como o usar, mas você precisa saber como acessar seus arquivos de temas, o caminho padrão é: www.SEUSITE.com/wp-contant/themes/SEUTEMA/ (ler mais sobre o assunto).
Depois de encontrar a pasta de temas e acessar ao seu tema, pesquise single.php ou singular.php e crie um backup deles. Geralmente, é um desses arquivos o responsável por mostrar a página com o artigo completo. Abra o arquivo e coloque o código a seguir onde deseja exibir a lista de artigos relacionados. Esse código obterá artigos do mesmo tipo de categorias do artigo atual.
/**
* Related Posts for single post
*/
if ( is_single() ) {
global $post;
//get the categories of post
$categories = get_the_category( $post->ID );
if ( $categories ) {
$category_ids = array();
foreach( $categories as $individual_category ) $category_ids[] = $individual_category->term_id;
//query arguments
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'posts_per_page'=> 4, //number of related articles
'category__in' => $category_ids[0], //the first category
'post__not_in' => array($post->ID),
'ignore_sticky_posts' => 1,
'orderby' => 'rand'
);
//the query
$relatedPosts = new WP_Query( $args );
//loop through query
if( $relatedPosts->have_posts() ) {
//used stylesheet
echo '<style>.related-posts{}
.related-posts h2{}
.related-posts p{}
.card-grid{}
.card{}
.card:hover{}
@media(max-width:600px){.card-grid{}}</style>';
echo '<section class="related-posts">';
echo '<h2>Artigos relacionados</h2>';
echo '<p>Talvez você também goste de ler!</p>';
echo '<div class="card-grid">';
while( $my_query->have_posts() ) {
$my_query->the_post();
echo '<div class="card">';
echo '<a href="'.get_the_permalink().'">';
//if ( has_post_thumbnail() ) {
// the_post_thumbnail();
//}
echo get_the_title();
echo '</a>';
echo '</div>';
}
echo '</div>';
echo '</section>';
} else {
//no posts found
}
//restore original post data
wp_reset_postdata();
}
}OBS: Especifique o número de postagens relacionadas em posts_per_page que você deseja mostrar. Alem disso, para que a integração do código fique a 100%, poderá ter de adicionar algum código CSS. Pode também mostrar a imagem do artigo, basta para isso descomentar as três linhas referentes a “has_post_thumbnail()“.
Espero que tenham gostado deste tutorial! Se tiverem alguma dúvida ou sugestão para novos tutoriais, podem comentar na zona de comentários em baixo. obrigado por lerem o artigo e até à próxima!
Gostou deste artigo? Dê like e partilhe-o com seus amigos!