Como ya sabrás, cuando subes una imagen a tu sitio WordPress este, además de la imagen a su tamaño original crea otras copias, algunas de las cuales se generan a partir de tus ajustes de medios.
Otras de estas copias a distintos tamaños se generan desde el tema, o incluso plugins que tengas instalados, para distintos usos.
Esto lo hace para que, aunque subas una imagen enorme desde tu cámara o móvil, siempre dispongas de tamaños (y pesos) menores de imágenes que utilizar en vez del tamaño completo, lo que ralentizaría la carga de tus páginas si pesa mucho el archivo.
Por supuesto, puedes desactivar la creación de estos tamaños adicionales que crea WordPress, pero aquí te quiero proponer un enfoque distinto, y es redimensionar la imagen completa al tamaño grande que tengas especificado en tus Ajustes > Medios de WordPress.
De este modo, si configuras ese ajuste, digamos, al ancho máximo que necesitarás para tus entradas o páginas, conseguiremos que tengas menos copias de imágenes, y que la mayor sea más pequeña, y menos pesado el archivo. Buena idea ¿verdad?
Índice de contenidos
Redimensionando las imágenes subidas con un poco de código
Pues bien, un modo de conseguirlo es nada menos que añadir un poquito de código a tu plugin de personalizaciones, este:
/** Redimensionar al subir la imagen completa al tamaño grande de los ajustes de medios */
function ayudawp_reemplazar_imagen_subida($image_data) {
// si no hay imagen grande : return
if (!isset($image_data['sizes']['large'])) return $image_data;
// ruta a la imagen subida y a la imagen grande
$upload_dir = wp_upload_dir();
$uploaded_image_location = $upload_dir['basedir'] . '/' .$image_data['file'];
$large_image_location = $upload_dir['path'] . '/'.$image_data['sizes']['large']['file'];
// borramos la imagen subida
unlink($uploaded_image_location);
// renombramos la imagen grande
rename($large_image_location,$uploaded_image_location);
// actualizamos los metadatos de la imagen y terminamos
$image_data['width'] = $image_data['sizes']['large']['width'];
$image_data['height'] = $image_data['sizes']['large']['height'];
unset($image_data['sizes']['large']);
return $image_data;
}
add_filter('wp_generate_attachment_metadata','ayudawp_reemplazar_imagen_subida');Guardas los cambios en tu plugin y ya lo tienes. He comentado en el código lo que hace cada parte, para los curiosos.
Redimensionando las imágenes subidas con un plugin
Y, si no te animas con el código, también tienes el plugin llamado Resize Image After Upload que, una vez instalado y activo, te permite configurar desde sus ajustes el tamaño máximo al que se redimensionará, e incluso algún ajuste adicional sobre el nivel de compresión de las imágenes.
Como ves, podemos controlar prácticamente todo en WordPress, y en este caso, esta sencilla estrategia nos será de mucha ayuda, sobre todo en sitios donde haya varios autores a los que nos cueste «educar» en subir imágenes a tamaños razonables.
Es, sin darte cuenta, un truco que también sirve para mejorar el WPO de tu WordPress.
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
Muy bueno Fernando, lo voy a tener en cuenta para la actualización de la web que pronto llevaré a cabo.
Me alegra que te sirva 🙂
Este redimensionamiento no afecta la calidad de las imágenes que se muestran en el sitio?
Sobre optimización de imágenes, yo tiro siempre de la versión premium de Smush It, Fernando. No se si la has probado, pero si es que sí me interesaría mucho conocer tu opinión.
En todo caso, gracias por el artículo, se que me será útil antes o después.
Pues la he usado durante tiempo hasta que SiteGround añadió a su plugin SG Optimizer la optimización de imágenes en directo y me quedé gratamente sorprendido de su efectividad, y gratis
Gracias, me tomo nota!
Gracias crack 🙂
El truco parece bueno Fernando. Pero permíteme una pregunta: ¿Afecta también a todas las imágenes existentes (y las añade redimensionadas aumentando así el tamaño de la carpeta uploads ) o solamente a las que se suban después de utilizar el código o el plugin? Gracias.
Solo afecta a las nuevas
Gracias por el aporte Fernando, como siempre. Lo de redimensionar correctamente las imágenes es vital, sobre todo cuando se deja parte de la gestión de la web en mano al cliente.