可能な最大の比例サイズが生成される画像サイズを追加します


8

4:3のアスペクト比を維持しながら、結果の画像が可能な最大サイズになる画像サイズを追加したいと思います。

次のような画像サイズを追加したとします。

add_image_size( 'cover-image', 2048, 1536, true );

デフォルトでは、フルサイズの画像がこれらの寸法よりも大きい場合、WPはそのサイズの画像のみを作成します。

しかし、私のフルサイズの画像は幅が1000pxしかないと仮定します。可能な限り最大の4:3の比率に画像をトリミングしたいのですが、この場合は1000x750になります。

これはできますか?

回答:


11

アプローチ

画像のサイズを変更する直前に、「オンザフライ」で画像サイズを作成するのが最善の方法だと思います。

'intermediate_image_sizes_advanced'フィルターフックを使用してそれを行うことができます。これにより、生成されるサイズを編集できますが、現在の画像サイズに注意$metadataして、2番目の引数としてフィルターによって渡される配列に格納されます。

数学

まず、特定の比率で最大のサイズを返すクラスを作成しましょう。

class ImageRatio {

  private $ratio;

  function __construct($ratioW = 4, $ratioH = 3) {
    $this->ratio = array($ratioW, $ratioH);
  }

  function getLargestSize($imgW, $imgH) {
    $inverse = false;
    // let's try to keep width and calculate new height  
    $newSize = round(($this->ratio[1] * $imgW) / $this->ratio[0]);
    if ($newSize > $imgH) {
       $inverse = true;
       // if the calculated height is bigger than actual size
       // let's keep current height and calculate new width
       $newSize = round(($this->ratio[0] * $imgH) / $this->ratio[1]);
    }

    return $inverse ? array( $newSize, $imgH ) : array( $imgW, $newSize );
  }

}

クラスの使い方

クラスの使い方はとても簡単です:

$ratio = new ImageRatio(4, 3)

$ratio->getLargestSize(1000, 500); // return: array(667, 500)
$ratio->getLargestSize(1000, 800); // return: array(1000, 750)

実行中

この時点で、クラスを使用して、アップロードされている画像に基づいて、新しい画像サイズを即座に計算できます。

add_filter( 'intermediate_image_sizes_advanced', function( $sizes, $metadata ) {

   if (! empty( $metadata['width'] ) && ! empty( $metadata['height'] ) ) {
      // calculate the max width and height for the ratio
      $ratio = new ImageRatio( 4, 3 );
      list($width, $height) = $ratio->getLargestSize( 
         $metadata['width'],
         $metadata['height']
      );
      // let's add our custom size
      $sizes['biggest-4-3'] = array(
        'width'  => $width,
        'height' => $height,
        'crop'   => true
      );
   }

   return $sizes;

}, 10, 2 );

新しいサイズの使用

$image = wp_get_attachment_image( $attachment_id, 'biggest-4-3' );

注意

もちろん、これはコードを配置したにアップロードするすべての画像で機能します。古い画像の場合は、サムネイルを使用するときにオンザフライで再生成するか、Webで利用可能なプラグインの1つを使用して一括で再生成する必要があります。


これは素晴らしいです、ありがとう!私が行う1つのマイナーな修正:将来他の比率に使用する可能性があるため、コンストラクターでデフォルトの比率を設定する必要はないと思います。インスタンス化時に常に望ましい比率を提供することは理にかなっています。
Chris Montgomery

コンストラクタの引数はデフォルトです。任意の比率を渡すことができ、デフォルトは何も渡さない場合にのみ使用されます
gmazzap
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.