¿Sabías que WordPress crea al menos 7 versiones en distintos tamaños de cada imagen que subes? Vamos a aprender cómo controlar e incluso evitar esto…
Por ejemplo, si subes una imagen de 2560×1600 px como la de la siguiente captura, con un tamaño de archivo de 1,9 Mb.
Se crearán copias de otros tamaños, que puedes ver en el mismo editor:
Y que, por supuesto, existen físicamente en tu alojamiento, ocupando un precioso y caro espacio en disco.
Vamos, que en el ejemplo has subido 1 imagen de 1,9 Mb y el resultado es que tienes 7 imágenes que, en conjunto, ocupan más de 6,8 Mb. Ahora haz el simple ejercicio de multiplicar esto por todas las imágenes que subas.
Tremendo ¿verdad?
¿Por qué crea WordPress estas copias de la imagen que subes?
Parece una locura, pero tiene bastante sentido, ten en cuenta que WordPress es una aplicación de creación y publicación web que puedes utilizar desde cualquier ordenador, solo accediendo a tu web con tu usuario y contraseña, y como no siempre tendrás a mano un editor de imágenes para cambiar tamaños o resoluciones, pues WordPress crea copias a distintos tamaños (más pequeños) de cada imagen que subes.
En realidad es una estrategia de optimización, para que siempre tengas tamaños más óptimos y menores que utilizar en tus contenidos, la contrapartida es que llena el disco de tu alojamiento de copias.
Para ello utiliza, por una parte, la pantalla de ajustes de medios de la administración de tu web, donde puedes especificar los tamaños del formato grande, mediano y miniatura (algo es algo).
Pero ahí solo salen 3 tamaños ¿y el resto?
Efectivamente, WordPress no solo crea esos tamaños adicionales que ves en los ajustes de medios, la lista completa es esta:
| Tamaño de imagen | Dimensiones |
|---|---|
| Miniatura | (Tamaño basado en los ajustes de medios) |
| Medio | (Tamaño basado en los ajustes de medios) |
| Grande | (Tamaño basado en los ajustes de medios) |
| Medio Grande | 768px |
| Medio-grande x2 | 1536px |
| Grande x2 | 2048px |
| Escalado | 2560px |
Unas cuantas ¿eh?
Bueno, tampoco son tantas … ¡Ah no, que hay más!
Pues sí, no solo WordPress hace copias en distintos tamaños de cada imagen que subas, también el tema activo creará varios tamaños adicionales, para sus propias miniaturas, diseños en cuadrícula y vete a saber.
Pero la cosa no acaba aquí, también hay plugins que crean nuevos tamaños, el mismo WooCommerce por ejemplo.
De este modo, te vas a encontrar temas y plugins que usan las siguientes funciones de WordPress para añadir imágenes adicionales:
set_post_thumbnail_size()— Crea un tamaño personalizado para las imágenes destacadasadd_image_size()— Crea imágenes adicionales en los tamaños especificados
Vamos, que es un no parar. Además de WordPress, también el tema y los plugins crean sus propios tamaños personalizados de tus imágenes.
¡Esto es una locura! ¿qué hago?
Hay varias posibles estrategias, y algunas ya las hemos visto:
Pero lo más efectivo sería evitar que se creen los tamaños que no necesites ¿no?
Evita que se creen los tamaños de los ajustes de medios
Una estrategia rápida y sencilla, si ya el tema y plugins generan los tamaños que necesitan, es evitar que WordPress cree los tamaños grande, mediano y miniatura.
Y esto lo puedes conseguir de un modo tan sencillo como poner a cero los selectores, así:
Con esto ya te has quitado 3 archivos adicionales, pero todavía quedan más, como hemos visto en la tabla de arriba.
Evita que WordPress cree todos los tamaños adicionales con un código
Si tienes claro que no necesitas ninguno de los tamaños adicionales que crea WordPress puedes añadir este código al archivo functions.php del tema activo o a tu plugin de utilidades:
/* Evitar que WP cree tamaños de imagen adicionales */
function ayudawp_desactiva_medios_adicionales_wp($sizes) {
unset($sizes['thumbnail']); // desactivar tamaño miniatura
unset($sizes['medium']); // desactivar tamaño medio
unset($sizes['large']); // desactivar tamaño grande
unset($sizes['medium_large']); // desactivar tamaño medio-grande
unset($sizes['1536x1536']); // desactivar tamaño medio-grande x2
unset($sizes['2048x2048']); // desactivar tamaño grande x2
return $sizes;
}
add_action('intermediate_image_sizes_advanced', 'ayudawp_desactiva_medios_adicionales_wp');
/* Evitar que se creen los tamaños escalados */
add_filter('big_image_size_threshold', '__return_false');
Guarda y ya no se crearán estos tamaños cuando subas una nueva imagen.
Evita que WordPress cree todos los tamaños adicionales con un plugin
También puedes hacer lo anterior ayudándote de un plugin, en concreto Disable Media Sizes.
Una vez instalado y activo tienes una nueva página de ajustes con el nombre del plugin desde la que desactivar alguno o todos los tamaños adicionales generados por WordPress.
A partir de este momento (no con las imágenes ya subidas), mientras tengas activo el plugin ya no se generarán los tamaños que hayas desactivado.
Evita que se creen «otros» tamaños adicionales de tus imágenes
Si, además, quieres evitar que se creen otros tamaños adicionales generados por plugins o el tema, un código como el siguiente puede ayudarte:
/* Evitar que se creen otros tamaños de imagen */
function ayudawp_desactiva_otros_medios_adicionales() {
remove_image_size('post-thumbnail'); // desactiva imágenes añadidas mediante set_post_thumbnail_size()
remove_image_size('otro-tamaño-adicional'); // desactiva cualquier otro tamaño de imagen adicional
}
add_action('init', 'ayudawp_desactiva_otros_medios_adicionales');
Bueno, espero haber aportado algo de luz y paz en esta locura de la generación de tamaños adicionales de imágenes, para que seas tú quien controla WordPress y no al revés.
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
AVISO: Esta publicación hace 3 años o más que no se actualiza. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te sirvió?, pues entonces nada :-)
Si pones botones sociales nos facilitas las cosas para visualizar tus contenidos. Al menos Twitter y Facebook. UX. ¡Gracias!
Están puestos, al final de cada entrada
Ok Gracias. No los había visto. Un abrazo Master.
Yo uso un metodo similar, y para generar las miniaturas en las plantillas que creo para el listado de posts, cabeceras, y de mas, uso el plugin Fly Dynamic Image Resizer. Es genial ya que asi se crean los tamaños adecuados segun las visitas, y solo mantengo un mes las versiones generadas por el plugin, con lo que ahorro espacio y mejoro un poco la carga de la web.
Tengo que probar Flying Images by WP Speed Matters, que hace algo parecido, pero a traves de un cdn. No me convence del todo la idea, ya que no se si puedo tener el mismo control que con Fly Dynamic Image Resizer, pero probar es gratis, y es bueno conocer alternativas.
Ese no lo he probado, y mira que he probado varios de la gente de WP Speed Matters, le echaré un vistazo 😉
hola fernando exite algo para eliminar las copias de imagenes que no sirven hoy hay que hacerlo manualmente conectandose por ftp??? las que estan subidas ya???
Sí claro, así: https://ayudawp.com/como-eliminar-las-imagenes-sin-adjuntar-de-entradas-borradas/
Gracias Fernando… Yo creía que los tamaños adicionales eran creados de cara al visitante que visualiza el sitio a través de múltiples dispositivos… pero si he entendido bien, se crean para el webmaster que trabaja desde diferentes dispositivos… ¿Es correcto?
Entonces, si yo solo voy a trabajar desde un PC, podría eliminar los tamaños pequeño y medio creados por WP?
Los tamaños creados por el tema (Divi) supongo que los necesitara para mostrarlos al visitante… ¿No es así?
Gracias de nuevo…
No, es más para el editor, para no insertar en las entradas y páginas imágenes completas que luego el tema redimensione, pero sigan manteniendo el peso, sino para que el peso sea menor, y la carga de página más rápida. Lo que pasa es que luego el tema pasa de esos tamaños y usa los suyos.
Sobre los tamaños adecuados para Divi escribí una guía aquí: https://ayudawp.com/tutorial-divi-todo-lo-que-debes-saber-sobre-los-tamanos-y-uso-de-imagenes/
Excelente articulo Fernando, pero sigo pensando que es más importante preparar y optimizar bien las imágenes a fondo en tamaño y dimensiones y para SEO con alt y nombre de fichero antes de subirlas a WordPress! 😉
Mucha gente no hace eso y las carga tal cual desde cámaras de fotos y luego no saben porqué va tan lenta la web jeje
Un abrazo
Son tácticas diferentes y compatibles entre ellas. Primero sube las imágenes al tamaño menor posible, a la resolución adecuada, pero si además evitas la creación de copias innecesarias mucho mejor 😉
Cuando dices «Evita que se creen los tamaños de los ajustes de medios» y después dices «Si tienes claro que no necesitas ninguno de los tamaños adicionales que crea WordPress…» no me queda claro si esas 7 imágenes son prescindibles y no ocurre nada si deshabilitamos su creación automática o si luego algo no va a funcionar por no haberlas creado.
Un saludo
Normalmente el tema ya crea sus tamaños adicionales, o sino aplica el responsive a las imágenes para que no se salgan del bloque del contenido.
Lo que hay que evitar es que WordPress cree tamaños adicionales que no necesites, o los pones a cero o – también puede hacerse – los personalizas a tamaños que sí te venga bien tener.
Articulo muy interesante Fernando. Como todos !
Gracias por tus consejos.
Estoy enganchado a «Tu dosis diaria de WordPress»
Un saludo
Muchas gracias 🙂
Fernando, excelente post y muy útiles tus tips! A propósito de imágenes, tengo un pequeño problema: cuando comparto el enlace de mi sitio web se agregan automáticamente el logo o una imagen de la pagina de inicio y además el primer párrafo. De verdad, que no causa buena impresión. ¿A que se debe esto? ¿Cómo lo corrijo? Gracias por tu ayuda!
Eso debes controlarlo con el plugin de SEO, en los ajustes sociales generales, y luego puedes personalizarlo en cada entrada. Es algo que explico en detalle en mi curso de SEO para WordPress
Gracias, Fernando. Excelente tema, en el que no había pensado. Mi duda es: si Wordpress y los themes crean esas copias de imágenes para optimizar la carga del sitio, ¿al eliminar esas copias no nos cargaremos algo de la web? ¿o esta abrirá más lento? Gracias y un abrazo
No y no, solo si cambias de tema hay que regenerar miniaturas con el plugin Regenerate Thumbnails. https://ayudawp.com/regenerar-miniaturas-de-wordpress/
hola fernando esto repercute al feed cuando se envían mails de cada entrada???
Negativamente en nada
es que tengo un problema ahora se ven mas grandes las imagenes en feed pero no se como ajustar al tamaño que quiero para los mails tienes algún tutorial???
Muchas gracias, Fernando por compartirlo.
Conocía todos excepto el de poner 0 en el tamaño de las imágenes. Gran aporte!
No te acostarás sin saber una cosa más 🙂
Hola Fernando, gracia por aportar luz a este mundo que es WordPress.
Mi duda, despues de leer estas fantásticas líneas, es, después de tener imágenes subidas a la web, hago estos cambios para evitar que WordPress haga tantas copias, ¿tengo que borrar de manera manual las que ya tiene creadas?
Puedes hacerlo. Si borras la original te borra las copias, pero si la necesitas para una entrada desaparecería. Sino, por FTP o gestor de archivos del hosting puedes borrar las copias manualmente, trabajo arduo donde los haya
Hola Fernando, como siempre excelentes tus post. Gracias a ello tengo un plugin de funciones bien configurado con todos tus tips los cuales funcionan de maravilla. Algo que me ha extrañado con este tema de las imágenes es que he agregado el código completo que mencionas a dicho plugin y con los ajustes a 0 desde siempre en ajustes de medios, veo que WP me sigue generando imágenes. Debo aclarar que utilizo el tema Extra de Divi. Por ejemplo ahora las imagenes subidas por ej. de 799x518px me generan 7 imágenes de: 150×150, 400×250, 400×284, 400×516, 400×264, 400×440 y 627×376 es normal esto?
Como comento en la guía, no solo WordPress crea copias, también el tema, WooCommerce si lo tienes, algunos plugins. Hay que revisar los functions.php del tema y alguno más para ver qué copias hacen
Realizando una búsqueda, porque acabo de salir de un problema similar, te sugiero utilizar este plugin: Disable Generate Thumbnails
https://wordpress.org/plugins/disable-generate-thumbnails/
Funciona muy bien(como Disable Media Sizes), aparte de los que mencionan en el Post(7 thumbails), también te muestra cada medida de los generados por temas o Plugins para un mejor control, y hace un muy buen dúo con «Regenerate thumbails» para un control preciso (agregar o eliminar).
Muchísimas gracias por el comentario, me estaba volviendo loco con este tema de las versiones de imágenes ya que no me funcionaba nada… hasta que probé el plugin que comentas ¡Funciona genial!
En prueba el código Amigo Fernando,
Lo estoy utilizando en localhost y me esta funcionando muy bien hasta ahora. Con las entradas de blog solo me queda la que cargo como foto de portada. Por ahí esta bien…
Seguiré en prueba con el resto del sitio.
Gracias por tomarte el tiempo de solucionar estos problemas.
Todas las fotos que se crearon antes de configurar estos ajustes, hay formas de eliminarlas?
Hola, un par de plugins de Yith me generan imágenes adicionales como ser 18×18, 25×25 y varias más. He probado ambos códigos y se me siguen generando esos tamaños al subir las fotos. ¿Se te ocurre alguna otra solución?
Quitar la función que genere esos tamaños si no los necesitas. Si tienes dudas pregunta a soporte de Yith, son muy eficientes
Pude solucionarlo, era un problema de nombre de las imágenes, usé otro plugin para identificar bien el nombre de cada una.
Buenos días Fernando, te posteo aquí porque ya no se que hacer. Me explico: Trabajo con Wordpress, el tema es Hueman, sobre el que tengo el tema hijo.
Llevo con una pagina desde el 2009 y, lógicamente, ya los archivos rondan los 262K por lo que ahora si, no me puedo permitir la creación de multitud de imágenes al subir una, teniendo en cuenta que existen del orden de 23K de ellas (sin contar los inmensos creados por Wordpress.
He introducido el código que tienes en este post, he subido y activado el Disable Media Sizes, y nada de nada, siguen apareciendo las imágenes redimensionadas, lógicamente y antes de todo esto, he desactivado todos los plugins.. etc. Bien, como es ilógico todo esto, cambie de Tema, y voilà!!, solo aparecieron las dos que quería, la miniatura y la original.
La functions.php del tema Hueman esta limpio, no hay trampa para el tema de las imágenes por lo que te pregunto: Se te encendería una bombillita para indicarme por donde tirar?
Disculpa por la parrafada y te envio saludos!!
Hola Manuel,
No solo el tema crea tamaños, también hay montones de plugins que crean adicionales. De todos modos, mira a ver si en en functions del tema hay alguna referencia a otro archivo, lo mismo está por ahí la función que las crea, sino toca revisar plugins, o desactivar, activar uno, subir imagen para probar, y así sucesivamente, hasta dar con el culpable
Gracias Fernando, eso es lo que llevo haciendo estos dos últimos días, iniciando por la desactivación de los plugins, etc etc.
Ahora mismo estoy precisamente con las llamadas a los functions del tema, esto haciendo un barrido uno por uno. Esperemos tener buena vista y verlo pronto. Gracias por tu pronta respuesta.
Un saludo
Hay cosas que no queda más que echarle horas … o preguntar a los distintos desarrolladores, algunos contestan y te ahorran tarea, quién mejor que ellos para saber lo que hace su tema o plugin.
¿Hay manera de elimar todos los tamaños creados extras hasta ahora y dejar solo las imágenes que se usan?
El plugin Regenerate Thumbnails Advanced v2.4.0 (a partir de la versión 2.5.0 sólo en la versión premium) tiene una función para eliminar los tamaños que no se utilicen.
NO sabía ni que había versión premium. Gracias por compartirlo 🙂
Buenos dias Fernando, tengo una duda, ya utilicé el servicio Regenerate Thumbnails Advanced v2.4.0, pero el problema es que tengo un plugin de galeria que si utiliza las imagenes, y no tengo claro cuales.
Mi pregunta es si borro manualmente las imagenes creadas ( las variantes) y solo conservo el original subido, que me puede pasar?
Pues no lo he probado nunca, yo no lo haría en la web real, haría una copia y probaría ahí.
Hacé click derecho sobre la imagen en cuestión y fijate en el nombre aparece la resolución p.e.: imagen-100×100
Una duda ¿Ejecutando regenerar los thumbnails, con plugins que lo hacen por ejemplo, borrará los que había y deja solo los que hayas habilitado? O sea… Para imágenes nuevas bien pero ¿Para limpiar lo que ya había, cómo se podría hacer?
¡Gracias!
Hola Taisa,
Que va, no borra, para eso tienes que tirar de algún sistema de borrado de medios huérfanos como este: https://wordpress.org/plugins/cleanup-orphan-images/
Si, en Opciones avanzadas debes tildar la opción «Borrar miniaturas sin seleccionar».
También te recomiendo tildar la opción «Limpiar metadatos desconocidos»
Asegurate de seleccionar del lado derecho los tamaños que necesites y deseleccionar los que no quieras que queden.
Pues gracias, porque no me había fijado en eso 😉
Por nada. Estamos para colaborar siempre que podamos. Saludos.