Como usar o Thumbnail do WordPress 2.9

Escrito por Gustavo Bordoni em Desenvolvimento, Wordpress no dia 17 de novembro, 2009

Bom galera como vocês já devem saber o WordPress está chegando em sua versão 2.9, que irá trazer algumas funcionalidades que irão facilitar a vida dos desenvolvedores, dos usuários e visitantes.

Uma destas funcionalidades é a possibilidade de criar thumbnail[Miniatura] sem ter que fazer nenhum tipo de campo personalizado, facilitando para o seu cliente, que não tem prática com o sistema, para os desenvolvedores, só isso que realmente irá mudar.

Clique em "Set Thumbnail"

Clique em "Set Thumbnail"

Não são apenas miniaturas, a funcionalidade engloba 4 tipos de tamanhos, sendo assim fica bem melhor para que você possa fazer a coisa da melhor maneira possível. Sendo eles:

  • Miniatura ou em inglês ,Thumbnail
  • Tamanho médio
  • Grande
  • Completo, a imagem que você subiu

Mas tem uma maneira correta de se fazer isso, e é importante que todos já saibam antes do lançamento da versão para que tenhamos temas bem desenvolvidos.

Para começar você deve acessar o arquivo functions.php do seu tema, e adicionar o seguinte código:

add_theme_support( 'post-thumbnails' );

Bom esta nova função do WordPress, que possibilita o desenvolvedor ativar alguma funcionalidade do tema para seus usuários ou clientes. Não conheço nenhuma outro uso dela até agora, contudo provavelmente teremos algumas possibilidades no futuro.

No código iremos usar a função e ativa o suporte de Miniaturas nos artigos. Após feito a ativação precisamos saber como exibir no tema a imagem.

Da seguinte maneira iremos ter um resultado já com a tag da imagem em html pronta:

<?php the_post_image( 'thumbnail' ); ?>

Usando o código acima iremos ter como resultado a imagem miniatura, porém também podemos ter a imagem em diferentes tamanhos para diferentes usos.

<?php the_post_image( 'medium' ); ?>
<?php the_post_image( 'large' ); ?>
<?php the_post_image( 'full' ); ?>

O básico de como usar a função de exibição de miniaturas do WordPress 2.9 acaba aqui, agora vou explicar e dissecar mais algumas opções.

Como verificar se tem thumbnail ou não

Bom muitas vezes os usuários podem esquecer de colocar o thumbnail e teremos problemas com a função, então é mais interessante definirmos uma verificação para que não tenhamos problemas com isto.

Para fazer a verificação iremos usar a função has_post_image() que retorna true ou false quando tem imagem ou não.

Então faremos a verificação, e para ficar mais legal iremos definir uma imagem padrão para quando não houver imagem.

<?php
	if ( has_post_image() )
		the_post_image( 'thumbnail' );
	else
		echo '<img src="sem_thumbnail.jpg" alt="Este artigo não tem miniatura" title="Este artigo não tem miniatura" />';
?>

Retornar a URL da imagem

Bom galera normalmente os desenvolvedores precisam retornar apenas o link para poder usar em plugins e outras funções do próprio WordPress, para faze-lo é necessário a seguinte função:

$image = get_the_post_image( $post->ID, 'thumbnail' );

Mudando a saída HTML da função

Adicione o seguinte código no seu arquivo function.php, para podermos fazer uma mudança do HTML de saída da função:

add_filter( 'post_image_html', 'theme_post_image_html', 10, 3 );

function theme_post_image_html( $html, $post_id, $post_image_id );

	$html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';

	return $html;
}

Plugin para não perder as imagens do seu tema atual

Vários temas usam Custom Fields[Campos Personalizados] e outras formas de fazer miniaturas, porém imagine um blog com milhares de artigos e seria necessário definir as miniaturas dos artigos uma a uma, isso seria um inferno. Então temos um plugin para fazer isso, acesse o site do WordPress.org e baixe o plugin e seja feliz.

  • Ótimo post! Eu estava bem perdido em relação aos thumbnail!
    Uma Dúvida,estou usando o Plugin LinkWithin,só que em aparece algumas imagens que eu exclui e quando cliclamos dá pagina nao encontrada! Sei que o LinkWithin usa os Thumbnail…Tem como eu apagar os antigos?
    Obrigado!!Vc pode me mandar um email com a resposta ou um comentario em meu blog? Obrigado!!!

    Decodifique seus pensamentos abaixo