Desde o lançamento do novo WordPress 2.9 que tenho vindo a trabalhar e a estudar a nova funcionalidade de Post Thumbnails e a procurar também formas de utilizá-la com eficiência em alguns dos templates que desenvolvo para os meus websites e blogs. Neste momento ainda não existe (infelizmente) documentação suficiente sobre o assunto, pelo que achei que seria interessante falarmos um pouco sobre isso aqui no blog e como utilizar essa nova funcionalidade a favor dos seus wordpress themes.

ACTIVANDO O POST THUMBNAILS NO SEU THEME

O desenvolvimento de wordpress themes difere imenso quando você desenvolve um tema para si próprio ou para um cliente, especialmente quando a compatibilidade tem de ser maximizada. Caso contrário você terá de lidar com clientes aborrecidos ou leitores que não conseguem usufruir das reais competências do seu theme. No ficheiro functions.php do seu theme, você pode activar a funcionalidade Post Thumbnails utilizando o seguinte código:

if (function_exists('add_theme_support')) {
	add_theme_support('post-thumbnails');
	set_post_thumbnail_size(120, 90, true);
}

Explicando um pouco o código de cima, a comunicado “if” verifica para ter a certeza de que o seu blog está a correr em WordPress 2.9 ou superior, verificando se a funcionalidade add_theme_support está presente. Os números definidos no set_post_thumbnail_size são a largura e altura da imagem. O “true” activa o corte (crop) automatizado por defeito. Isso significa que a sua imagem será cortada automaticamente tanto dos lados, como do topo ou da parte de baixo, para manter o rácio de aspecto e as dimensões requeridas no código. Fantástico não? Mas ainda há melhor…

TAMANHOS ADICIONAIS CUSTOMIZADOS

Você pode definir mais do que um tamanho para “thumbnail” se desejar, o que é perfeito quando você tem um template que puxa um thumbnail para a homepage e outro para dentro do artigo, por exemplo. Isto significa que você nunca mais terá de utilizar scripts de terceiros para fazer o redimensionamento automatizado das suas imagens. Você pode criar várias dimensões para thumbnails com relativa facilidade. Vejamos:

if (function_exists('add_theme_support')) {
	add_theme_support('post-thumbnails');
	set_post_thumbnail_size(120, 90, true);
	add_image_size('post-hero', 480, 250, true);
}

A única desvantagem que vimos nessa funcionalidade foi que ela não é retro-compatível com imagens anteriores, ou seja, todas as imagens antigas carregadas no seu blog não serão automatizadas a partir do momento em que colocar esse código no seu template. Somente as imagens que forem inseridas depois do código já lá estar.

APRESENTAR OS SEUS THUMBNAILS

Para mostrar o seu thumbnail, utilize simplesmente a seguinte linha de código no local onde deseja que a imagem apareça:

<?php the_post_thumbnail(); ?>

Se pretender chamar uma das suas imagens customizadas, poderá especificar o seu nome e puxá-la da seguinte forma:

<?php the_post_thumbnail('post-hero'); ?>

PROTEGER-SE À PROVA DE BALA

Esta é a parte em que as coisas se complicam um bocadinho. Especialmente se você estiver a integrar o Post Thumbnails a um template que já tinha consigo. Você terá de ter em consideração não só a versão do WordPress que está a utilizar, mas também se já existe um script de produção de thumbnails no template – deverá mantê-lo intacto para gerar as imagens antigas que tinha no seu blog.

E para terminar, se não existir uma imagem especificada através de Post Thumbnail, ou de um custom field (campo personalizado), poderá fazer uso de uma imagem estática e genérica no local. Veja:

<?php
	// If WordPress 2.9 or above and a Post Thumbnail has been specified
	if ((function_exists('has_post_thumbnail')) && (has_post_thumbnail())) {
		the_post_thumbnail('hero-thumbnail', array('alt' => ''.get_the_title().''));
	}
	// Or if a post image has been specified and dynamic image resizing via TimThumb is activate
	else if (get_post_meta($post->ID, 'post_image_value', true) && $mb_resize == 0) {
		$postimage = get_post_meta($post->ID, 'post_image_value', true);
		echo '<img src="'.get_bloginfo('template_url').'/thumb.php?src='.$postimage.'&amp;w=480&amp;h=250&amp;zc=1&amp;q=95" alt="'.get_the_title().'" />';
	}
	// Or if a post image has been specified and dynamic image resizing via TimThumb is disabled
	else if (get_post_meta($post->ID, 'post_image_value', true) && $mb_resize == 1) {
		$postimage = get_post_meta($post->ID, 'post_image_value', true);
		echo '<img src="'.$postimage.'" alt="'.get_the_title().'" />';
	}
	// Or if neither Post Thumbnail nor custom field post image have been specified
	else {
		echo '<img src="'.get_bloginfo('template_url').'/images/placeholder-hero.jpg" alt="'.get_the_title().'" />';
	}
?>

Eis um exemplo ainda mais simples, que procura por um Post Thumbnail e posteriormente por um custom field (campo personalizado) intitulado post_image_value. Se ele não encontrar nenhum de ambos, não irá colocar nenhuma imagem no local.

<?php
	// If WordPress 2.9 or above and a Post Thumbnail has been specified
	if ((function_exists('has_post_thumbnail')) && (has_post_thumbnail())) {
		the_post_thumbnail('hero-thumbnail', array('class' => 'post-thumbnail', 'alt' => ''.get_the_title().''));
	}
	// Or if a custom field post image has been specified
	else if (get_post_meta($post->ID, 'post_image_value', true)) {
		$postimage = get_post_meta($post->ID, 'post_image_value', true);
		echo '<img src="'.$postimage.'" alt="'.get_the_title().'" />';
	}
?>

EXPERIMENTE!

Pode parecer complexo ou confuso ao princípio, mas na verdade esses códigos têm o trabalho praticamente todo feito. Só terá de modificar atributos e variáveis, e terá o Post Thumbnails a trabalhar no seu template. Experimente!