Blog sobre desarrollo WordPress en Español Desarrollo WordPress en Español
imagen destacada

Establecer la primera imagen de un post como destacada

Cuando escribimos una entrada o página en WordPress, por defecto nos deja establecer una imagen destacada o thumbnail:

featured-image

Esta imagen destacada suele usarse por ejemplo para listados o para indicar en las etiquetas open graph qué imagen usar para compartir contenido en redes sociales.

En algunas ocasiones nos podemos olvidar de completar este campo, o puede que tengamos entradas tan antiguas que nos da pereza ahora revisar una por una e ir estableciendo la imagen destacada para cada una de ellas.

En este caso puede interesarnos recuperar la primera imagen del post en el caso de que no hayamos establecido imagen destacada, y que haga las funciones de la misma. Para esto utilizaremos la función get_children(). Esta función devuelve imágenes, revisiones o sub-páginas asociadas a un post.

Por ejemplo en el template category.php mostramos un listado de noticias. Preguntaremos si tiene imagen desatacada asociada, y en caso contrario buscaremos una imagen entre las asociadas al post:

<?php if (have_posts()) : while (have_posts()) : the_post();?> <article id="post-<?php the_ID();?>" <?php post_class();?>> <div class="entry-featured-image"> <?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'thumbnail', $args ); }else { $args = array( 'post_parent' => get_the_ID(), 'post_type' => 'attachment', 'numberposts' => 1, ); $featured_image = get_children( $args ); foreach ($featured_image as $key => $thumbnail) { echo wp_get_attachment_image( $thumbnail->ID, 'thumbnail' ); } }?> </div> <div class="entry-content"> <h2><a href="<?php echo get_permalink();?>"><?php echo get_the_title();?></a></h2> <p class="post-meta">publicado por <?php the_author_posts_link();?> en <?php echo get_the_category_list( ', ' );?> el <?php the_time('j');?> de <?php the_time('F');?> de <?php the_time('Y');?></p> <?php the_excerpt();?> </div><!-- entry-content --> </article> <?php endwhile; endif;?>

Con este código mostraremos en el listado una de las imágenes asociadas al post, pero no necesariamente será la primera en aparecer dentro del contenido. Si hemos subido varias imágenes al post lo que mostraremos por defecto será la primera imagen que se asoció al post. Podemos pasar el parámetro order dentro de $args con el valor ASC o DESC para mostrar la primera o última imagen respectivamente que se asoció al post.

Si lo que queremos es mostrar la primera imagen que aparece en el post, tendremos que tirar de expresiones regulares, buscando directamente en el contenido la etiqueta img:

<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'thumbnail', $args ); }else { preg_match('/<img.+src=[\'"]([ if (!empty($featured_image["0"])) { echo $featured_image["0"]; } }?>

Estos dos snippets lo que hacen es mostrar una imagen destacada sacada el contenido o de las imágenes asociadas a un post, pero si lo que realmente queremos es dejar los listados como los tenemos y hacer una función para que establezca una imagen destacada sacada de las imágenes asociadas al post, lo que tendremos que poner en nuestro functions.php es lo siguiente:

$myposts = get_posts(array('posts_per_page' => '-1' )); foreach($myposts as $post) : if (!has_post_thumbnail($post->ID)) { $args = array( 'post_parent' => $post->ID, 'post_type' => 'attachment', 'numberposts' => 1, ); $featured_image = get_children( $args ); if ($featured_image) { foreach ($featured_image as $key => $thumbnail) { set_post_thumbnail($post->ID, $key); } } } endforeach;

Este código bastaría con ejecutarlo una sola vez, ya que va a recorrer todos nuestros posts y les va a asignar una imagen destacada de entre las que tiene asociadas al post.

Puede que también te interese

Cómo permitir a un colaborador subir archivos en WordPress
Cómo permitir a un colaborador subir archivos en WordPress
Como sabéis, existen diferentes tipos de usuarios en WordPress: Administrador, Editor, Autor, Colaborador y Suscriptor: Cada uno de estos roles tiene permitidas una serie de…
De Font Awesome a SVG para mejorar el WPO
De Font Awesome a SVG para mejorar el WPO
Siempre me ha gustado Font Awesome, es una librería variada y versátil con la que puedes añadir iconos a botones sociales, campos de formularios, etiquetas,…
Cómo crear una página de error de acceso a base de datos personalizada
Cómo crear una página de error de acceso a base de datos personalizada
En alguna ocasión nos podemos encontrar con un error de acceso a la base de datos por diversos motivos, y en estos casos nos aparece…
Principios SOLID de la programación orientada a objetos
Principios SOLID de la programación orientada a objetos
SOLID es un acrónimo acuñado por Robert C.Martin para definir los cinco principios básicos de la programación orientada a objetos: Single responsibility, Open-closed, Liskov substitution,…