Autoredimensionar imágen destacada en wordpress y recortarla si es necesario

Cuando elegimos instalar o crear un template o tema para WordPress, puede que en algún momento nos percatemos de algunas deficiencias, sobretodo si es instalado. En caso de que queramos crear nuestro propio tamaño de imágen destacada que se ajuste y recorte automáticamente este artículo es para tí.

Utilizando este método, conseguiremos una mayor facilidad de uso, por que puede que no seamos los únicos que estamos escribiendo en el blog, y por que no todos los redactores tienen por qué saber editar imágenes, o simplemente por que si puede hacerlo nuestro sistema es tiempo que ahorramos y despues de unos cuantos artículos ese tiepo es muy valioso.

Como auto redimensionar imágenes destacadas y auto recortarlas en WordPress

Los pasos son muy sencillos pero vas a tener que editar un par de archivos en la carpeta de tu tema, vamos a suponer que nuestro tema se llama mitema y vamos a empezar desde ahí:

1. Editar el archivo functions
   Lo primero será abrir el siguiente archivo para editarlo
   /wp-content/themes/mitema/functions.php
   Ahora vamos a buscar esta línea (en caso de no estar nos iremos al final del documento)

   add_theme_support( 'post-thumbnails' );

2. Añadimos el nuevo thumbnail
   Justo detrás del código que hemos visto en el punto anterior vamos a colocar un código similar al que voy a explicar ahora

   add_image_size($name, $width, $height, $cropBoolean);

   En este código lo que hacemos es añadir un nuevo tamaño de imágen a la hora de subirlas, de esta forma WordPress redimensionará y recortará la imágen. Los puntos que se pueden configurar son los siguientes

   • $name: es el nombre que vamos a dar a la variable de imágen, con el que luego cargaremos la miniatura desde el frontend.
   • $width: es la anchura en pixeles de nuestra imágen.
   • $height: es la altura que queremos para nuestra imágen, y la parte que recortará por arriba y abajo será la diferencia entre este tamaño y el real de la imágen.
   • $cropBoolean: esta parte es la que se encargará de recortar la imágen, si ponemos true la recortará, si ponemos false no lo hará

   Por tanto ahora sabiendo lo que hace cada cosa vamos a crear nuestra propia miniatura, imaginemos que queremos una imágen que ocupe el ancho de nuestra columna de artículo (supongamos 500px) y que sea de 150 pixeles de alto. Entonces usaremos un código así:

   add_image_size('nuestroNombreDestacado', 500, 150, true);

   NuestroNombreDestacado lo puedes cambiar por el valor que tú quieras, siempre y cuando no coincida con otros add_image_size que haya definidos, lo mejor es que te lo inventes.

3. Colocar la imágen en nuestra plantilla
   Ahora que ya tenemos definido el nuevo tamaño, nos iremos por ejemplo a la página principal

   /wp-content/theme/mitema/index.php

   y colocaremos la siguiente porción de código donde queramos que aparezca nuestra imágen destacada

   <?php the_post_thumbnail('nuestroNombreDestacado'); ?>

   Recuerda colocar el nombre que te hayas inventado. Con este código ya veremos que aparecerá la imágen destacada.

Esto solo tiene un par de inconvenientes, y es que por un lado solo recortará las imágenes que subamos a partir de ahora, es decir, que si tenemos artículos con imágenes destacadas publicadas nos tocará volver a ponerlas. Por otro lado debemos tener en cuenta, que las imágenes que subamos deben tener al menos la anchura que hayamos definido, en este caso 500px, ya que sino aparecerán más pequeñas, y también debemos tener en cuenta que el recorte se hace tomando como referencia el centro de la imágen, quitando por arriba y por abajo la misma cantidad de pixeles, así que deberemos tenerlo presente al subir las imágenes.

Con estos simples pasos podremos crear los tamaños de imágenes que necesitemos. Si tienes alguna sugerencia de como mejorar o alternativas para hacerlo deja tu comentario.