Se buscarmos no Google pelos termos post thumbnail, wordpress post thumbnail, post thumbnail wordpress,
entre outras variações possíveis, teremos milhares de resultados, o que demonstra
tamanha procura pelo assunto. Os resultados são soluções diversas para
implementar um simples recurso: vincular uma miniatura de imagem,
diga-se thumbnail, a um post.
Com a chegada do WordPress 2.9 ficou simples, fácil e elegante
vincular ao post desejado uma miniatura de imagem. Há quatro funções
específicas para o assunto: has_post_thumbnail, the_post_thumbnail, get_post_thumbnail_id e get_the_post_thumbnail. Elas estão localizadas no seguinte arquivo: wp-includes/post-thumbnail-template.php.
Suporte ao recurso de miniatura de post
Para implementar o suporte deste recurso no WordPress é necessário
que a função add_theme_support() com o parâmetro ‘post-thumbnails’ seja
chamada no arquivo functions.php do tema em uso. Para ser mais
específico, inclua o seguinte código:
<?php
if ( function_exists( 'add_theme_support' ) ) :
add_theme_support( 'post-thumbnails' );
endif;
?>
No arquivo functions.php do seu tema. Se ele ainda não existe, crie
e salve-o na pasta do tema. Observe que antes de chamarmos a função add_theme_support
verificamos se ela está disponível no WordPress em uso através da
função function_exists. Como a nova função está disponível somente a
partir da versão 2.9 garantimos compatibilidade com versões anteriores.
Chamado a função no arquivo functions.php do tema, teremos na tela de edição de posts o recurso Miniatura do Post como demonstrado na imagem abaixo.
Clicando em Configurar miniatura é exibida a tela de
envio de imagens. Após o envio da imagem, informe ao WordPress que
gostaria de usá-la como miniatura clicando em Usar como miniatura. Observe:
Feito isso, o recurso Miniatura do Post é preenchido com a imagem definida; além da opção remover a imagem. Veja:
Nas páginas do seu tema onde pretende exibir as miniaturas, faça uso das funções has_post_thumbnail e the_post_thumbnail. A primeira verifica se há uma miniatura para o post em exibição; a segunda exibirá a miniatura com a devida marcação HTML.
Embora tenho dito que há quatro funções para se trabalhar com esse assunto, duas delas são usadas internamente. São elas: get_post_thumbnail_id e get_the_post_thumbnail. A primeira é utilizada pela função has_post_thumbnail e a segunda pela função the_post_thumbnail. Então, digamos que há duas funções internas e outras duas externas.
Forma de uso da função the_post_thumbnail
<?php
if ( function_exists( 'the_post_thumbnail' ) ) :
the_post_thumbnail();
endif;
?>
No exemplo acima verificamos se a função the_post_thumbnail
está disponível para em seguida utilizá-la. Com seu uso será exibido
uma marcação HTML através da tag img para exibir a miniatura do post.
<img width="640" height="480" title="título" alt="" src="[...]/wp-content/uploads/2009/12/1262731176983.jpg"/>
Observe também um exemplo prático de uso da função has_post_thumbnail.
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail(); ?>
</a>
<?php endif; ?>
As possibilidades de uso da função the_post_thumbnail
Através de seus dois parâmetros opcionais, a função the_post_thumbnail lhe permite exibir miniaturas de posts de forma personalizada. Sendo possível definir o tamanho desejado e diversos atributos.
Quanto à definição de tamanho da miniatura do post há diversas
possibilidades. Utilizar os tamanhos definidos na configuração de mídia
de sua instalação WordPress ou especificar valores personalizados
the_post_thumbnail(); // Sem parâmetro é igual a Thumbnail
the_post_thumbnail( 'thumbnail' ); // Utiliza os valores definidos para o tamanho de imagem miniatura
the_post_thumbnail( 'medium' ); // Utiliza os valores definidos para o tamanho de imagem média
the_post_thumbnail( 'large' ); // Utilizar os valores definidos para o tamanho de imagem grande
the_post_thumbnail( array(150,110) );// Utiliza valores personalizados; neste exemplo 150 de largura e 110 de altura.
Os atributos possíveis de serem definidos e que serão utilizados na
marcação HTML da tag img são: src, class, alt e title. Para o primeiro
é utilizado a localização da imagem; para o segundo uma classe
personalizada com o tamanho da imagem, assim:
attachment-post-thumbnail, attachment-post-medium, entre outras. O
atributo alt é formado pela legenda da imagem e o title com o título.
Um exemplo prático de como definir atributos através da função the_post_thumbnail.
the_post_thumbnail( 'thumbnail', array( 'class' => 'nome-da-classe' ) );
Indo além com avançadas configurações
O WordPress é extremamente flexível e isso me agrada muito. Temos
incríveis possibilidades de personalização e com as miniaturas de posts
não seria diferente. No seu arquivo functions.php, que deve residir no
diretório do seu tema, é possível especificar o tamanho desejado para
as miniaturas, os thumbnails, através da função set_post_thumbnail_size. Assim:
set_post_thumbnail_size( 75, 75 ); // Define o tamanho desejado para os thumbnails.
set_post_thumbnail_size( 75, 75, true ); // Define o tamanho desejado para os thumbnails e ativa a opção de "crop"
É possível também registrar nomes personalizados para o tamanho de
imagens, ou seja, em vez de usar os nomes proprietários: thumb,
thumbnail, medium ou large, podemos definir nossos próprios nomes. Por
exemplo:
add_image_size( 'listagem-de-posts-home', 150, 150 );
add_image_size( 'listagem-de-posts-busca', 300, 300 );
add_image_size( 'post-em-destaque', 500, 500 );
Atente-se que a função add_image_size deve ser chamada no arquivo functions.php
A confusão de nomenclatura
Durante o desenvolvimento do WordPress 2.9, as funções relacionadas à
miniatura de post, thumbnail, foram nomeadas utilizando o termo image. Posteriormente na versão final as funções foram renomeadas sendo alterada o image por thumbnail.
Logo, o correto é the_post_thumbnail e has_post_thumbnail do que the_post_image ou has_post_image, respectivamente.
Como percebemos, as possibilidades em relação à miniatura de posts
são diversas, use a criatividade, pesquise e compartilhe novas
descobertas conosco.
*
Publicado originalmente no Apiki WordPress – Um blog da Apiki dedicado ao WordPress.