WordPress - 自動生成される画像を停止・追加する方法

1. 画像の自動生成について

WordPress では、メディアに画像をアップロードすると自動で複数のサイズの画像を生成します。下記の表は、各サイズの画像をアップロードした時に自動生成された画像の表になります。

サイズ 3000 x 3000 (1:1) 3000 x 2000 (3:2) 1000 x 3000 (1:3)
150 (サムネイル) 150 x 150 150 x 100 50 x 150
300 (中サイズ) 300 x 300 300 x 200 100 x 300
768 768 x 768 768 x 512 768 x 2304
1024 (大サイズ) 1024 x 1024 1024 x 683 341 x 1024
1536 1536 x 1536 1536 x 1024 512 x 1536
2048 2048 x 2048 2048 x 1365 683 x 2028
フルサイズ 3000 x 3000 3000 x 2000 1000 x 3000

*「サムネイルを実寸法にトリミングする」のチェックは外しています。

自動生成されるサイズの上限は 2048px のようです。なので、2048px 以上の画像をアップロードした場合、フルサイズも含めて 7 種類の画像が自動生成されます。サイズが小さい画像の場合、例えば、200px の画像をアップロードした場合は、200px 以下の画像サイズ(ここでは 150px)しか自動生成されない仕組みになっています。

2. 自動生成される画像を停止する方法

すべてのサイズ(フルサイズ以外)の自動生成を停止したい場合は下記をfunctions.phpに追加します。

//functions.php
function remove_image_sizes($sizes) {
  unset( $sizes['thumbnail'] );
  unset( $sizes['medium'] );
  unset( $sizes['medium_large'] );
  unset( $sizes['large'] );
  unset( $sizes['1536x1536'] );
  unset( $sizes['2048x2048'] );
  return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced', 'remove_image_sizes' );

自動生成させたいサイズがある場合、例えば、サムネイルだけは自動生成したい場合、unset( $sizes['thumbnail'] );の部分を削除すればサムネイルだけは自動生成してくれるようになります。

intermediate_image_sizes_advanced | WordPress Developer Resources

3. 自動生成される画像を追加する方法

//functions.php
add_image_size( '$name', $width, $height, $crop );

$name - 任意の名前を設定します。thumbnail などもう使われている名前は使えません。
$width, $height - 画像のサイズを設定します。(初期値:0)
$crop - 画像のトリミングの方法を設定します。(初期値:false)

  • false - サイズ変更のみ
  • true - サイズ変更と画像の中央を指定してトリミング
  • array ( x, y ) - トリミングの位置を指定
//functions.php
add_image_size( 'custom_image_size', 500, 500, array( 'left', 'top' ) );
//functions.php
add_image_size( 'custom_image_size', 500, 500, array( 'left', 'top' ) );

500px のサイズで左上を起点にトリミング指定をした場合だと上記のようになります。

独自に追加した画像サイズも自動生成される画像と同様に、「ファイル名-500x500.png」というファイル名で自動生成されます。

add_image_size() | WordPress Developer Resources

4. 投稿画面から独自サイズやミディアムラージサイズを使えるようにする

alt

独自に追加した画像サイズや普段は表示されない medium_large(768px)などを投稿画面で選択できるようにしたい場合は下記をfunctions.phpに追加します。

独自サイズは(ここでは custom_image_size)add_image_size()$nameの部分を使います。

//functions.php
function image_size_names($sizes) {
  return array_merge( $sizes, array(
    'thumbnail'          => __( 'サムネイル' ),
    'medium'             => __( '中' ),
    'medium_large'       => __( 'ミディアムラージ' ),
    'large'              => __( '大' ),
    'full'               => __( 'フルサイズ' ),
    'custom_image_size'  => __( 'カスタムイメージ' ),
  ));
}
add_filter('image_size_names_choose', 'image_size_names');

自動生成を停止していない場合はサムネイル、中、大、フルサイズは勝手に表示されるので実際には下記だけで大丈夫です。

//functions.php
function image_size_names($sizes) {
  return array_merge( $sizes, array(
    'medium_large'       => __( 'ミディアムラージ' ),
    'custom_image_size'  => __( 'カスタムイメージ' ),
  ));
}
add_filter('image_size_names_choose', 'image_size_names');

image_size_names_choose | WordPress Developer Resources