Resumen: Cómo cambiar el tamaño de las imágenes en WordPress (paso a paso)
WordPress tiene un editor de imágenes integrado que te permite cambiar el tamaño, recortar, rotar, voltear y restaurar imágenes sin necesidad de plugins adicionales. Así es como funciona el proceso.
- Abre la Biblioteca de Medios: Ve a Medios » Biblioteca en tu panel de WordPress.
- Haz clic en Editar imagen: Selecciona tu imagen y luego haz clic en el botón Editar imagen.
- Escalar para cambiar el tamaño: Introduce el ancho deseado en Escalar imagen y haz clic en Escalar.
- Recortar, rotar o voltear: Usa los botones de la barra de herramientas para realizar ediciones adicionales visualmente.
- Guarda tus cambios: Haz clic en Guardar para aplicar las ediciones y actualizar el archivo almacenado.
- Restaura si es necesario: Usa Restaurar imagen original para deshacer todos los cambios a la vez.
¿Intentas averiguar cómo cambiar el tamaño de una imagen en WordPress sin romper tu diseño o ralentizar tu sitio?
Me he encontrado con este problema más veces de las que puedo contar. Ya fuera al añadir imágenes al blog, fotos de productos o logotipos, las imágenes demasiado grandes siempre ralentizaban la página y quedaban mal. Fue entonces cuando empecé a usar el editor de imágenes integrado de WordPress, que es más rápido que la mayoría de los plugins y hace bien su trabajo.
En esta guía, te mostraré exactamente cómo cambiar el tamaño, recortar, voltear y rotar imágenes en WordPress. También aprenderás a deshacer esos cambios si es necesario. No necesitarás herramientas ni código adicionales. Solo unos pocos clics dentro de tu panel.
- ¿Por qué debería cambiar el tamaño de las imágenes en WordPress?
- ¿Cuál es el mejor tamaño de imagen para WordPress?
- ¿Cómo cambio el tamaño de una imagen en WordPress?
- ¿Cómo puedo recortar una imagen en WordPress?
- Cómo rotar y voltear imágenes en WordPress
- ¿Puedo deshacer ediciones de imágenes en WordPress?
- ¿Qué pasa con la compresión de imágenes y WebP?
- Preguntas Frecuentes
- Controla tus imágenes con SeedProd
¿Por qué debería cambiar el tamaño de las imágenes en WordPress?
Cambiar el tamaño de las imágenes que añades a WordPress es importante por dos razones: evita que tu sitio se ralentice por el peso de los archivos de imagen grandes y ahorra espacio en tu servidor de alojamiento.
Si utilizas fotos de stock de alta calidad o imágenes de tu cámara, es probable que el tamaño de tu archivo de imagen sea mucho mayor de lo que tu sitio necesita. Dimensiones de imagen más pequeñas significan tiempos de carga más rápidos, lo que evita que los visitantes reboten.
Te mostraré cómo encontrar tu ancho ideal en la siguiente sección.
¿Cuál es el mejor tamaño de imagen para WordPress?
Las dimensiones de imagen adecuadas dependen de dónde aparezca la imagen y del tema que utilices. Dicho esto, existen puntos de partida ampliamente utilizados que funcionan en la mayoría de los temas de WordPress.
| Tipo de imagen | Ancho recomendado | Notas |
|---|---|---|
| Imagen destacada | 1200px de ancho | Se utiliza en la compartición social y listados de blogs; 1200x628px es el estándar |
| Imagen del cuerpo de la entrada del blog | 800px de ancho | Cabe cómodamente en la mayoría de las columnas de contenido |
| Miniatura | 150x150px | Predeterminado de WordPress; se usa en widgets y archivos |
| Banner / encabezado | 1920px de ancho | Fondos de ancho completo; comprime mucho para reducir el tamaño del archivo |
Las columnas de contenido en los temas populares de WordPress tienen entre 650px y 800px de ancho. La forma más rápida de comprobar el tuyo es hacer clic derecho en cualquier lugar de tu sitio y seleccionar Inspeccionar en Chrome.
Pasa el ratón sobre tu área de contenido y busca la columna resaltada en azul. La información sobre herramientas muestra el ancho en píxeles. Ese número es tu ancho máximo de imagen para las imágenes del cuerpo.
Una vez que conozcas tu ancho objetivo, estarás listo para redimensionar.
¿Cómo cambio el tamaño de una imagen en WordPress?
Redimensionar imágenes con WordPress es sencillo. Ve a Medios » Biblioteca desde tu panel de administración de WordPress.
Sube o haz clic en la imagen que deseas redimensionar en WordPress.
Desde aquí, haz clic en Editar imagen.
Debajo del encabezado Escalar imagen, puedes reducir el tamaño de la imagen introduciendo nuevas dimensiones. Esta herramienta reduce la imagen sin recortar nada, y WordPress mantiene automáticamente la relación de aspecto correcta.
Si solo introduces un ancho, la altura se calculará automáticamente basándose en la proporción de la imagen o viceversa.
En el primer cuadro, introduce el ancho de tu área de contenido. Si no estás seguro de cuál es, usa la herramienta Inspeccionar de Chrome: haz clic derecho en tu sitio, selecciona Inspeccionar, luego pasa el ratón sobre tu columna de contenido. La información sobre herramientas muestra el ancho en píxeles. No se necesita código.
Cuando hayas terminado, haz clic en Escalar para redimensionar la imagen.
Para usar la imagen redimensionada, vuelve a la página de detalles de la imagen y copia la URL como se muestra en la captura de pantalla a continuación.
¡Eso es todo! Ahora has usado WordPress para redimensionar una imagen, y puedes usarla donde quieras.
Para darte una idea de cómo el redimensionamiento afecta la velocidad de tu página, aquí tienes resultados de pruebas que comparan la imagen original y la redimensionada cargadas en una publicación de blog estándar.
Usamos la herramienta de prueba de velocidad de sitios web de Blog Tyrant para este ejemplo.
Aquí está el resultado de la prueba del tamaño de imagen original cuando se añade a una entrada de blog estándar.
Y aquí están los resultados para la imagen redimensionada.
Incluso las pequeñas diferencias en el tamaño de la imagen suman rápidamente. Nuestra imagen original era de 2,5 MB; después de redimensionarla, se redujo a 280 KB. Eso es una reducción del 90% en el tamaño del archivo.
En un sitio con docenas de imágenes, esos ahorros hacen que tus páginas carguen más rápido y evitan que los visitantes se vayan.
WordPress también te permite recortar, rotar y voltear imágenes. Sigue leyendo para saber cómo.
¿Cómo puedo recortar una imagen en WordPress?
Para recortar una imagen en WordPress, seguiremos los mismos primeros pasos que para redimensionar. Ve a Medios » Biblioteca, haz clic en la imagen que deseas recortar y haz clic en Editar imagen.
A continuación, haz clic y arrastra el ratón sobre la imagen para empezar a recortar. Recortar significa cortar los bordes no deseados para centrarse en una parte específica de la imagen.
Puedes hacer clic en cualquiera de los pequeños cuadrados para ajustar el área recortada o mover el área por la imagen. Una vez que estés satisfecho, haz clic en el icono Recortar como se muestra a continuación.
Ahora haz clic en Guardar. Has recortado tu imagen.
Selecciona la URL en la página de detalles de la imagen para usar la imagen recortada.
Cómo rotar y voltear imágenes en WordPress
Rotar y voltear imágenes se encuentran en el mismo editor de imágenes. Primero, ve a Medios » Biblioteca, elige tu imagen y haz clic en Editar imagen.
Rotar una imagen
Haz clic en los botones Rotar a la izquierda o Rotar a la derecha para rotar tu imagen 90 grados a la vez.
Si te equivocas, no entres en pánico. Haciendo clic en el botón Deshacer se restablecerá la imagen al último paso.
Haz clic en Guardar cuando estés contento.
Voltear una imagen
Voltear una imagen funciona de la misma manera. Desde el editor de imágenes, haz clic en el botón Voltear verticalmente o Voltear horizontalmente. Voltear espejea la imagen: verticalmente significa boca abajo, horizontalmente significa de izquierda a derecha.
Haz clic en Guardar cuando hayas terminado.
¿Puedo deshacer ediciones de imágenes en WordPress?
Todos cometemos errores. Si has recortado el área equivocada o has escalado la imagen demasiado pequeña, hay una forma de hacerlo con un solo clic para volver al original.
Mira en el lado derecho de la pantalla de edición de imágenes. Verás un encabezado titulado Restaurar imagen original.
Hacer clic aquí revela un botón que te permite restaurar la imagen a su tamaño original.
Haz clic en Restaurar imagen para deshacer todos los cambios. Esto devuelve la imagen exactamente como estaba cuando la subiste por primera vez, eliminando cualquier recorte, volteo, rotación o cambio de tamaño que hayas realizado.
¿Qué pasa con la compresión de imágenes y WebP?
Redimensionar una imagen cambia sus dimensiones. La compresión reduce su tamaño de archivo sin cambiar las dimensiones. Ambas son importantes para la velocidad del sitio y funcionan mejor juntas.
Después de redimensionar una imagen en WordPress, el tamaño del archivo disminuye. Pero la compresión puede reducirlo aún más, a menudo entre un 50 y un 80 % sin pérdida de calidad visible. He probado esto en mi propio sitio y la diferencia en el tiempo de carga es notable, especialmente en páginas con muchas imágenes.
La forma más fiable de comprimir imágenes en WordPress es con un plugin dedicado. Dos que vale la pena probar son Imagify y Smush. Ambos comprimen las imágenes automáticamente al subirlas, por lo que no tienes que hacer nada adicional después de la configuración inicial.
Una cosa más que vale la pena saber: WordPress admite la carga de imágenes WebP desde la versión 5.8. Los archivos WebP suelen ser entre un 25 y un 35 % más pequeños que los JPEG con el mismo nivel de calidad. Si tu tema y tu pila de alojamiento lo admiten, subir imágenes en formato WebP es una de las formas más sencillas de optimizar imágenes para WordPress sin tocar ninguna configuración.
Preguntas Frecuentes
¿WordPress redimensiona automáticamente las imágenes al subirlas?
Sí. WordPress crea varios tamaños de imagen automáticamente cada vez que subes una imagen. Por defecto, genera versiones en miniatura (150x150px), medianas (300px de ancho), grandes (1024px de ancho) y de tamaño completo. Tu tema utiliza estos tamaños generados automáticamente en diferentes lugares, como miniaturas en listados de blogs o imágenes de encabezado de ancho completo. La herramienta Escalar imagen en el editor de imágenes solo cambia el archivo original almacenado, no estos tamaños generados automáticamente.
¿Cuál es el mejor tamaño de imagen para WordPress?
Depende de dónde aparezca la imagen. Un buen punto de partida general: imágenes destacadas a 1200x628px, imágenes del cuerpo de las entradas del blog a 800px de ancho y miniaturas a 150x150px. La forma más fiable de encontrar el ancho de contenido exacto de tu tema es usar la herramienta Inspeccionar de Chrome, hacer clic derecho en tu área de contenido y leer el ancho en píxeles de la información sobre herramientas.
¿Cuál es la diferencia entre redimensionar y comprimir una imagen en WordPress?
Redimensionar cambia las dimensiones de la imagen (ancho y alto en píxeles). La compresión reduce el tamaño del archivo sin cambiar las dimensiones, eliminando datos que el ojo no puede detectar fácilmente. Ambas afectan la velocidad de la página, pero de diferentes maneras. Redimensionar con el editor integrado se encarga de las dimensiones. Un plugin de compresión como Imagify o Smush se encarga del tamaño del archivo. Para obtener los mejores resultados, haz ambas cosas.
¿Puedo redimensionar varias imágenes a la vez en WordPress?
El editor de imágenes integrado de WordPress solo redimensiona una imagen a la vez. Para redimensionar en bloque, necesitas un plugin. El plugin Regenerate Thumbnails te permite regenerar todos los tamaños de imagen a la vez después de cambiar la configuración de tus medios. Para redimensionar en bloque a una dimensión específica, plugins como Imsanity redimensionan las imágenes automáticamente al subirlas según un ancho máximo que establezcas.
Controla tus imágenes con SeedProd
Redimensionar imágenes en la Biblioteca de medios te proporciona archivos limpios y optimizados. Pero si quieres un control total sobre cómo aparecen esas imágenes en tus páginas, ese es un problema diferente.
El creador de sitios web de arrastrar y soltar de SeedProd te permite colocar y dimensionar imágenes exactamente donde las necesitas. Puedes ajustar el ancho, establecer la alineación, añadir espaciado y ver cada cambio en vivo antes de publicarlo. Sin conjeturas, sin refrescar para ver cómo queda.
Si estás reconstruyendo una página o creando una desde cero, vale la pena intentarlo.
Si buscas más ayuda con imágenes y medios en WordPress, consulta las siguientes guías:
- Cómo añadir una galería a las páginas de WordPress
- Cómo añadir una imagen destacada en WordPress
- Cómo Cambiar el Diseño del Blog en WordPress
- Cómo incrustar vídeo en WordPress
- Cómo cambiar las fuentes en los temas de WordPress
¡Gracias por leer! Nos encantaría conocer tu opinión, así que únete a la conversación en YouTube, X y Facebook para obtener más consejos y contenido útil para hacer crecer tu negocio.
Hola, estoy intentando cambiar el tamaño de una imagen y probé a usar la opción Editar imagen como muestras arriba. Desafortunadamente, WordPress dice 'No se puede crear una imagen nueva'. ¿Podrías ayudarme con eso?
Hola,
La razón más probable es no tener instalado mod-gd.
Si estás trabajando en línea con una empresa de hosting y tienes Cpanel como plataforma de hosting, puedes habilitar este módulo en Cpanel a través de
PHP Selector—> extensiones—> gd.
Avísame si tienes alguna otra pregunta.
Saludos cordiales,
El cambio de tamaño no hizo nada. A menos que me haya saltado un paso, seguí tus instrucciones y la imagen se mantuvo del mismo tamaño que antes.
Sí, lo intenté de nuevo. Esto no está cambiando el tamaño para mí.
Hola Travis,
Para que podamos ayudarte más, ¿te importaría decirnos si recibes algún error al editar/guardar una imagen?
Gracias,
Esto ya no funciona en wp.com. Cuando hago clic en la imagen, "editar imagen" está en la parte superior. Cuando hago clic en eso, solo me permite rotar, recortar o voltear. He estado usando wp durante años y siempre he encontrado una manera de sortear esto. Ahora, parece que el único método es editarlo sin conexión antes de subirlo.
¿Me estoy perdiendo algo?
Hola Scott,
Primero, ¿puedo confirmar si estás usando la versión gratuita de WordPress.com o la versión autoalojada de WordPress.org? Esta guía está dirigida a las versiones autoalojadas de WordPress. También es una buena idea verificar que tu instalación de WordPress esté actualizada para cualquier problema.
Hola, estoy intentando añadir imágenes a través de un widget en la parte inferior de mi página web, pero en la página web aparecen más grandes que la imagen original importada, lo que hace que la imagen sea menos nítida. Redimensioné las imágenes aproximadamente 190/50 y 90/90 (para logotipos redondos) antes de añadirlas a mi biblioteca. ¿Cómo puedo ajustar la imagen en la página web para que aparezca como el tamaño de la imagen original importada? ¿Lo ajusto en el tema de la página web? ¿Qué me falta aquí?
Hola Dann,
Si subes una imagen, puedes editarla aquí: https://a.supportally.com/oCDtrF
La opción de subir una imagen usando tamaños como miniatura/mediana/grande, etc. ya no está presente usando los bloques de Gutenberg. Puedes instalar el editor clásico para que aparezca esta opción: https://a.supportally.com/OZ9Pyz
Saludos cordiales,
Hola. He estado usando la versión gratuita de WordPress durante más de 10 años y puedes imaginar que he estado muy descontento con su nueva interfaz últimamente. Entonces, una pregunta rápida: ¿se deshicieron de la opción para establecer tamaños de imagen como Grande, Mediana, Pequeña y Miniatura? Juro que ya no la encuentro en el menú habitual ni manipulando los "bloques" de imagen/galería.
Hola Emerson,
Si entiendo correctamente tu pregunta. Los bloques a los que te refieres son los bloques de imagen/galería de Gutenberg de WordPress y no sobre el plugin SeedProd, ¿correcto? Si es así, sí, la opción no está disponible usando los bloques de Gutenberg. Puedes cambiar el tamaño de la imagen usando el enlace Editar. Mira aquí: https://a.supportally.com/oCDtrF
O puedes instalar el plugin Classic Editor. La opción de subir imágenes usando diferentes tamaños todavía está disponible.
Saludos cordiales,
Intenté redimensionar un jpg que actualmente es de 850 x 369. Cuando intento reducirlo, dice que el archivo está restringido a 800 de ancho. La imagen aparece demasiado grande a 850 y 800. ¿Qué puedo hacer?
Hola Brenna, podrías intentar editar la imagen en un editor de imágenes en línea o en un software de edición de imágenes para reducir el tamaño del archivo y luego volver a subirla a tu sitio web.
Sé que debería haber empezado mi blog con imágenes más pequeñas, pero ahora la página carga muy pequeña. ¿Hay alguna forma de subir nuevas imágenes (que sean más pequeñas) sin necesidad de reformatear cada publicación?
Hola Adam. Puedes probar uno de estos plugins de compresión de imágenes. Muchos optimizan automáticamente las imágenes sin que necesites volver a subirlas.
8 de mayo de 2023
No hay "escalar imagen" en la función de editar imagen, ni hay nada que se pueda ajustar con respecto al tamaño de la imagen. Tampoco parece que pueda editar el tamaño de la imagen en un editor de publicaciones usando html. Parece que simplemente no hay forma visible de hacerlo... PERO sé que debe haber una manera o muchos abandonarían wp. ¿Puedes ayudarme a resolver esto? Tu publicación puede estar desactualizada porque wp no quiere permitir a los usuarios redimensionar o escalar imágenes. Pero, ¿cómo es eso un buen plan de negocios? Frustrada en Massachusetts
Hola Michael, la configuración que ves dentro del editor de imágenes puede verse diferente si estás usando WordPress.com, la versión alojada, en comparación con WordPress.org, la versión autoalojada. Puedes aprender la diferencia entre ambas aquí. Si sigues teniendo problemas, te sugerimos que te pongas en contacto con los foros de soporte de la plataforma WordPress correspondiente.
Esto da en el clavo... exactamente lo que necesitaba y cambiaré a .org usando tu tremenda guía. ¡Gracias!
¡Me alegra mucho que esto te haya ayudado! Si necesitas algo más, no dudes en preguntar.
Hola Stacey, ¿hay algún paso después de escalar y "copiar" el enlace? Sigo estos pasos pero mis imágenes no están escaladas en mi publicación.
Saludos
Hola Laura,
Asegúrate de que después de escalar tu imagen, salgas de la publicación en la que estás trabajando y actualices tu página, luego edita la publicación de nuevo y agrega tu imagen. A veces necesita una pequeña actualización para mostrarse con la nueva versión escalada. ¡Espero que esto ayude!