Como Adicionar Posts Relacionados no WordPress Sem Plugins

Uma das grandes vantagens de usar WordPress são os plugins. plugins WordPress cobre quase qualquer coisa que você pode imaginar, a partir de expandir o seu blog em um CMS, a adição de características interessantes e otimizar seu blog para os motores de busca - as possibilidades são infinitas (e não vamos esquecer todos os temas diferentes lá fora).

Mas usando muitos plugins, você corre o risco de entupir seu blog WordPress, e na pior das hipóteses, você pode "quebrar" isso. Existem muitos exemplos de plugins que não são compatíveis uns com os outros, bem como plugins que retardam o seu blog.

Algumas das categorias de plugins do WordPress mais populares são baseados em torno de adicionar " posts relacionados "para um blog. Desde WordPress não tem nada padrão para isso, todos são obrigados a usar algum tipo de plugin para exibir posts relacionados em seu site.

Este artigo vai te ensinar como adicionar posts relacionados com miniaturas para seu blog sem plugins, mantendo tudo simples, leve e acessível. Vamos começar!

Leitura recomendada: Habilitando links permanentes no WordPress

Mas, Primeiro, Por Que Evitar Plugins?
Há uma série de razões pelas quais você deve sempre tentar usar WordPress 'construído em código e serviços, ao invés de um plugin. A principal vantagem é que você não tem que confiar em um terceiro (o desenvolvedor do plugin) para o seu blog funcionar. Há muitos casos de plugins populares que estão sendo abandonadas pelos seus desenvolvedores, deixando inúmeros proprietários do site presos com software desatualizado e potencialmente vulnerável.

Outra razão é que você não está correndo o risco de usar um plugin inchado que pode retardar seu site para um grind, ou pior ainda, conter um pedaço de código malicioso, embora isso seja raro, desde que você obter os plugins no diretório oficial do WordPress .

Primeiros Passos: Mensagens Relacionadas Com Miniaturas
Este recurso "posts relacionados", como a maioria dos outros, é projetado para ser colocado em sua página do artigo principal (single.php), mas você pode usá-lo em praticamente qualquer lugar, contanto que você mantê-lo dentro do loop do WordPress. A fim de obter os posts relacionados, vamos estar usando as marcas de Post que são dadas aos artigos individuais.

Miniaturas
WordPress agora possui um sistema de miniaturas built-in, o que vamos precisar aqui. , A fim de habilitá-lo, adicione este código ao seu arquivo functions.php na pasta tema (na maioria dos casos, já está lá).

1. add_theme_support (  "pós-thumbnails'  );  

Você também pode definir a largura e altura das miniaturas, adicionando outra linha para o código:

1. add_theme_support (  "pós-thumbnails'  );  
2. set_post_thumbnail_size (100, 50, true);  

Importante: Ao adicionar imagens para mensagens, a fim de criar uma miniatura, você tem que, no painel de upload da imagem, selecione "Usar imagem como destaque". Isto irá criar a miniatura do post.

O Código

1. <div class="relatedposts">  
2. <h3>Related posts</h3>  
3. <?php  
4.     $orig_post = $post;  
5.     global $post;  
6.     $tags = wp_get_post_tags($post->ID);  
7.       
8.     if ($tags) {  
9.     $tag_ids = array();  
10.     foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;  
11.     $args=array(  
12.     'tag__in' => $tag_ids,  
13.     'post__not_in' => array($post->ID),  
14.     'posts_per_page'=>4, // Number of related posts to display.  
15.     'caller_get_posts'=>1  
16.     );  
17.       
18.     $my_query = new wp_query( $args );  
19.   
20.     while( $my_query->have_posts() ) {  
21.     $my_query->the_post();  
22.     ?>  
23.       
24.     <div class="relatedthumb">  
25.         <a rel="external" href="<? the_permalink()?>"><?php the_post_thumbnail(array(150,100)); ?><br />  
26.         <?php the_title(); ?>  
27.         </a>  
28.     </div>  
29.       
30.     <? }  
31.     }  
32.     $post = $orig_post;  
33.     wp_reset_query();  
34.     ?>  
35. </div>  

A parte do código the_post_thumbnail (matriz (150,100) define o tamanho da miniatura que será exibido, neste caso, a largura 150 pixels, altura 100px.

O CSS
Temos duas classes divs aqui ". Relatedposts", que é o recipiente div global, e ". Relatedthumb", que é a miniatura individual e ligação dentro do. Relatedposts. Vamos supor que a largura do post é a 640px padrão. O CSS:

1. .relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}  
2. .relatedposts h3 {font-size: 20px; margin: 0 0 5px 0; }  
3. .relatedthumb {margin: 0 1px 0 1px; float: left; }  
4. .relatedthumb img {margin: 0 0 3px 0; padding: 0;}  
5. .relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px; width: 150px;}  
6. .relatedthumb a:hover {background-color: #ddd; color: #000;}  

O CSS acima tornará o post thumbnails com 150px de largura, o que significa que vamos precisar de 4 miniaturas para preencher a largura 640px do cargo (incluindo a margem entre eles). Você pode ajustar isso como quiser, se você quiser 5 miniaturas, você vai precisar de uma largura relatedthumb de cerca de 125px..

Importante: Certifique-se de definir a largura das miniaturas geradas em suas configurações de mídia do WordPress para coincidir com os definidos no CSS. Além disso, ele tem que coincidir com o tamanho especificado no código php: the_post_thumbnail (array (150,100) .
Veja mais dicas:
Como criar um blog com o WordPress (Tutorial)
Porque meu Site não Aparece no Google?