Un muro de texto sin imágenes es una forma segura de perder lectores en los primeros cinco segundos. La imagen destacada funciona como la portada del artículo: es lo que la gente ve en el feed de publicaciones, los widgets y las vistas previas de redes sociales. Vende el clic antes de que alguien haya leído el titular.

El problema es que WordPress no obliga a los autores a establecer una miniatura. Una publicación destaca con una foto enorme, otra se reduce a un pequeño cuadrado, una tercera no tiene imagen alguna. La página de inicio se convierte en un caos visual, y Facebook y Telegram toman un logo aleatorio en lugar de una vista previa significativa.

A continuación, un desglose completo de la mecánica de la imagen destacada: desde añadir su primera miniatura hasta las comprobaciones obligatorias antes de publicar. Con código funcional, un plugin específico e instrucciones paso a paso.

💡 Resumen rápido:

• Añadir una imagen destacada a través de la barra lateral del editor
• Entender los tamaños: qué hace WordPress internamente y cómo reconfigurarlo
• Instalar Simple Image Sizes y ajustar las dimensiones para su tema
• Automatizar la configuración de miniaturas con código en functions.php
• Gestionar autores olvidadizos: sin imagen, la publicación pasa a borrador

Cómo funcionan las imágenes destacadas

La imagen destacada (o miniatura de la publicación) es un metadato que el tema utiliza para la salida en tres lugares clave:

• Página de inicio y archivos. Una vista previa con imagen obtiene exponencialmente más clics que un enlace de texto simple.
• La cabecera de la propia publicación. El tema muestra la miniatura encima o justo debajo del título, a menudo abarcando todo el ancho del contenido.
• Redes sociales. Facebook, X y Telegram extraen la imagen destacada mediante Open Graph. Si no hay imagen, la red sustituye lo que encuentre.

La función es desde hace tiempo un estándar de WordPress. Hoy es imposible encontrar un tema decente sin soporte para ella. Pero la calidad de la implementación aún varía de un desarrollador a otro: un tema muestra la miniatura como un banner nítido, otro estira un pequeño cuadrado a todo el ancho.

Añadir una imagen destacada: mecánica básica

En el editor de publicaciones (Gutenberg o Clásico), hay un panel «Imagen destacada» a la derecha. Haga clic en «Establecer imagen destacada», suba un archivo o elija uno de la biblioteca de medios, haga clic en «Establecer». Listo.

Matiz: WordPress no exige al autor que establezca una imagen. Si la olvida, la publicación sale al feed con un espacio vacío. Cubriremos la solución a este problema en la sección sobre comprobaciones obligatorias.

Tamaños de imagen: qué hace WordPress internamente

Cada instalación de WordPress viene con cuatro tamaños de serie:

• Completo, el archivo original sin cambios
• Miniatura, un cuadrado (por defecto 150×150 px según los ajustes de medios de WordPress), recortado desde el centro
• Mediano, escalado a un ancho máximo dado, sin recorte
• Grande, igual pero con un límite superior

Los ajustes se encuentran en «Ajustes → Medios». Al subir una nueva imagen de WordPress, WordPress genera las cuatro versiones más los tamaños adicionales registrados por el tema activo. Cada versión se guarda en wp-content/uploads/ como un archivo separado.

¿Por qué tantas copias? Sin ellas, un diseñador tendría que ajustar manualmente cada tamaño para una ubicación de salida específica. Con ellas, el tema simplemente solicita la variante necesaria mediante the_post_thumbnail('medium') o wp_get_attachment_image_src(). Más sobre la arquitectura del subsistema de medios en la documentación oficial de WordPress.

La miniatura es el único tamaño que se recorta forzosamente. El resto se escala conservando las proporciones.

Cambiar el tamaño de la imagen destacada

Los temas usan dimensiones diferentes. Al cambiar de tema o para una nueva tarea, el tamaño de la imagen destacada puede requerir ajuste.

Primero revise los ajustes del tema: «Apariencia → Personalizar». Los temas modernos a menudo ofrecen un deslizador o menú desplegable para el ancho y alto de la miniatura. Si lo encuentra, cámbielo en dos clics.

Si no lo encuentra, no hay problema. El plugin Simple Image Sizes resuelve la tarea sin una sola línea de código.

Simple Image Sizes: la herramienta adecuada para las dimensiones

Plugin gratuito de Nicolas Juen, con mantenimiento activo (versión actual 3.2.5, requiere PHP 8.0+). Tras la instalación, vaya a «Ajustes → Medios» y vea todos los tamaños registrados, incluidos los que el tema añadió pero ocultó de la vista.

Para cada tamaño, establezca ancho y alto. Para la imagen destacada, oriéntese según cómo la muestre el tema. Banner de contenido a ancho completo, use 1200×630 px (óptimo para redes sociales según las recomendaciones de Open Graph de Facebook). Miniatura cuadrada en una cuadrícula, 400×400 o 600×600 px.

Ventajas:

• Ve todos los tamaños, incluidos los ocultos por el tema
• Permite activar y desactivar la visualización del tamaño en el desplegable de inserción de medios
• Genera código PHP add_image_size() listo para transferir al tema

Contras:

• Requiere PHP 8.0+, no funcionará en hostings francamente anticuados
• Interfaz minimalista, sin ayudas visuales

Precio: gratuito, sin versión Pro.

🔗 Simple Image Sizes en WordPress.org

Qué hacer con las imágenes antiguas

WordPress aplica los nuevos tamaños solo a las subidas nuevas. Todo lo que subió antes permanece en las dimensiones antiguas.

Simple Image Sizes también cubre esta tarea. En la página «Ajustes → Medios», desplace la página hacia abajo hasta el bloque de regeneración. Seleccione el tamaño necesario, especifique el tipo de contenido e inicie la reconstrucción. El plugin recorrerá todas las imágenes existentes y creará nuevas copias con los tamaños actualizados.

Advertencia: en sitios con decenas de miles de archivos, la regeneración consume espacio del servidor. WordPress no elimina las miniaturas antiguas, que permanecen en la carpeta como peso muerto. Antes de una regeneración masiva, asegúrese de tener espacio en disco.

Configuración automática de la imagen destacada

Cuando un contenido contiene imágenes pero la imagen destacada está vacía, WordPress puede tomar la primera imagen del contenido y asignarla como miniatura. Resulta práctico para autores que olvidan este paso con frecuencia y para blogs con publicación continua.

La mecánica es simple: si la imagen destacada no se establece manualmente, la función encuentra la primera imagen adjunta mediante get_children y la asigna a través de set_post_thumbnail().

El código se añade al functions.php del tema activo. Recomiendo encarecidamente hacerlo mediante el plugin WPCode, ya que un error tipográfico en functions.php sin este plugin rompe el sitio por completo:

1
function autoset_featured() {
2
    global $post;
3
    $already_has_thumb = has_post_thumbnail( $post->ID );
4
    if ( ! $already_has_thumb ) {
5
        $attached_image = get_children( array(
6
            'post_parent'    => $post->ID,
7
            'post_type'      => 'attachment',
8
            'post_mime_type' => 'image',
9
            'numberposts'    => 1,
10
        ) );
11
        if ( $attached_image ) {
12
            foreach ( $attached_image as $attachment_id => $attachment ) {
13
                set_post_thumbnail( $post->ID, $attachment_id );
14
            }
15
        }
16
    }
17
}
18
 
19
add_action( 'the_post', 'autoset_featured' );
20
add_action( 'save_post', 'autoset_featured' );
21
add_action( 'draft_to_publish', 'autoset_featured' );
22
add_action( 'new_to_publish', 'autoset_featured' );
23
add_action( 'pending_to_publish', 'autoset_featured' );
24
add_action( 'future_to_publish', 'autoset_featured' );

La función se activa en seis hooks: the_post, save_post y todas las transiciones de estado *_to_publish. Tras la asignación, la miniatura permanece incluso si elimina la imagen del cuerpo del contenido.

Inconveniente: si el autor no insertó ni una sola imagen en el texto, no habrá miniatura. Para este escenario, consulte la siguiente sección.

Verificación obligatoria: sin miniatura, no hay publicación

Método simple y estricto: el autor hace clic en «Publicar» y WordPress guarda el contenido como borrador y muestra un aviso. Sin una imagen destacada, la publicación no se realiza.

Dos fragmentos de código en functions.php:

Parte 1, verificación al guardar (solo para el tipo post):

1
add_action( 'save_post', 'pu_validate_thumbnail' );
2
 
3
function pu_validate_thumbnail( $post_id ) {
4
    if ( get_post_type( $post_id ) != 'post' ) {
5
        return;
6
    }
7
 
8
    if ( ! has_post_thumbnail( $post_id ) ) {
9
        set_transient( 'pu_validate_thumbnail_failed', 'true' );
10
        remove_action( 'save_post', 'pu_validate_thumbnail' );
11
        wp_update_post( array( 'ID' => $post_id, 'post_status' => 'draft' ) );
12
        add_action( 'save_post', 'pu_validate_thumbnail' );
13
    } else {
14
        delete_transient( 'pu_validate_thumbnail_failed' );
15
    }
16
}

Parte 2, mensaje de error en el administrador:

1
add_action( 'admin_notices', 'pu_validate_thumbnail_error' );
2
 
3
function pu_validate_thumbnail_error() {
4
    if ( get_transient( 'pu_validate_thumbnail_failed' ) == 'true' ) {
5
        echo '<div class="notice notice-error"><p><strong>You must set a featured image before publishing.</strong></p></div>';
6
        delete_transient( 'pu_validate_thumbnail_failed' );
7
    }
8
}

El texto del mensaje es totalmente personalizable, sustituya la cadena dentro de <p><strong>...</strong></p> por la suya propia.

Vista previa de la miniatura en la lista de contenidos

La tabla estándar de «Contenidos → Todos los contenidos» muestra título, autor, categorías, etiquetas y fecha. La imagen destacada no aparece. Para comprobar qué contenidos carecen de miniatura, hay que abrir cada uno individualmente. Con más de 50 publicaciones, esto resulta molesto.

El código siguiente añade una columna Thumbs a la tabla de contenidos y páginas:

1
add_filter( 'manage_posts_columns', 'posts_columns', 5 );
2
add_action( 'manage_posts_custom_column', 'posts_custom_columns', 5, 2 );
3
 
4
add_filter( 'manage_post-type_posts_columns', 'posts_columns', 5 );
5
add_action( 'manage_post-type_posts_custom_column', 'posts_custom_columns', 5, 2 );
6
 
7
function posts_columns( $defaults ) {
8
    $defaults['riv_post_thumbs'] = __( 'Thumbs' );
9
    return $defaults;
10
}
11
 
12
function posts_custom_columns( $column_name, $id ) {
13
    if ( $column_name === 'riv_post_thumbs' ) {
14
        if ( has_post_thumbnail() ) {
15
            echo the_post_thumbnail( array( 100, 100 ) );
16
        } else {
17
            _e( 'No Thumbnail For Post' );
18
        }
19
        echo '<style>.column-riv_post_thumbs img{max-height:100px;max-width:100px;}</style>';
20
    }
21
}

El tamaño de la vista previa se establece en 100×100 px, suficiente para un control visual rápido. Si necesita un tamaño mayor, sustituya array(100, 100) por array(200, 200). Más información sobre los parámetros en la documentación de the_post_thumbnail.

Para las páginas, añada estas dos líneas al principio del fragmento:

1
add_filter( 'manage_pages_columns', 'posts_columns', 5 );
2
add_action( 'manage_pages_custom_column', 'posts_custom_columns', 5, 2 );

Ahora, en la sección «Páginas → Todas las páginas» también puede ver dónde hay miniatura y dónde no.

Cómo hacer que la miniatura sea cliqueable

Un buen tema envuelve automáticamente la imagen destacada en un enlace hacia la entrada. Uno malo muestra una imagen estática que no lleva a ninguna parte. El visitante hace clic en la vista previa en la página de inicio y no sucede nada.

Se soluciona con un filtro en functions.php:

1
function wcs_auto_link_post_thumbnails( $html, $post_id, $post_image_id ) {
2
    $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
3
    return $html;
4
}
5
add_filter( 'post_thumbnail_html', 'wcs_auto_link_post_thumbnails', 10, 3 );

El filtro post_thumbnail_html intercepta la salida HTML de la miniatura y la envuelve en un enlace con get_permalink(). El título de la entrada va en el atributo title mediante esc_attr(), seguro e informativo.

Cambiar el texto «Establecer imagen destacada»

Cuando el sitio tiene configuración automática de miniaturas desde el contenido, la etiqueta estándar «Establecer imagen destacada» confunde a los autores. Parece que la imagen debe establecerse manualmente, aunque el sistema lo hará por sí mismo.

Cambie el texto por algo informativo:

1
function change_featured_image_text( $content ) {
2
    return $content = str_replace(
3
        __( 'Set featured image' ),
4
        __( 'Thumbnail will be set automatically from the first image in the post' ),
5
        $content
6
    );
7
}
8
add_filter( 'admin_post_thumbnail_html', 'change_featured_image_text' );

El filtro admin_post_thumbnail_html gestiona el bloque HTML de la imagen destacada en la barra lateral del editor. Sustituya cualquier texto dentro de __( ... ) en el segundo argumento de str_replace.

Vídeo: cómo funciona todo en la práctica

Si prefiere una demostración visual, aquí tiene un recorrido completo de WPBeginner: desde añadir su primera miniatura hasta ajustar tamaños y automatización.

⁉️🤔 Preguntas frecuentes

¿Por qué no se muestra la imagen destacada en el sitio?

Lo más probable es que el tema no admita la función post-thumbnails. Revise functions.php: debe haber una línea add_theme_support( 'post-thumbnails' ). Si no está, añádala. Segunda razón: en los ajustes del tema, la visualización de la imagen destacada está desactivada para un tipo de entrada específico. Tercera: un plugin de caché está reteniendo una versión antigua de la página, limpie la caché.

¿Cuál es la diferencia entre imagen destacada e imagen de portada?

La imagen destacada es un metadato de la entrada que el tema usa para vistas previas en feeds, archivos y Open Graph. La imagen de portada es un bloque dentro del contenido (apareció en Gutenberg) que se muestra solo en el cuerpo de la entrada y no afecta a las redes sociales. Puede usar ambas simultáneamente: portada para la entrada visual al artículo, imagen destacada para todo lo demás.

¿Qué tamaño debo usar para las imágenes destacadas?

Para redes sociales, el formato óptimo es 1200×630 px (proporción 1.91:1) según la documentación para desarrolladores de Facebook. Para la cuadrícula de entradas en la página de inicio, oriéntese por lo establecido en los ajustes del tema. Si el tema usa miniaturas cuadradas, 600×600 u 800×800 px. Antes de subir, comprima la imagen a 100-150 KB con TinyPNG o ShortPixel.

¿Es obligatorio establecer una imagen destacada para cada entrada?

Técnicamente no. Pero sin ella, la página de inicio y las redes sociales se ven descuidadas, y la tasa de clics cae de 2 a 3 veces. Si teme olvidarlo, use el código de verificación obligatoria de la sección anterior o el plugin Quick Featured Images, que sustituye una miniatura por defecto para las entradas sin imagen.

¿Cómo elimino o reemplazo una imagen destacada?

En el editor de entradas, haga clic en la imagen destacada actual en la barra lateral. Se abrirá la biblioteca de medios, haga clic en «Eliminar imagen destacada». Después de eso, el botón volverá a ser «Establecer imagen destacada». Suba una nueva.

¿Puedo usar una misma imagen como destacada para varias entradas?

Sí, WordPress no impone restricciones. Seleccione el mismo archivo de la biblioteca de medios para distintas entradas. Pero si la imagen se repite en el feed, parece un error o un descuido. Para variedad visual, es mejor seleccionar miniaturas únicas.

Qué hacer con las imágenes destacadas ahora mismo

La imagen destacada no es un elemento «opcional», sino una parte obligatoria de cada entrada. Sin ella, las redes sociales sustituyen contenido aleatorio, la página de inicio pierde estructura visual y la tasa de clics cae exponencialmente.

Repase la lista de verificación en diez minutos:

• Abra cualquier entrada y asegúrese de que la imagen destacada está establecida.
• Compruebe cómo se ve en la página de inicio y en redes sociales (Facebook Sharing Debugger como ayuda).
• Si los tamaños no coinciden con lo esperado, instale Simple Image Sizes y ajuste las dimensiones.
• Si trabaja con un equipo de autores, añada el código de verificación obligatoria para que la publicación sin miniatura pase a borrador.

Estos diez minutos le ahorrarán horas de edición manual y decenas de lectores perdidos. Hágalo ahora.