Programmatische Größenänderung von Bildern in WordPress

Wenn Sie jemals mit der programmgesteuerten Größenänderung von Bildern in WordPress arbeiten mussten, dann sind Sie vielleicht auf die Funktion image_resize gestoßen.

Außerdem wissen Sie vielleicht, dass es veraltet ist (da dies oben auf dem Bildschirm angezeigt wird):

Diese Funktion ist veraltet. Verwenden Sie stattdessen wp_get_image_editor().

Und mit seiner Abwertung, wie es bei all jenen der Fall ist, die gute Arbeit bei der Abwertung von Funktionalität leisten, ist es nicht ohne Ersatz.

In diesem Fall sprechen wir über den WP Image Editor. Dies ist eine Klasse in WordPress, die wir verwenden können, um die gleichen Operationen durchzuführen, um die Größe von Bildern programmgesteuert zu ändern, die wir früher mit der ursprünglichen Funktion konnten.

Um es klarzustellen, dieser spezielle Beitrag ist kein vollständiges Tutorial zur Verwendung der WP_Image_Editor.

Stattdessen ist es eine einfache Anleitung, wie man es verwendet, um die Größe von Bildern anstelle einer veralteten Funktion zu ändern, zusammen mit einigen Erläuterungen, wie man mit Fällen umgeht, in denen Fehler auftreten können.

Das zu verwendende Bild finden

Je nachdem, was Sie tun, können Sie den Dateinamen des Bildes möglicherweise von WordPress selbst abrufen. In diesem Beispiel werde ich jedoch einfach den Pfad zu einer Datei fest codieren.

Dies ist der einfachste Weg, um zu erklären, wie man die Klasse verwendet, anstatt auf eine Tangente zu gehen, um ein Bild programmgesteuert abzurufen, seinen Pfad zu erhalten, es an die Editor-Klasse zu senden und so weiter.

Nehmen wir also an, der angegebene Pfad zum Bild ist etwa so:

<?php

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

Damit speichern wir es in einer Variablen, die wir an eine andere Funktion übergeben können, falls wir die Originaldatei mehrmals bearbeiten möchten.

Abrufen einer Instanz des Bildeditors

Als nächstes müssen Sie eine Instanz der Bildbearbeitungsklasse abrufen, damit Sie das Bild bearbeiten können, das sich im obigen Pfad befindet. In seiner einfachsten Form ist es nichts anderes, als einen Dateinamen an eine Funktion und dann ein Array von Argumenten zu übergeben.

In diesem Beitrag geht es mir nicht um die Reihe von Argumenten – nur darum, eine Instanz des Editors zu erhalten, mit der ich die Größe eines Bildes ändern kann.

Um eine Instanz dieses Editors abzurufen, tun Sie einfach Folgendes:

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

Dies gibt entweder eine Instanz des Editors oder eine Instanz von zurück **[WP_Error](https://developer.wordpress.org/reference/classes/wp_error/)**(zusammen mit einer Fehlermeldung und anderen Informationen, die Sie verwenden können, um das Problem zu bestimmen). Es ist immer gut zu überprüfen, ob der zurückgegebene Wert ein Fehler ist, und alle zukünftigen Operationen anzuhalten.

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

Unter der Annahme, dass kein Fehler vorliegt, können Sie jedoch damit beginnen, die Größe des Bildes zu ändern.

Größe des Bildes ändern

Glücklicherweise ist dies etwas, das einfach zu tun ist. Sie benötigen drei Informationen:

1. Breite,
2. Höhe,
3. und ob Sie das Bild zuschneiden möchten oder nicht.

Meiner Erfahrung nach ist das Zuschneiden des Bildes fast immer besser als nicht, da es seltsame Dehnungen oder Verzerrungen bei ungeraden Seitenverhältnissen vermeidet.

Wenn ich die Größe des Bildes verändere, erhalte ich immer gerne die aktuelle Größe des Bildes und verwende dann einen Multiplikator, um die neuen Abmessungen zu erstellen, um die ich das Bild verkleinern möchte.

Angenommen, ich habe ein Bild und möchte die Breite um 40 % und die Höhe um 30 % ändern. Dazu muss ich:

1. holen Sie sich die Größe des aktuellen Bildes,
2. Verwenden Sie die neue Breite und Höhe, um die Größe des Bildes zu ändern.

Programmatisch würden Sie dies folgendermaßen tun:

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

Einfach genug zu folgen, nicht wahr?

Speichern des Bildes

Zum Schluss muss nur noch das Bild gespeichert werden. In diesem Fall wird das Bild in das Upload-Verzeichnis geschrieben (und normalerweise das Jahr und den Monat, die WordPress bereitstellt).

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

Sie können dann die endgültige Version basierend auf ihrer Ausgabe in der Größe angepasst (und entsprechend benannt) sehen.