Desenvolvimento - CMS

Como criar posts relacionados no WordPress sem plugin

Veja neste artigo como criar posts relacionados para o WordPress sem usar nenhum tipo de plugin.

por Rodrigo dos Messias



Posts relacionados no WordPress tem algumas funções muito úteis, tanto para seus leitores quanto para os motores de busca, pois a uma possibilidade maior de seus usuários se interessarem por algum conteúdo que tenha relação com o tema do post que ele esta lendo e continuar navegando no seu site, isso consequentemente diminuirá a taxa de rejeição e auxiliará nas suas táticas de SEO. A customização dos posts relacionados (related posts) é muito mais simples quando não usamos plugin, pois temos mais controle sobre o CSS tornando a personalização dos posts relacionados mais simples e prática, reduzindo a quantidade de plugins instalados você otimiza o carregamento do seu site, e para o Google cada milésimo de segundo conta.

Listagem 1: Posts relacionados sem imagem:

<?php
$randomPost = $wpdb->get_var(“SELECT guid FROM $wpdb->posts WHERE post_type = ‘post’ AND post_status = ‘publish’ ORDER BY rand() LIMIT 1″);
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
$args=array(
‘category__in’ => $category_ids,
‘post__not_in’ => array($post->ID),
‘showposts’=>3,
‘caller_get_posts’=>1
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ) {
echo ‘<div id=”postsrelacionados”>Estudos Similares<ul>’;
while ($my_query->have_posts()) {
$my_query->the_post();
?>
<li><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”<?php the_title_attribute(); ?>”><?php the_title(); ?></a></li>
<?php
}
echo ‘</ul>’;
echo ‘</div>’;
}
}
?>

Para personalizar a quantidade de posts relacionados que irá aparecer é só alterar o “’showposts’=>3” para a quantidade que desejar, também podemos personalizar ainda mais, colocando imagens e outros atrativos, então vamos montar um posts relacionados com imagem.

Listagem 2: Posts Relacionados com imagem:

<?php
$randomPost = $wpdb->get_var(“SELECT guid FROM $wpdb->posts WHERE post_type = ‘post’ AND post_status = ‘publish’ ORDER BY rand() LIMIT 1″);
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
$args=array(
‘category__in’ => $category_ids,
‘post__not_in’ => array($post->ID),
‘showposts’=>3,
‘caller_get_posts’=>1
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ) {
echo ‘<div id=”postsRelacionados”>Estudos Similares’;
while ($my_query->have_posts()) {
$my_query->the_post();
?>
<div class=”conteudoRelacionados”>
<div class=”fotoRelacionados”><a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”><?php if ( has_post_thumbnail() ) { the_post_thumbnail( ‘pequena’ ); } ?></a></div>
<div class=”tituloRelacionados”><a href=”<?php the_permalink() ?>” title=”<?php the_title_attribute(); ?>”><?php the_title(); ?></a></div>
<div class=”textoRelacionados”><?php echo excerpt(10); ?></div>
</div>
<?php
}
echo ‘</div>’;
}
}
?>

Instalamos um recurso personalizado de thumbnail que servirá para editar automaticamente o tamanho de sua foto, independente do tamanho original, ou seja, sua foto poderá ter 1000px por 1000px que o WordPress se encarrega de gerar um jpg no tamanho escolhido, note que na div “fotoRelacionados” eu utilizei uma chamada “the_post_thumbnail( ‘pequena’ )” e para que isso funcione adequadamente temos que inserir no functions.php de seu tema a seguinte linha de código

Listagem 3: Em seu arquivo functions.php insira:

add_image_size( ‘pequena’, 200, 150, true );

Inserindo está entrada, seus posts relacionados já estará pronto para o uso, note que temos a chamada para o nome “pequena” e o tamanho personalizado que é largura de 200px e altura de 150px, isso pode ser editado para o tamanho que for melhor para o seu blog.

Instalamos também um resumo com 10 palavras para seu visitante ter uma prévia do conteúdo de seu post, você poderá alterar a quantidade de palavras ou excluir este resumo caso necessário, para fazer isso é só alterar a div “textoRelacionado”, dentro dela temos a chamada da função “<?php echo excerpt(10); ?>” altere o numero 10 pela quantidade de palavras desejada.

Agora é só configurar seu CSS e pronto, seus posts relacionados estão personalizados, e sempre que você desejar poderá alterar a maneira como ele apresentado alterando a disposição das div’s ou modificando o css.

Caso você ache muito difícil configurar os posts relacionados manualmente, você poderá instalar um plugin, sugiro o Related Posts Thumbnails, sempre tomando cuidado com o tempo de carregamento da página e a quantidade de plugins instalados.

Duvidas ou perguntas é só deixar um comentário, obrigado e até a próxima.

Rodrigo dos Messias

Rodrigo dos Messias - É formado em publicidade e propaganda pela UBC, atua a 7 anos como webdesigner, programador, criativo e curioso. Atualmente trabalha na RPM produtora como analista SEO, entusiasta de SEO, SEM, Otimização de Conversão, WordPress e Magento. www.inspiredme.com.br