Thumbnail são imagens em miniaturas que ficam associadas a um post. Também é conhecida como Imagem em Destaque. Elas são muito importantes para ajudar a ilustrar os artigos do nossos blogs. Ensinarei a forma correta de utilizar este recurso e também como ela é definida pelo Painel de Administração do WordPress.
A primeira coisa que você deve saber é que o Tema é o responsável por mostrar essa Imagem em Destaque. Neste artigo será mostrado o passo a passo para implementar o Thumbnail em um template do WordPress, mesmo que ele não tenha suporte nativo para isso.
A primeira coisa que você deve fazer é ativar o Thumbnail. No functions.php do seu tema, adicione o seguinte código:
add_theme_support( 'post-thumbnails');Caso deseja ativar eles somente em determinados Post Type, basta fazer assim:
add_theme_support('post-thumbnails', array('post','page')); //Ativa o thumbnails nos Post Types 'post' e 'page'.
add_theme_support('post-thumbnails', array('produto')); //Ativa o thumbnails SOMENTE no Post Type 'produto'.
add_theme_support( 'post-thumbnails'); //Ativa o thumbnails em TODOS os Post TypesFeito isso, você poderá chamar os Thumbnails no seu tema usando o código:
<?php if(has_post_thumbnail( )): ?>
<?php the_post_thumbnail('thumbnail'); ?>
<?php endif; ?>Esse código deve ficar dentro do Loop do Post do WordPress. Normalmente, no arquivo index.php ou post-content.php.
Mostrar uma imagem caso o post não tenha Thumbnail definida
Por questões de estética é recomendável que possua uma espécie de "Thumbnail Default", para os casos em que não seja definida uma Thumbnail para um determinado post. Para fazer isso, basta usar o código abaixo:
<?php if(has_post_thumbnail( )): ?>
<?php the_post_thumbnail('thumbnail'); ?>
<?php else: ?>
<img alt="" src="<?php echo get_template_directory_uri() ?>/images/thumbnail-default.jpg" />
<?php endif; ?>Ele verica se há uma Thumbnail definida para o post, caso haja, ele a imprime, caso contrário, ele mostra uma imagem.
Como inserir um Thumbnail no Post do WordPress
Depois de ter adicionado o código que chama essas Imagens em Miniatura, você deve definir em cada Post qual imagem vai representá-lo.
Passos para escolher o Thumbnail (Ou Imagem em Destaque)
1. Na tela de edição do Post, clique em "Set featured image" (Selecionar Imagem em Destaque), no lado direto da tela.
2. Selecione uma imagem e clique em "Set featured image" (Selecionar Imagem em Destaque)
Alguma dúvida? Deixa suas dúvidas na seção de comentários abaixo.
