2026年5月20日

2026年5月20日

add_image_sizeでWordPressにカスタム画像サイズを追加する方法と再生成

WordPress は画像をアップロードすると、「設定」→「メディア」で決めたサムネイル・中サイズ・大サイズなどの縮小画像を自動で作ります。add_image_size() を使うと、ここに独自のサイズを追加できます。記事一覧のカード画像や OGP 画像のように、決まった縦横比の画像が欲しいときに使います。

この記事のコードと結果は、2026年11月時点の WordPress 7.1(PHP 8.3、画像処理は Imagick)で確かめました。

add_image_size の書き方

add_image_size( $name, $width, $height, $crop );
引数 内容
$name サイズの名前(例: card-16-9)。テンプレートで呼び出すときに使う
$width 幅(px)。0 なら幅を制限しない
$height 高さ(px)。0 なら高さを制限しない
$crop 切り抜くかどうか。false(既定)は縮小のみ、true は中央で切り抜き、配列で切り抜き位置を指定

縮小(false)と切り抜き(true)の違い

  • false(縮小のみ): 縦横比を保ったまま、幅と高さの両方が指定値に収まるように縮小します。2000×1500 の画像を 800, 0, false で縮小すると 800×600 になります。
  • true(切り抜き): 指定の幅と高さちょうどの画像を作ります。縦横比が違う部分は中央を基準に切り落とされます。2000×1500 の画像を 640, 360, true にすると 640×360 になります。
  • 配列(切り抜き位置): array( 'center', 'top' ) のように、横方向(left・center・right)と縦方向(top・center・bottom)の基準を指定します。人物の顔が写真の上のほうにある場合などに使います。

サイズを登録する

次のコードを、子テーマの functions.php か、自作プラグインのファイルに書きます。サイズはアップロード時に作られるので、画像を使うテーマとセットで管理するのが自然です。

<?php
add_action( 'after_setup_theme', function () {
	add_theme_support( 'post-thumbnails' );

	// OGP・SNS シェア用(1200×630 に切り抜く)
	add_image_size( 'og-image', 1200, 630, true );

	// 記事一覧のカード(16:9 に切り抜く)
	add_image_size( 'card-16-9', 640, 360, true );

	// 正方形。上端を基準に切り抜く(人物の顔が上にある写真向け)
	add_image_size( 'square-top', 400, 400, array( 'center', 'top' ) );

	// 幅 800px に縮小。高さは縦横比のまま(0 = 制限しない)
	add_image_size( 'content-800', 800, 0, false );
} );

add_theme_support( 'post-thumbnails' ) はアイキャッチ画像を使えるようにする指定です。テーマがすでに有効にしていれば不要です。

このコードを入れてから 2000×1500 の JPEG をアップロードすると、標準のサイズに加えて og-image(1200×630)、card-16-9(640×360)、square-top(400×400)、content-800(800×600)が作られました。

元の画像が小さいときは拡大されない

WordPress は縮小画像を作るときに拡大はしません。上と同じ設定で 500×300 の画像をアップロードすると、次のようになりました。

  • og-image(1200×630)と card-16-9(640×360)は作られない
  • square-top(400×400)は、高さが足りないため 400×300 で作られる

作られなかったサイズをテンプレートで指定すると、元の画像(500×300)がそのまま使われます。決まった大きさで表示したい場面では、指定サイズ以上の画像をアップロードするか、CSS で表示の大きさをそろえます。

テンプレートで使う

<?php
// アイキャッチ画像を card-16-9 サイズで表示(ループ内)
the_post_thumbnail( 'card-16-9' );

// 添付ファイル ID から img タグを出力
$thumb_id = get_post_thumbnail_id();
echo wp_get_attachment_image( $thumb_id, 'card-16-9', false, array(
	'class' => 'card-image',
) );

// URL と幅・高さだけ取り出す
$image = wp_get_attachment_image_src( $thumb_id, 'og-image' );
if ( $image ) {
	list( $url, $width, $height ) = $image;
	echo '<meta property="og:image" content="' . esc_url( $url ) . '">';
}

wp_get_attachment_image() と the_post_thumbnail() は、width・height 属性と、同じ縦横比の他のサイズを並べた srcset 属性を自動で付けます。loading="lazy" も WordPress が自動で付けるので、普通は指定しなくてかまいません。

og:image の例は書き方の参考です。SEO プラグインが OGP タグを出力している場合は、二重にならないようにプラグインの設定側で画像を指定してください。

ブロックエディターの「解像度」に追加する

追加したサイズは、そのままでは画像ブロックの設定に出てきません。image_size_names_choose フィルターで名前を付けると、画像ブロックの「解像度」の選択肢に加わります。

<?php
add_filter( 'image_size_names_choose', function ( $sizes ) {
	return array_merge( $sizes, array(
		'card-16-9'   => 'カード(640×360)',
		'content-800' => '本文幅(800px)',
	) );
} );

選べるのは、その画像で実際に作られたサイズだけです。

使わないサイズを作らない

WordPress は標準で、サムネイル・中・大のほかに、幅 768px の medium_large、長辺 1536px の 1536x1536、長辺 2048px の 2048x2048 も作ります(後の2つは WordPress 5.3 で追加)。使わないサイズは intermediate_image_sizes_advanced フィルターで外すと、アップロード時の処理とディスク容量を減らせます。

<?php
add_filter( 'intermediate_image_sizes_advanced', function ( $sizes ) {
	unset( $sizes['medium_large'] ); // 幅 768px
	unset( $sizes['1536x1536'] );
	unset( $sizes['2048x2048'] );
	return $sizes;
} );

このフィルターを入れて 2000×1500 の画像をアップロードすると、3つのサイズは作られませんでした。ただし、高解像度の画面向けの srcset に使える大きな画像も減ります。表示幅の広いテーマでは、残すかどうかを決めてから外してください。

テーマやプラグインが追加したサイズを取り消すには、そのサイズより後に remove_image_size( 'サイズ名' ) を実行します。

登録されているサイズを確かめる

wp media image-size --format=table

名前・幅・高さ・切り抜き(hard は切り抜き、soft は縮小)が一覧で出ます。この一覧は登録されたサイズを表示するもので、上のフィルターで作らないようにしたサイズも表示されます。

PHP から確かめる場合は、wp_get_registered_image_subsizes() がサイズ名と幅・高さ・切り抜きの配列を返します。

既存の画像に新しいサイズを作る(再生成)

サイズを追加しても、すでにアップロード済みの画像には新しいサイズは作られません。WP-CLI の wp media regenerate で作り直します。作業前にバックアップを取ってください。

# 足りないサイズだけを作る(既存のファイルは消さない)
wp media regenerate --only-missing --yes

# 特定のサイズだけを作り直す
wp media regenerate --image_size=card-16-9 --yes

# 添付ファイル ID を指定して作り直す(投稿 ID ではない)
wp media regenerate 123 124

オプションを付けずに wp media regenerate --yes を実行すると、古い縮小画像を消してから作り直します。登録を外したサイズのファイルも消えるため、本文の中でそのサイズの画像 URL を直接使っていると、画像が表示されなくなります。消したくない場合は --skip-delete を付けるか、上の --only-missing を使います。

WP-CLI が使えないサーバーでは、再生成用のプラグイン(「Regenerate Thumbnails」など)を使う方法もあります。

注意すること

  • サイズを1つ増やすごとに、アップロード1枚あたりの画像ファイルが1つ増えます。実際にテンプレートで使うサイズだけを登録します。
  • サイズ名にはスペースを入れず、英数字とハイフンで付けると扱いやすくなります。
  • テーマを変えると、そのテーマの functions.php で登録したサイズは新しくアップロードする画像に作られなくなります。テーマに依存しないサイズは、プラグインで登録します。

関連記事

お気軽にご相談ください

お見積りへ お問い合わせへ
▲