Como usar o thumbnail dos posts no WordPress

Desde a versão 2.9 do WordPress que é possível associar uma imagem para ser usada como imagem de destaque do post ou página.

Esta imagem apesar de se chamar de miniatura (Thumbnail) pode ter os mais diversos tamanhos tornando-se na imagem de destaque do post, pode ser utilizada no seu tamanho original ou reduzir à dimensão que precisarmos.

Para que consiga associar uma imagem de destaque tem de colocar no “functions.php” a seguinte linha:

add_theme_support( 'post-thumbnails' );

Depois de gravar a alteração irá aparecer na coluna à direita o link para adicionar.

Wordpress - Imagem de  destaque

Depois de escolhida a imagem fica como a imagem abaixo.

Wordpress - Imagem de  destaque

Exemplo 1
Neste exemplo vamos utilizar a função “the_post_thumbnail()” para inserir a imagem no post.
Esta função tem vários parametros:

the_post_thumbnail();            // sem parametros -> Thumbnail

the_post_thumbnail('thumbnail'); // Thumbnail ( 150px x 150px max)
the_post_thumbnail('medium');    // Resolução média ( 300px x 300px max)
the_post_thumbnail('large');     // Resolution alta ( 640px x 640px max)
the_post_thumbnail('full');      // Tamanho original 

the_post_thumbnail( array(100,100) );  // Outras  dimensões

A imagem pode ser utilizada directamente usando o seguinte código

<?php 
if ( has_post_thumbnail() ) { 
   /*  
   verificar se o post tem uma imagem associada,
   se tiver, retorna um link de imagem com o tamanho definido
   */
  the_post_thumbnail('medium');
} 
?>

Resultado



Exemplo 2
Recentemente trabalhei num tema em que tinha de mostrar no topo do tema a imagem associada à página ou post actual. O código seguinte nasce dessa necessidade.
Iremos usar só o endereço da imagem para o integrar noutro código.

<?php
if (is_single() || is_page()) { 
  $id_actual = $post->ID;
  if (has_post_thumbnail( $id_actual ) ) {
  $image = wp_get_attachment_image_src( get_post_thumbnail_id( $id_actual ), 'single-post-thumbnail' );
  $imagem = $image[0];  
  }
}
?>
<!-- testar - html -->
<a href="<?php echo $imagem; ?>"><img src="<?php echo $imagem; ?>" width="400px" /></a>

ID;
if (has_post_thumbnail( $id_actual ) ) {
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $id_actual ), ‘single-post-thumbnail’ );
$imagem = $image[0];
}
}
?>

Resultado


Deixe um comentário