Todo lo que necesitas saber sobre las imágenes en WordPress

Tratar con imágenes en WordPress puede ser un desafío. Si no prestas atención a los requisitos, puedes estropear todo el aspecto de tu sitio o incluso impactar en el tiempo de carga. Por eso necesitas aprender sobre el tamaño estándar de las imágenes de WordPress y cómo cambiarlas. ¡Relájate, toma tu café y aprendamos más!

Cómo WordPress procesa las imágenes

Cuando subes una imagen a la biblioteca multimedia, WorPress genera automáticamente imágenes adicionales con tres tamaños de imagen estándar y las almacena en otro lugar.

Por esta razón, se ven cuatro opciones de imagen cuando se está subiendo una imagen. Las opciones son: miniatura, mediana, grande y tamaño completo.

Las tres primeras opciones se denominan tamaños de imagen estándar de WordPress, mientras que la opción de tamaño completo es el tamaño original de la imagen que has subido.

WordPress crea estas opciones porque el uso de estas imágenes en diferentes lugares para mostrarlas requerirá diferentes tamaños. Por ejemplo, la resolución de la imagen en miniatura puede diferir de la resolución de la imagen utilizada en la diapositiva.

Por lo tanto, no es necesario editar y cambiar el tamaño de las imágenes manualmente si desea utilizar las mismas imágenes en diferentes lugares con diferentes resoluciones. Sólo tienes que añadir una imagen y WordPress hará el resto.

¿Qué es el estándar de tamaño de imagen de WordPress?

De forma predeterminada, WordPress viene con tres tamaños de imagen preestablecidos. Son ellos:

La miniatura: (150px cuadrangular);
Tamaño promedio: (máximo 300px de ancho y alto);
Tamaño grande: (máximo 1024px ancho y alto);
Tamaño original: (tamaño original de la imagen que subió).

Cómo cambiar el estándar de tamaño de imagen de WordPress

Aunque WordPress ya ofrece tres tamaños de imagen estándar, si notas que estas opciones no satisfacen tus necesidades, hay alternativas.

Es posible que necesites imágenes en miniatura más pequeñas o más grandes. Por lo tanto, necesitas cambiar los tamaños de imagen estándar de WordPress. Para ello, siga los siguientes pasos:

Accede al Panel de Administración;
Pase el ratón por Settings -> Media;
En la ventana de Configuración de los medios, puede ajustar el píxel deseado para cada tamaño;
Haz clic en Guardar cambios para terminar.

Cómo añadir un tamaño de imagen personalizado de WordPress

Entonces, tienes los tres tamaños de imagen estándar. Digamos que tienes una imagen de tamaño miniatura para tu miniatura, una imagen de tamaño medio para tu correo y una imagen de tamaño grande para tu diapositiva.

Pero te das cuenta de que necesitas más tamaños de imagen estándar para tu banner, pop-up y widgets. ¿Puedes añadir tamaños de imagen personalizados desde WordPress? Sí que puedes.

Paso 1. Agregar tamaños de imagen personalizados de WordPress mediante el archivo function.php

De hecho, algunos temas ya ofrecen opciones adicionales de tamaño de imagen. Pero si no los encuentras, añade el tamaño de imagen personalizado de WordPress que haremos ahora.

Ahora se ocupará del código. Así que no olvides hacer una copia de seguridad de los archivos y crear un tema de WordPress para niños antes de cualquier cambio.

Ve al panel de administración;
Pase el puntero del ratón en Apariencia -> Editor de temas
Edita el archivo functions.php;
Copia el siguiente guión y pégalo en el archivo add_theme_support( 'pop-up-banner' );
Presiona el botón Actualizar Archivo.
El guión anterior activará la función add_image_size(). Si ya está habilitado, puede agregar nuevas imágenes de WordPress de la siguiente manera:

add_image_size( 'pop-up banner size', 1000, 590 );
add_image_size( 'tamaño del widget', 220, 180 );

En el ejemplo, nombrará los nuevos tamaños como "Tamaño del banner emergente" y "Tamaño del widget". Los siguientes números de tamaño corresponden a la anchura y la altura.

Paso dos. Mostrar las imágenes con tamaños personalizados en su tema

Has añadido con éxito los nuevos tamaños de imagen, pero aún no se muestran en tu tema. Ahora tienes que activar los nuevos tamaños de tu tema.

Primero, haz una copia de seguridad de su sitio antes de cualquier cambio. Accede a tu archivo de temas dentro del bucle de publicación y edítalo. Ahora pega el código:

<?php the_post_thumbnail( 'tu-especifica-talla-de-imagen' ); ?>
Debes cambiar "tu-especificado-tamaño-de-imagen" con el nombre que has definido en el paso anterior. Por ejemplo, puedes cambiarlo al "tamaño del banner emergente".

Después de estos pasos, encontrarás opciones de tamaño de la imagen del banner emergente al cargar las imágenes en tu biblioteca multimedia.

Plugins de ayuda

Has definido un nuevo tamaño de imagen personalizado en WordPress. Sin embargo, este cambio no afectará a sus imágenes anteriores. Para ello, es necesario regenerar los tamaños de imagen anteriores.

Por suerte para ti, no tienes que hacer esto manualmente. Hay un plugin llamado Regenerar miniaturas, que le ayudará a actualizar los tamaños de las imágenes anteriores. Siga los pasos siguientes para hacerlo.

Ve al panel de administración;
Haz clic en Plugins -> Añadir nuevo;
Busca Regenerar las Pulgarcitas;
Instala y activa el plugin;
Ahora ve a Herramientas -> Regenerar miniaturas;
Haga clic en el botón Regenerar miniaturas para los archivos adjuntos X;
Todas las imágenes que subió anteriormente se regenerarán en los nuevos ajustes de imagen.
WordPress regenera el plugin de miniaturas

Conclusión

El tamaño de las imágenes de WordPress parece un pequeño detalle, pero en realidad puede causar un dolor de cabeza. Puede que la imagen que subas no tenga el tamaño requerido.

Para resolver esto, puedes probar dos métodos. Puedes cambiar los tamaños de imagen predeterminados de WordPress o añadir tamaños de imagen personalizados.

Antes de establecer el nuevo tamaño de la imagen, recuerda que enviar imágenes grandes con alta resolución no es una buena idea. Las imágenes de gran tamaño ocupan mucho espacio y retrasan el tiempo de carga de los sitios web.