web-dev-qa-db-ja.com

最大限の比例サイズが生成される画像サイズを追加する

4：3の縦横比を保ちながら、結果の画像が可能な限り最大のサイズになるように画像サイズを追加したいと思います。

以下のように画像サイズを追加したとします。

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

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

しかし、私のフルサイズの画像の幅が1000ピクセルしかないとします。私はまだ可能な限り最大の4：3の比率、この場合は1000 x 750になるように画像をトリミングしたいと思います。

これはできますか？

imagesadd-image-size
7
Chris Montgomery

アプローチ

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

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

数学

まず最初に、特定の比率に対して最大サイズを返すクラスを書きましょう。

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つを使用してまとめて再生成する必要があります。

10
gmazzap