Cambiar el tamaño de las imágenes mediante programación en WordPress
Si alguna vez ha tenido que trabajar con el cambio de tamaño de las imágenes mediante programación en WordPress, es posible que haya encontrado la función image_resize.
Además, es posible que sepa que ha quedado obsoleto (dado que esto aparece en la parte superior de la pantalla):
Esta función ha quedado obsoleta. Utilice wp_get_image_editor() en su lugar.
Y con su desaprobación, como ocurre con todos aquellos que hacen un buen trabajo desaprobando la funcionalidad, no deja de tener su reemplazo.
En este caso, estamos hablando del WP Image Editor. Esta es una clase en WordPress que podemos usar para realizar las mismas operaciones para cambiar el tamaño de las imágenes mediante programación que alguna vez pudimos con la función original.
Para ser claros, esta publicación en particular no es un tutorial completo sobre cómo usar el archivo WP_Image_Editor.
En cambio, es una guía simple sobre cómo usarlo para cambiar el tamaño de las imágenes en lugar de una función obsoleta junto con algunas explicaciones sobre cómo manejar los casos en los que puede haber errores.
Encontrar la imagen a usar
Dependiendo de lo que esté haciendo, es posible que pueda recuperar el nombre de archivo de la imagen desde el mismo WordPress; sin embargo, para este ejemplo, simplemente codificaré la ruta a un archivo.
Esta es la forma más fácil de explicar cómo usar la clase en lugar de salirse por la tangente de cómo recuperar una imagen mediante programación, obtener su ruta, enviarla a la clase del editor, etc.
Así que supongamos que la ruta dada a la imagen es algo como esto:
<?php
$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
return;
}Usando eso, lo almacenaremos en una variable que podemos pasar a otra función en caso de que queramos operar en el archivo original varias veces.
Obtener una instancia del editor de imágenes
A continuación, debe obtener una instancia de la clase de editor de imágenes para poder operar en la imagen ubicada en la ruta anterior. En su forma más básica, no es más que pasar un nombre de archivo a una función y luego una serie de argumentos.
En esta publicación, no me preocupa la variedad de argumentos, solo obtener una instancia del editor que pueda usar para cambiar el tamaño de una imagen.
Para tomar una instancia de dicho editor, simplemente haga esto:
<?php
// Grab the editor for the filename of the image.
$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
return;
}
$editor = wp_get_image_editor( $filename, array() );Esto devolverá una instancia del editor de una instancia de **[WP_Error](https://developer.wordpress.org/reference/classes/wp_error/)**(junto con un mensaje de error y otra información que puede usar para determinar el problema). Siempre es bueno verificar si el valor devuelto es un error y detener cualquier operación futura.
<?php
// Grab the editor for the file and the size of the original image.
$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
return;
}
$editor = wp_get_image_editor( $filename, array() );
if (is_wp_error($editor)) {
// handle the problem however you deem necessary.
}Sin embargo, suponiendo que no haya ningún error, puede comenzar a trabajar para cambiar el tamaño de la imagen.
Cambiar el tamaño de la imagen
Afortunadamente, esto es algo que es fácil de hacer. Necesitas tres datos:
- ancho,
- altura,
- y si desea o no recortar la imagen.
En mi experiencia, recortar la imagen casi siempre es mejor que no hacerlo porque evita cualquier estiramiento o distorsión extraños en proporciones de aspecto extrañas.
Al cambiar el tamaño de la imagen, siempre me gusta obtener el tamaño actual de la imagen y luego usar un multiplicador para crear las nuevas dimensiones por las que quiero cambiar el tamaño de la imagen.
Por ejemplo, digamos que tengo una imagen y quiero cambiar el tamaño del ancho en un 40 % y el alto en un 30 %. Para hacer esto, necesito:
- obtener el tamaño de la imagen actual,
- use el nuevo ancho y alto para cambiar el tamaño de la imagen.
Programáticamente, así es como lo harías:
<?php
// Grab the editor for the file and the size of the original image.
$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
return;
}
$editor = wp_get_image_editor( $filename, array() );
if (is_wp_error($editor)) {
// Handle the problem however you deem necessary.
}
// Get the dimensions for the size of the current image.
$dimensions = $editor->get_size();
$width = $dimensions['width'];
$height = $dimensions['height'];
// Calculate the new dimensions for the image.
$newWidth = 0.4 * $width;
$newHeight = 0.3 * $height;
// Resize the image.
$result = $editor->resize($newWidth, $newHeight, true);Bastante fácil de seguir, ¿no?
Guardar la imagen
Finalmente, todo lo que queda es guardar la imagen. En este caso, la imagen se escribirá en el directorio de cargas (y generalmente el año y el mes que proporciona WordPress).
<?php
// Grab the editor for the file and the size of the original image.
$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
return;
}
$editor = wp_get_image_editor( $filename, array() );
if (is_wp_error($editor)) {
// handle the problem however you deem necessary.
}
// Get the dimensions for the size of the current image.
$dimensions = $editor->get_size();
$width = $dimensions['width'];
$height = $dimensions['height'];
// Calculate the new dimensions for the image.
$newWidth = 0.4 * $width;
$newHeight = 0.3 * $height;
// Resize the image.
$result = $editor->resize($newWidth, $newHeight, true);
// If there's no problem, save it; otherwise, print the problem.
if (!is_wp_error($result)) {
$editor->save($editor->generate_filename());
} else {
// Handle the problem however you deem necessary.
}Luego puede ver la versión final redimensionada (y nombrada apropiadamente) según su salida.