Programowa zmiana rozmiaru obrazów w WordPress

Jeśli kiedykolwiek musiałeś pracować z programową zmianą rozmiaru obrazów w WordPressie, być może natknąłeś się na funkcję image_resize.

Co więcej, możesz wiedzieć, że został wycofany (biorąc pod uwagę, że pojawia się u góry ekranu):

Ta funkcja została wycofana. Zamiast tego użyj wp_get_image_editor().

A wraz z jego deprecjacją, jak to jest w przypadku wszystkich tych, którzy dobrze sobie radzą z deprecjonowaniem funkcjonalności, nie jest bez zastąpienia.

W tym przypadku mówimy o edytorze obrazów WP. Jest to klasa w WordPress, której możemy użyć do wykonania tych samych operacji, aby programowo zmienić rozmiar obrazów, co kiedyś mogliśmy z oryginalną funkcją.

Żeby było jasne, ten konkretny post nie jest pełnym samouczkiem na temat korzystania z WP_Image_Editor.

Zamiast tego jest to prosty przewodnik, jak używać go do zmiany rozmiaru obrazów zamiast przestarzałej funkcji, wraz z kilkoma wyjaśnieniami, jak radzić sobie z przypadkami, w których mogą wystąpić błędy.

Znajdowanie obrazu do użycia

W zależności od tego, co robisz, możesz być w stanie pobrać nazwę pliku obrazu z samego WordPressa; jednak w tym przykładzie zamierzam po prostu zakodować ścieżkę do pliku.

Jest to najłatwiejszy sposób na wyjaśnienie, jak używać klasy w porównaniu do stycznej, jak programowo pobrać obraz, uzyskać jego ścieżkę, wysłać go do klasy edytora i tak dalej.

Załóżmy więc, że podana ścieżka do obrazka wygląda mniej więcej tak:

<?php

$filename = '/Users/tommcfarlin/Projects/acme/wp-content/uploads/2018/06/original-image.jpg';
if (!file_exists($filename)) {
  return;
}

Używając tego, przechowamy go w zmiennej, którą możemy przekazać do innej funkcji na wypadek, gdybyśmy chcieli wielokrotnie operować na oryginalnym pliku.

Uzyskiwanie instancji edytora obrazów

Następnie musisz pobrać instancję klasy edytora obrazów, aby móc operować na obrazie znajdującym się na powyższej ścieżce. W swojej najbardziej podstawowej formie jest to nic innego jak przekazanie nazwy pliku do funkcji, a następnie tablicy argumentów.

W tym poście nie zajmuję się tablicą argumentów – tylko pobraniem instancji edytora, za pomocą której mogę zmienić rozmiar obrazu.

Aby pobrać instancję wspomnianego edytora, po prostu zrób to:

<?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() );

Spowoduje to zwrócenie instancji edytora instancji **[WP_Error](https://developer.wordpress.org/reference/classes/wp_error/)**(wraz z komunikatem o błędzie i innymi informacjami, których możesz użyć do określenia problemu). Zawsze dobrze jest sprawdzić, czy zwracana wartość jest błędem i zatrzymać wszelkie przyszłe operacje.

<?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.
}

Zakładając jednak, że nie ma błędu, możesz rozpocząć pracę nad zmianą rozmiaru obrazu.

Zmiana rozmiaru obrazu

Na szczęście jest to łatwe. Potrzebujesz trzech informacji:

1. szerokość,
2. wzrost,
3. i czy chcesz przyciąć obraz.

Z mojego doświadczenia wynika, że ​​przycinanie obrazu jest prawie zawsze lepsze niż nie, ponieważ pozwala uniknąć dziwnego rozciągania lub zniekształcania w dziwnych proporcjach.

Podczas zmiany rozmiaru obrazu zawsze lubię uzyskać aktualny rozmiar obrazu, a następnie użyć mnożnika, aby utworzyć nowe wymiary, według których chcę zmienić rozmiar obrazu.

Załóżmy na przykład, że mam obraz i chcę zmienić rozmiar o 40%, a wysokość o 30%. Aby to zrobić, muszę:

1. uzyskać rozmiar aktualnego obrazu,
2. użyj nowej szerokości i wysokości, aby zmienić rozmiar obrazu.

Programowo możesz to zrobić w następujący sposób:

<?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);

Wystarczająco łatwe do naśladowania, prawda?

Zapisywanie obrazu

Na koniec jedyne, co pozostało, to zapisanie obrazu. W takim przypadku obraz zostanie zapisany w katalogu uploads (i zwykle roku i miesiącu zapewnianym przez 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.
}

Następnie możesz zobaczyć ostateczną wersję zmienioną (i odpowiednio nazwaną) na podstawie jej danych wyjściowych.