Tutoriales WordPress

Cómo Mostrar Imágenes a Tamaño Completo en WordPress (4 Métodos)

¿Quieres aprender a mostrar imágenes a tamaño completo en WordPress?

La última versión de WordPress redimensiona automáticamente las imágenes grandes para mejorar el rendimiento. Sin embargo, a veces es necesario mostrar imágenes de mayor tamaño.

En este tutorial, compartiremos cuatro maneras diferentes de mostrar imágenes de tamaño completo en su sitio de WordPress.

¿Por qué WordPress reduce el tamaño de las imágenes grandes?

Las versiones anteriores de WordPress permitían a los usuarios subir imágenes con dimensiones muy grandes.

Pero, lo que ocurrió es que los principiantes de WordPress subían imágenes que eran simplemente demasiado grandes para la web moderna. Las imágenes grandes conducen a una velocidad de carga lenta del sitio web y a un bajo rendimiento.

Para solucionar este problema, la actualización de WordPress 5.3 cambió la forma en que WordPress maneja las imágenes muy grandes.

Por ejemplo, si usted sube una imagen con las dimensiones de 5000px por 7000px, entonces WordPress redimensionará la imagen a 2560px y escalará el ancho para igualar las dimensiones originales.

Ahora, cuando un usuario visite una página con una imagen previamente grande, verá la versión reducida de esa imagen.

Esto conduce a un mejor rendimiento del sitio web y a usuarios más felices en general.

Razones para evitar que WordPress escale las imágenes

Esta nueva función es útil para la mayoría de los propietarios de sitios web de WordPress, pero algunos usuarios pueden necesitar mostrar imágenes a tamaño completo.

Por ejemplo, si usted es un fotógrafo o artista que vende su trabajo, entonces puede querer mostrar imágenes más grandes en su sitio web, para que los visitantes puedan comprarlas o descargarlas.

O bien, puedes tener un sitio web en el que las imágenes de mayor tamaño son un requisito, como un sitio web de fotos de archivo o un sitio web que vende impresiones e imágenes personalizadas.

No importa la razón por la que quieras una imagen de tamaño completo, te mostraremos cómo hacerlo, paso a paso.

Cómo mostrar imágenes a tamaño completo en WordPress (4 métodos)

Hay 4 maneras diferentes de mostrar imágenes de tamaño completo en WordPress.

Algunos métodos funcionan mejor para imágenes individuales, mientras que otros son mejores para una biblioteca de imágenes completa.

Usted querrá elegir el método de imágenes a tamaño completo que sea adecuado para sus objetivos

Método 1: Obtener la URL de la imagen a tamaño completo en WordPress

Si sólo quieres usar una o dos imágenes grandes en tu sitio web, entonces esta solución es probablemente la mejor.

Cuando subes una imagen a WordPress que excede las dimensiones, WordPress escalará tu imagen y creará una nueva. Pero, la imagen original sigue intacta.

Para mostrar las dimensiones originales de la imagen, tendrá que eliminar ‘-scaled‘ del final de la URL de la imagen de WordPress e insertar la imagen en su sitio con el enlace modificado.

Simplemente dirígete a tu biblioteca de medios yendo a Medios > Biblioteca y selecciona tu imagen grande.

Ahora, localiza tu ‘URL de archivo’ en el cuadro de la imagen.

A continuación, querrás eliminar ‘-scaled’ del final de la URL de tu imagen.

Después, puedes copiar la URL de la imagen e insertarla en tu sitio web.

Ten en cuenta que tendrás que incrustar la imagen en tu sitio utilizando el enlace, menos la parte escalada.

Para ello, ve a una publicación o página a la que quieras añadir la imagen y haz clic en el icono “+” para añadir un nuevo bloque.

A continuación, haz clic en el icono “Imagen” para añadir un bloque de imágenes en el que puedes pegar tu URL.

Haz clic en “Insertar desde la URL”, pega la URL de tu imagen a tamaño completo en el cuadro y pulsa “Intro”.

A continuación, deberás hacer clic en “Publicar”, o en “Actualizar”, si la publicación ya está activa, y tu imagen de tamaño completo podrá verse ahora en tu sitio.

Puedes seguir este mismo proceso para cada imagen de tamaño completo que quieras añadir a tu sitio. Pero, siempre que utilices la URL del archivo menos ‘escalada’, tus imágenes de WordPress se mostrarán en tamaño completo.

Método 2: Desactivar automáticamente el escalado de imágenes en WordPress (con un plugin)

El segundo método consiste en utilizar un plugin de WordPress para deshabilitar el escalado de imágenes en su sitio.

El plugin que recomendamos se llama Disable “BIG Image” Threshold. Este plugin ofrece una de las soluciones más fáciles para mostrar imágenes grandes en su sitio, y es totalmente gratuito.

En primer lugar, tendrás que instalar y activar el plugin Disable “BIG Image” Threshold. Para más detalles sobre la instalación de un plugin, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez que hayas instalado y activado el plugin en tu sitio, éste eliminará automáticamente el umbral de imágenes grandes añadido por WordPress.

Podrás añadir nuevas imágenes tal y como lo hacías antes de la actualización de imágenes de WordPress.

Cuando este plugin esté activo, WordPress no añadirá el atributo ‘-scaled’ a ninguna imagen.

Método 3: Desactivar automáticamente el escalado de imágenes grandes en WordPress (con un fragmento de código)

Otra opción es añadir un fragmento de código a WordPress que logre el mismo objetivo que el plugin anterior.

Si el plugin no funciona por alguna razón, o no quiere instalar demasiados plugins, entonces puede utilizar este método.

La nueva función de escalado de imágenes de WordPress utiliza un filtro llamado big_image_size_threshold.

Querrás usar el siguiente código para desactivar esta función:

add_filter( 'big_image_size_threshold', '__return_false' );

Necesitas añadir este código en el archivo functions.php de tu tema.

Método 4: Abrir las imágenes de WordPress a tamaño completo en un lightbox

La última opción es añadir un lightbox de imágenes de tamaño completo a su sitio. Con esta solución, usted obtiene lo mejor de ambos mundos.

Puedes cargar miniaturas de imágenes más pequeñas en el contenido de tu blog, galería o carrusel, y al hacer clic, aparecerá tu imagen a tamaño completo.

Para ello, recomendamos utilizar el plugin Envira Gallery. Es el mejor plugin de galería de imágenes para WordPress del mercado y te permite añadir fácilmente el efecto de imagen emergente lightbox.

Lo primero que tienes que hacer es instalar el plugin Envira Gallery. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Después de instalar, active el plugin.

Ten en cuenta que antes de subir imágenes de tamaño completo para tu galería, tendrás que desactivar el escalado de imágenes a través del plugin o de los métodos del tema hijo mencionados anteriormente.

De lo contrario, tus imágenes de lightbox utilizarán la versión reducida de la imagen.

Por último, es importante tener en cuenta que si añades imágenes de grandes dimensiones, es esencial optimizarlas para la web, para no ralentizar tu sitio web.

Esperamos que este artículo te haya ayudado a mostrar imágenes de tamaño completo en WordPress.

Publicidad

Síguenos en Facebook