Cuando construimos un home.php o un category.php en WordPress, nosotros podemos hacer llamadas al post extrayendo cierta información, en este caso hablaremos especialmente de las imágenes. Para la construcción de un home como el que SummArg tiene en este momento, necesitamos generar loops que extraigan imágenes y excerpts de las notas de ciertas categorías. Para esto tenemos varias técnicas disponibles dependiendo de nuestras necesidades.
Catch_that_image()
Esta función busca la primer imagen en una entrada y la muestra. En caso de no encontrar ninguna, nos muestra una imagen por default.
Functions.php
// Get URL of first image in a post
function catch_that_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=['"]([^'"]+)['"].*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0];
// no image found display default image instead
if(empty($first_img)){
$first_img = "/images/default.jpg";
}
return $first_img;
}
Código en nuestra plantilla:
<img src="<?php echo catch_that_image(); ?>" alt="<?php the_title(); ?>" />
Catch_that_image() II
Si no deseamos insertar una imagen en una entrada, pero queremos hacer uso de una imagen personalizada, en vez de la default.jpg anteriormente propuesta, podemos modificar el código de catch_that_image() para que, al no encontrar una imagen en la entrada, la busque en los custom fields, más específicamente en el campo thumbs.
// Obtener la URL de la primer imagen en el post
function catch_that_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=['"]([^'"]+)['"].*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0];
// si no encuentra una imagen, que busque en el custom field 'thumbs'
if(empty($first_img)){
$first_img = get_post_meta($post->ID, 'thumbs', $single = true);
}
return $first_img;
}
Catch_that_image() + timthumb
Si queremos usar este hack con el script timthumb de Tim McDaniels simplemente debemos utilizar el siguiente código en nuestra plantilla home u otros.
<img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo catch_that_image(); ?>&h=220&w=285&zc=1" alt="<?php the_title(); ?>" />
WP SmartImage de Darío Ferrer
Con este plugin, ideal para desarrolladores de themes, podemos trabajar extrayendo automáticamente las imágenes de las entradas. Éstas son las generadas por la propia plataforma en cuatro tamaños, de este modo nos aseguramos un manejo optimizado de las mismas, sin ralentizar la carga de nuestras páginas. Actualmente Darío ha llevado un paso más allá la herramienta permitiéndonos manejar variables de estilo con unos pocos clicks.
Al configurar las opciones del plugin, solo debemos ingresar en nuestras plantillas el código llamando a la función y veremos cómo la magia se hace sola.
Funciones de WP SmartImage y Uso -Descargar plugin del repositorio oficial
the_post_thumbnail()
A partir de WordPress 2.9, se nos brinda la opción de llamar a las miniaturas generadas por nuestra plataforma, tanto los tamaños por defecto, como asignados por nosotros. Para manejar los valores por defecto debemos ir a Opciones > Media.
Los parámetros.
<?php the_post_thumbnail( $size, $attr ); ?>
En donde $size corresponde al tamaño y $attr a los atributos que podemos aplicar.
Su uso
<?php the_post_thumbnail(); ?>
Y con las siguientes opciones indicamos diferentes tamaños.
the_post_thumbnail(); // Sin parámetros -> Miniatura
the_post_thumbnail('thumbnail'); // Miniatura
the_post_thumbnail('medium'); // Tamaño medio
the_post_thumbnail('large'); // Tamaño grande
the_post_thumbnail( array(100,100) ); // Otro tamaño.
Mas info en el Codex de WordPress o en Bocabit.
Creamos nuevo correo.
