Las miniaturas de publicaciones son cada vez más populares. Muchos temas de revistas asocian una imagen con una publicación específica que luego muestran en la página de inicio o en la página de la publicación. Mostramos una miniatura con nuestras publicaciones tanto en la página de la publicación como en la página de la categoría. En versiones anteriores, esta funcionalidad se obtenía con el uso del método de campo personalizado, que no era muy fácil de usar. Gracias a los desarrolladores principales de WordPress, junto con muchas características notables en WordPress 2.9, esta función también se agregó al núcleo.
Simply watch the video or read the tutorial below 
Video
Guía para principiantes
Verá una opción como esta en la barra lateral de su panel de escritura de publicaciones en el panel de WordPress.
Haga clic en el enlace y se le llevará a una página para subir imágenes. Suba la imagen y verá algo como esto:
Simplemente haga clic en el enlace que dice "usar como miniatura". Una vez que lo haga, verá una pantalla como esta:
La pantalla anterior significa que ha terminado. Simplemente haga clic en publicar y la imagen se mostrará en su sitio.
Guía del desarrollador
A pesar de que esta funcionalidad se agregó al núcleo, no todos los usuarios verán esta opción en la barra lateral de su panel de escritura de publicaciones. Esta es una de esas funciones que solo se pueden habilitar si el tema las admite. Los temas gratuitos más antiguos podrían no admitirlas, por lo que necesitaría pedirle al desarrollador que actualice, o puede hacerlo usted mismo siguiendo este tutorial.
Primero, necesitará abrir su archivo functions.php en la carpeta de su tema y pegar el siguiente código:
add_theme_support( 'post-thumbnails' );
Este código habilitará el soporte del tema tanto para publicaciones como para páginas. Así que ahora podrá ver una opción en su panel. Pero no se mostrará en sus temas porque aún no hemos agregado el código al tema.
Puedes mostrar la miniatura en cualquier lugar dentro de el Loop usando este código:
<?php the_post_thumbnail(); ?>
Esa era la función básica, pero si quieres algo más avanzado, como especificar el tamaño de la miniatura de la publicación, solo necesitas abrir tu archivo functions.php y pegar el código así:
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 50, 50, true );
Las dimensiones se establecen en este orden: ancho x alto y son en píxeles.
También puedes agregar tamaños de imagen adicionales para tu imagen destacada agregando esta línea:
add_image_size( 'single-post-thumbnail', 590, 180 ); // Permalink thumbnail size
Más tarde puedes llamar a los tamaños de miniatura específicos en tu loop de publicaciones así:
<?php the_post_thumbnail('single-post-thumbnail'); ?>
Esta es una versión desglosada de la funcionalidad completa de esta característica. Intentamos mantenerla simple para que todos puedan seguirla. Si deseas más información sobre esta funcionalidad, consulta:
Artículo de Mark Jaquith sobre miniaturas de publicaciones
Codex de WordPress
Chrissy
¿Es esto necesario con los Temas Hijo de Genesis? Parece que ya tienen una imagen destacada para sus publicaciones. Gracias
Personal editorial
No, esto no es necesario con los temas de Genesis.
Administrador
Divya
Hola,
En mi tema no hay loop.php, ¿entonces dónde necesito editar?
Gracias de antemano
Personal editorial
El bucle puede estar en tu index.php, single.php, archive.php y otros archivos.
Administrador
A. Suriel
Probé el widget y está funcionando bien. Gracias por el consejo.
Kathleen Smitheram
Entonces... probé esto y creo que rompí mi sitio. Ahora me sale este error
Parse error: syntax error, unexpected ‘”‘ in /home/content/21/10729521/html/wp-content/themes/desk-mess-mirrored/functions.php on line 642
y no puedo entrar a mi panel de administración. Soy nuevo en el autoalojamiento y no tengo idea de cómo arreglar esto. ¡AYUDA!
Personal editorial
Por favor, lee este artículo:
https://www.wpbeginner.com/beginners-guide/beginners-guide-to-pasting-snippets-from-the-web-into-wordpress/
Creemos que cometiste un error al pegar el código correctamente.
Administrador
Nik
¡Gran tutorial!
Pregunta rápida:
Dijiste que si no ves "usar como miniatura", es posible que tengas que ir al PHP porque el tema es antiguo.
¿Dónde buscaría en el nuevo diseño de WordPress para ver si "usar como miniatura" aparece en mi tema?
Aquí hay una imagen para ayudar a explicar a qué me refiero con "nuevo diseño de WordPress".
http://thereselawlor303.files.wordpress.com/2012/12/newpost5.jpg?w=1024&h=621
Espero que tenga sentido.
¡Gracias!
Personal editorial
Si puedes ver la imagen destacada mostrada junto a tu título en tu sitio, entonces tu tema tiene soporte para miniaturas.
Administrador
Nik
Entendido. ¡Gracias!
Drew
Hola,
¡Gracias por esta publicación, me ayudó totalmente!
Pregunta, ¿cómo mostraría también la imagen destacada (en un tamaño diferente) solo dentro de la publicación real (no en el bucle)?
Thanks
Personal editorial
Simplemente puedes usar el botón de insertar publicación en la imagen.
Administrador
Mimo
Ups, mi ejemplo anterior falló.
p. ej. i mg src=”<?p hp the_p ost_thumbnail (); />
Mimo
Ignora mis comentarios. Descubrí por qué no querrías envolverlos en etiquetas img y de anclaje :D.
Gracias por la publicación
chaquetas canada goose
Sigue escribiendo, continúa inspirando, sigue creando. Me gusta la idea y el sitio web es bastante fácil de usar. Desearía que revisaran más de los 20 sitios web principales en el campo. La web es un lugar grande.
chaquetas canada goose
Sigue escribiendo, continúa inspirando, sigue creando. Me gusta la idea y el sitio web es bastante fácil de usar. Desearía que revisaran más de los 20 sitios web principales en el campo. La web es un lugar grande.
mbtshoesmbts
Gracias por publicar esta información. Solo quiero que sepas que acabo de revisar tu sitio y lo encuentro muy interesante e informativo. No puedo esperar a leer muchas de tus publicaciones.
Speeltjezoeken
Gracias, esta publicación me ayudó a ponerme en marcha de nuevo.
lakkolmahendra
Muchas gracias por la maravillosa información. Es un método sencillo para agregar una miniatura en tu página de inicio. Lo intentaré en mi sitio hoy.
LukeSwenson
Estoy trabajando en la versión 3.2.1 de WorPress. Noté que el módulo en el administrador dice "Imagen destacada" en lugar de "Miniatura de publicación".
Además, recibo el siguiente error cuando intento agregar una imagen en el administrador:
Advertencia: No se puede modificar la información de encabezado – los encabezados ya fueron enviados por (la salida comenzó en /——–/—-/——/——-/wp-content/themes/html5/functions.php:58) en /Applications/MAMP/htdocs/justine/wp-admin/async-upload.php en la línea 2648
SagivHaalush
@wpbeginner Hey
VERY(!) helpful post, However I got to the exact same problem after adding the 2 lines(at the bottom…). When I put them at the beginning, nothing happens…
Can you please be more specific as for the placement in the loop(Which/where)? Thanks
birdhammer
Hola, acabo de intentar ingresar el código anterior siguiendo las instrucciones del video, pero cuando lo actualicé obtuve un error de análisis. Ni siquiera puedo iniciar sesión en mi panel. ¡Me siento como un idiota!
Uso WordPress con el tema modularity lite y mi sitio es birdhammer.com.
¿Puedes ayudarme por favor?
wpbeginner
La ubicación del código en tu archivo functions.php probablemente esté causando los errores. ¿Estás usando un framework de temas? ¿Lo estás agregando hasta el final?
Casey Dennison
El mío no funciona en absoluto, sigo recibiendo errores en PHP y está escrito correctamente. No sé si está arruinado, sigue mostrando el código de funciones en la parte superior de mi panel de WordPress??? Eso es raro
davede
@wpbeginner Ah, gracias, resolví el problema. Detalles aquí: (bueno, parece que no puedo pegar una URL). Eso apesta.
wpbeginner
@davede También necesitarías agregar el código de miniatura en tu archivo single.php.
davede
Buen material. Gracias.
Tengo dificultades para que la miniatura aparezca solo en el extracto, no en la página de la publicación.
¿Alguna idea?
kevin.m.kwok
@wpbeginner ¡Funcionó perfectamente, muchas gracias!
wpbeginner
@kevin.m.kwok Sí, esto parece un problema de CSS. Tu clase CSS de imagen necesita tener la propiedad float: left.
kevin.m.kwok
Hola, gran tutorial. Todo funciona, excepto que no puedo hacer que la miniatura se publique a la "izquierda" de mi publicación en mi página de inicio. Siempre aparece encima de mi publicación, incluso si selecciono izquierda en las opciones de miniatura. ¿Alguna idea?
kevin.m.kwok
Hola,
Peter Wolff
Hola WP Beginner.
¡Gran tutorial de WP de arriba del equipo editorial!
Tengo una pregunta rápida sobre miniaturas de WP. He estado intentando agregar un código PHP simple de Campos Personalizados a mi plantilla Category.php para añadir un pequeño título de pie de foto de texto debajo de cada imagen en miniatura. Muy frustrado... de todos modos, he adjuntado abajo el bucle de miniaturas de Category.php y me preguntaba si puedes ayudarme a escribir el código PHP de Campos Personalizados (campo llamado "thumb_tag") dentro de este bucle. Aquí está el código:
ID, ‘main_image’, true); ?>
<a href="” ><img src="/resize.php?w=162&h=105&file=” alt=”” title=”” width=’162′ height=’105′ />
¡Muchas gracias!
Pete
Personal editorial
¿Por qué usar un campo personalizado para eso? WordPress ya lo tiene integrado por defecto.
https://www.wpbeginner.com/wp-tutorials/how-to-display-wordpress-post-thumbnails-with-captions/
Administrador
Ankit
Gracias por el excelente tutorial. Es el método más simple y único para agregar una miniatura en tu página de inicio. Funciona en mi sitio.
shivam
Soy nuevo en WordPress, no sé mucho de programación... Me gustó tu artículo. Pero, ¿puedes decirme exactamente en qué posición debemos colocar este código? Por ejemplo, functions.php es un archivo, ¿en qué parte debemos agregar ese código? ¿Hay alguna demostración para eso?
Personal editorial
Los diferentes temas tienen diferentes códigos en el archivo functions. Necesitas agregar este código dentro de la etiqueta php.
Administrador
James
Gracias, creo que he logrado que funcione. Sin embargo, al agregar una miniatura, ahora se agrega automáticamente a la parte superior de mi publicación, aunque la publicación ya tiene una imagen.
mark
Gran tutorial – Sin embargo, y no encuentro esta información en ningún lado – PERO, quiero agregar la miniatura a la pantalla del editor de publicaciones para que mis escritores puedan ver cómo se vería en línea con la publicación antes de publicarla. ¿Dónde podría hacer eso? Gracias de antemano.
Personal editorial
Ves la miniatura una vez que la subes, sin embargo, no hay una vista previa en vivo en la pantalla de administración. Tu autor puede simplemente hacer clic en Vista previa y ver la publicación en la nueva pestaña <<
Administrador
elizabeth
Hola
Gracias por la información. Seguí los pasos en mi tema, sin embargo, mis imágenes todavía no se muestran en el cuadro de imagen... parecen archivos rotos en mi página de inicio. Cuando hago clic en ellas, entonces aparecen. ¿Cómo puedo hacer que sean visibles en la página de inicio? Gracias
Personal editorial
Siempre y cuando the_post_thumbnail(); esté dentro del bucle en la página de inicio, debería funcionar bien.
Administrador
jam
¡Gracias por tu ayuda! Odio los plugins, así que prefiero usar la función de plantilla.
Janine
Gracias por la excelente publicación, específicamente sobre add_theme_support( ‘post-thumbnails’ );. Funcionó muy bien con el wootheme que estoy modificando.
saBEE
Gracias por la excelente información.
Cada una de mis publicaciones tiene una foto. Estoy intentando que la foto de cada publicación aparezca como una miniatura en el feed RSS. ¿Funcionará el método anterior para hacer esto?
Personal editorial
No, tendrás que usar este método en conjunto con este otro:
https://www.wpbeginner.com/wp-tutorials/how-to-add-post-thumbnail-to-your-wordpress-rss-feeds/
Administrador
sabee
Gracias por tu pronta respuesta.
Estoy un poco confundido ya que el tema que estoy usando, AutoFocus+, también requiere el tema Thematic. ¿Qué archivo functions.php necesita ser editado? ¿O ambos necesitan ser editados?
¿También me pregunto dónde poner el código?
Bernard
He seguido los pasos de este tutorial, pero por alguna razón obtengo el siguiente error cada vez que intento seleccionar una imagen de la opción de galería:
Fatal error: Call to undefined function: get_post_thumbnail_id() in /wp-admin/includes/media.php on line 1292
¿Alguien puede ayudarme a resolver esto?
gracias
Bernard
darren
¿esto realmente recorta la imagen al subirla? ¿O solo la muestra a la altura y ancho apropiados cuando la llama en la página? Pregunto porque extraemos nuestro feed de nuestro blog a un sitio que no es de WP y enlazamos a él, pero nos gustaría poder referenciar las miniaturas. Es un sitio ASP, así que no tengo el lujo de la manipulación de imágenes nativa de PHP.
Personal editorial
Está redimensionando la imagen, no recortándola.
Administrador
Zara
Gracias chicos, ¡son increíbles!
Los amo <3
Helen
Hola
Tenemos este código en las funciones del tema (vino con la apariencia del tema) el tema tiene un carrusel de imágenes que usa la función 'post thumbnail', sin embargo, no se muestra en el administrador, por lo que no podemos hacer que el carrusel funcione;
<?php
ayuda : ) gracias
Personal editorial
Helen,
No vemos el código php. ¿Podrías codificar tu código PHP antes de pegarlo en los comentarios? O puedes enviarnos un correo electrónico usando nuestro formulario de contacto.
Administrador
Ami
¡Funciona muy bien! Solo una consulta... ¿cómo puedo agregar un enlace o envolver un enlace alrededor
para que cuando alguien haga clic en el enlace se abra una lightbox con el tamaño original.
Solo para aclarar.
Por el momento, en functions.php tengo
add_image_size(‘my-custom-image’, 640,9999); así que la imagen en la publicación tiene 640 de ancho, esto se vinculará a la imagen original que es, digamos, 1000px por 500px.
Encontré esto: http://polymathworkshop.com/shoptalk/2010/03/19/get-the_post_thumbnail-direct-path-for-wordpress/ que funciona hasta cierto punto, pero abre la miniatura en la lightbox.
Personal editorial
La única forma de que funcione es vincular al adjunto original de la miniatura.
Administrador
Eduardo Antunes
¡Genial!
Para recordar:
> agregar en functions.php
add_theme_support(‘post-thumbnails’); set_post_thumbnail_size(70, 70, true);
> agregar en el loop:
php the_post_thumbnail();
Ricky@twitter apps
Bueno, yo estaba buscando lo mismo. Tengo una pregunta rápida para ti. ¿Hay alguna forma de que la imagen por defecto de la categoría se muestre como miniaturas? ¿O hay alguna manera de obtener la primera imagen de la publicación y usarla como miniatura para publicaciones relacionadas? Implementé la técnica anterior en mi blog, pero el principal problema es que todas mis publicaciones no tienen la miniatura habilitada. Lo que hace que la situación sea horrible, ya que tengo que actualizar todas las publicaciones con miniaturas. ¿Hay alguna forma de usar la primera imagen como miniatura por defecto usando la técnica anterior?
Personal editorial
Sí, puedes obtener la primera imagen de la publicación usando el plugin Get Image de Justin Tadlock. También puedes agregar una variable condicional (if then) verificando si es_post_thumbnail.
Administrador
Jal
Editores,
¿Usas el editor de publicaciones de WordPress o algún software de publicación de blogs sin conexión? Yo uso Live Writer, que tiene algunas opciones decentes, pero a veces pienso en cambiar al editor de publicaciones de WP. ¿Puedes compartir algunas opiniones sobre esto, por favor?
Gracias
Antonio
Wow thanks I’ve always wondered how to do this but never really had the patience to look for a solution. I didn’t know it was this simple. WOOOOT! Thanks.
Bob
¿Cómo se agrega lightbox o thickbox (ejemplo rel=\"lightbox\" o class \"thickbox\") a la miniatura?
Personal editorial
Tienes que usar jQuery y agregar la clase a la miniatura. Para agregar la clase, agregarías: array(‘class’ => ‘lightbox’)
Administrador
Trisha
¿Alguna idea si esto funciona para miniaturas de páginas? Estoy intentando listar páginas hijas usando este código. (el segundo, en 'post format'. Cambié todas las instancias de 'content' por 'excerpt' y usé Excerpt Editor de Andrew Oz, que es realmente genial.
Cuando intento insertar el código para la miniatura, no aparece.
¿Alguna idea de lo que podría estar haciendo mal?
Personal editorial
Este código solo funciona dentro del bucle. Si quieres mostrarlo fuera del bucle, tendrías que ejecutar una función global wp_query.
Administrador
noonoob
Muchas gracias, funcionó. Perfecto
Jeremy
¿Cómo puedo obtener la miniatura desde fuera del bucle?
Personal editorial
Pronto escribiremos otro artículo explicando eso. Gracias por la sugerencia. Si realmente quieres empezar a trabajar en ello, usarás la función query_post.
Administrador
Chad
Espero tu publicación sobre cómo mostrar imágenes de publicaciones fuera del bucle. Aún no he encontrado un ejemplo que funcione usando WP 3.0
Personal editorial
Funcionaría de la misma manera que esto:
https://www.wpbeginner.com/wp-themes/how-to-display-custom-fields-outside-the-loop-in-wordpress/
Walt Ribeiro
Es similar a ese tutorial que no es un ejemplo exacto. Entonces, ¿publicaste tu propio tutorial para miniaturas? ¡Me encantaría saber cómo!
Cosmin
Chicos, ¿esto solo funciona con imágenes cuadradas?
¿Como de 50px por 50px?
Escuché a alguien mencionar que solo toma el valor de la altura al especificar dimensiones…
(así que 50px por 30px no funcionaría)
Personal editorial
Funcionará con cualquier tamaño. A veces se perderá calidad de imagen si no tiene la proporción correcta. Lo tenemos funcionando en el sitio web de un cliente y funciona perfectamente.
Administrador
Luke
Soy principiante y me encanta lo que están haciendo. Sería bueno tener instrucciones muy específicas para cosas como esta. Cuando copio/pego en funciones, no funciona.
¿Alguna idea de lo que podría estar haciendo mal? ¿Quizás una publicación de funciones para principiantes?
Gracias y sigan con el gran trabajo.
Personal editorial
¿Estás usando WordPress 2.9? Si es así, no hay forma de que no funcione. Este es probablemente el mejor desglose de este código.
Si bien intentamos que todo sea lo más claro posible, a veces se requiere conocimiento previo para completar algunas tareas.
Si desea que uno de nuestro personal lo revise y lo haga por usted, podemos hacerlo por una pequeña tarifa.
Administrador
Chris Peterson
¡Grandes consejos! Han explicado claramente cada uno de los pasos para instalar miniaturas de publicaciones.
Cosmin
¡Genial!
¡Gracias chicos, justo a tiempo, ya que estoy trabajando en un tema de WordPress para un cliente y requiere justo esto!
Now it will be sooo easy for the less-tech-savvy person that’ll write posts
Nimit kashyap
Preferiría usar un plugin para ello.
Personal editorial
¿Por qué es eso? Los plugins ralentizan tu sitio y probablemente sea la forma más fácil de hacer esto.
Administrador
jeprie
artículos muy buenos, nunca supe que podías hacer esto en WordPress.
Entonces, ¿qué tan lento pueden ser los plugins para nuestro sitio de WP? ¿Es significativo?
Personal editorial
Cuantas más consultas a la base de datos haga su sitio, más lento cargará y cada plugin se suma a las consultas.