Contenido

La funcionalidad «post-image» de WordPress 2.9

17 Nov

+ 13

Una de las nuevas funcionalidades que nos encontraremos en WordPress 2.9 es el llamado post-image, que como ya hemos explicado previamente se trata de un sistema que nos permite asociar a un post una imagen y poder usarla en un theme.

Justin Tadlock muestra un completo artículo mostrando como hacer uso de esta funcionalidad.

1) Permitir la funcionalidad

Como vimos en el post de las nuevas funcionalidades de WordPress 2.9, el theme iba a coger algo de relevancia permitiendo activar/desactivar funcionalidades de WordPress desde el fichero functions.php.

Esta capacidad nos permitirá activar esta funcionalidad añadiendo un simple línea a nuestro theme:

add_theme_support( 'post-thumbnails' );

Esta línea, nos activará la funcionalidad de post-image en nuestro WordPress, permitiendo que podamos ver un box más en nuestra página de «Nueva Entrada».

wordpress-2.9-post-image
(Ver Imagen)

Allí podremos seleccionar una imagen que será asociada al post.

2) Usar la funcionalidad

Una vez asociada la imagen, ya solo nos queda hacer que nuestro theme muestre la imagen donde queramos. Para ello tenemos una serie de funciones que debemos conocer:

the_post_image($size)

Esta función nos permite mostrar la imagen en el punto en el que la llamamos, requiere estar incluida dentro del Loop para funcionar.

<?php while( have_posts() ) : the_post(); ?>
 <div>
 <h1><a href="<?php the_permalink() ?>"><?php the_title() ?></a></h1>
 <?php the_post_image() ?>
 <?php the_content() ?>
</div>
<?php endif; ?>

Podemos usarla con un parámetro para especificar el tamaño de la imagen que queremos mostrar:

  • thumbnail
  • medium
  • full

Todas hacen referencia a la configuración de imagenes del apartado Opciones > Media de nuestro panel de control.

has_post_image()

Para comprobar si un post tiene asociada una imagen deberemos usar has_post_image() que nos devolverá true o false.

<?php
	if ( has_post_image() )
		the_post_image( 'thumbnail' );
	else
		echo '<img src="default-image.png" alt="Example Image" title="Example" />';
?>

get_post_image_id()

Si necesitamos obtener el ID de la imagen podremos hacer uso de esta función que nos devolverá el ID.

$image_id = get_post_image_id();

get_the_post_image( $id, $size )

Si necesitamos obtener la imagen de un post fuera del Loop podemos acceder directamente a ella indicándole el ID del post y el tamaño de la imagen que necesitamos.

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

3) Filtros y actions

Además de las funciones que nos permiten trabajar cómodamente con la imágen asociada, tenemos una serie de filtros que nos permiten personalizar más aún la funcionalidad y obtener resultados de lo más dispares.

//Filters
 - post_image_size
 - post_image_html
// Actions
 - begin_fetch_post_image_html
 - end_fetch_post_image_html

Veamos un ejemplo de Justin nos muestra con el que podemos cambiar el HTML de salida de la imagen que vamos a mostrar.

add_filter( 'post_image_html', 'my_post_image_html', 10, 3 );
function my_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;

}

Se trata de una gran funcionalidad, que muchos desarrolladores de themes estarán deseando usar en sus creaciones.

  • Al fin le podremos decir adios a Timthumb y eso me alegra.

  • genial! apenas me pase a la 2.9 pruebo esto!
    gracias por compartirlo =)
    para cuando sale la nueva versión de wp?

  • Justo sale esto cuando ya había aprendido a usar Simple Post Thumbnails… jajaja. En fin, voy a probarlo.

    ¿Alguien sabe como sería el código para colocar miniaturas de un tamaño personalizado adicionales a thumbnail, medium y full?

    Para la estructura de un theme puede bastar estos tres tamaños pero a veces, especialmente cuando quieres añadir algunos widgets o lo que sea necesitas tamaños adicionales…

    Saludos.

  • Gente, por si les pasa como a mi, que la funcion no les funciona, es que en la version final parece que la gente de WP le cambio el nombre

    the_post_thumbnail()
    • @Hernan: Pero es simplemente un nombre para enmascarar la función que os pongo arriba en el post.

      
      post-thumbnail-template.php (Linea 48)
      /**
       * Display Post Thumbnail.
       * 
       * @since 2.9.0
       *
       * @param int $size Optional. Image size.  Defaults to 'post-thumbnail', which theme sets using set_post_thumbnail_size( $width, $height, $crop_flag );.
       * @param string|array $attr Optional. Query string or array of attributes.
       */
      function the_post_thumbnail( $size = 'post-thumbnail', $attr = '' ) {
      	echo get_the_post_thumbnail( NULL, $size, $attr );
      }
      
    • Bfff, yo llevo mucho tiempo con mi propio sistema basado en adjuntos y lo cierto es que era un poco coñazo: esas funciones siempre daban por culo -no eran muy flexibles- además de tener que gestionar el tipo de adjunto. Por otra parte… menos de código en nuestros themes, mejor.

      Habrá que probarlo, aunque me reservo el mío para las páginas o secciones ^^!

  • Vaya hombre con Facebook, encima respondí donde no era. Andrés, a ver si puedes borrar mi cuenta asociada, please 😉

    Bfff, yo llevo mucho tiempo con mi propio sistema basado en adjuntos y lo cierto es que era un poco coñazo: esas funciones siempre daban por culo -no eran muy flexibles- además de tener que gestionar el tipo de adjunto. Por otra parte… menos de código en nuestros themes, mejor.
    Habrá que probarlo, aunque me reservo el mío para las páginas o secciones ^^!

  • Hola, quiero añadir las miniaturas personalizadas en lugar de la opción First Image porque como sabéis si tengo un post sin imágenes me sale el link roto.
    Estoy usando la nueva opción de wordpress de Establecer Miniatura, pero no me aparece, veo que habláis de que hay que tocar algunas lineas de código (o eso me parece a mí), pero como no estoy seguro y no controlo mucho prefiero que me lo aclareis mejor.
    ¿Con la nueva opción no debería ser tan sencillo como establecer la imagen congiéndola de la biblioteca y ya está?
    Muchas gracias.

  • donde exactamente he de poner el código

    add_theme_support( ‘post-thumbnails’ );

  • @aNieto2k Hola. Yo tengo una duda como principiante en el mundo wordpress. Uso la versión 3.0.1 para mi web de wp y ahora ando intentando meter las miniaturas a las entradas.
    Veo que se pueden establecer las dimensiones que desee para dicha miniatura pero la duda que tengo es ¿deforma la imagen dicha miniatura? porque lo que viene a hacer ésto es que muestra un redimensionado de la imagen que se verá normal y al tamaño que tiene una vez se entre en dicho post.
    Por lo tanto, esas dimensiones que se predefinen,¿ muestran un área predeterminado o ajusta las dimensiones de la imagen a las de la miniatura dando lugar a una imagen deformada?
    Saludos y gracias

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.