概要
add_image_size 関数は、WordPress においてカスタム画像サイズを設定するために使用されます。この関数を用いることで、投稿やページにアップロードされた画像に対して、必要なサイズのサムネイルを自動的に生成することができます。以下はこの関数がよく使われる機能の例です:
- ギャラリーのレイアウトに合わせた画像サイズの設定
- モバイルデバイス用の最適化された画像サイズの作成
- 特定のテーマデザインに合わせたカスタムサムネイルの追加
- レスポンシブ画像の管理
- 画像の読み込み速度を改善するためのサイズ調整
- ポートフォリオや製品ページ用のサムネイルサイズのカスタマイズ
- ソーシャルメディアでのシェア画像サイズの設定
- 検索エンジン最適化 (SEO) のための適切な画像サイズの管理
構文
add_image_size( $name, $width, $height, $crop );
パラメータ
$name(string): 定義する画像サイズの名前。$width(int): 画像の幅。$height(int): 画像の高さ。$crop(boolean|array): 画像を切り取るかどうか。切り取りの設定が必要な場合はtrueを指定。
戻り値
この関数は戻り値を持たず、画像サイズを登録するために使用されます。
関連する関数
バージョン情報
add_image_size関数は、WordPress 2.9から使用可能です。
コアファイルパス
この関数は、WordPress のコアファイル wp-includes/media.php に含まれています。
この関数のアクションでの使用可能性
| アクション | 使用例 |
|---|---|
| mu_plugin_loaded | |
| registered_post_type | |
| plugins_loaded | 〇 |
| wp_roles_init | |
| setup_theme | |
| after_setup_theme | 〇 |
| set_current_user | |
| init | |
| register_sidebar | |
| wp_loaded | |
| send_headers | |
| parse_query | |
| pre_get_posts | |
| wp | |
| template_redirect | |
| get_header | |
| wp_head |
サンプルコード
サンプルコード1: 基本的な使用法
function my_custom_image_sizes() {
add_image_size( 'custom-size', 800, 600, true );
}
add_action( 'after_setup_theme', 'my_custom_image_sizes' );
このコードは、800×600ピクセルのサイズで画像を切り取るカスタム画像サイズ custom-size を追加します。
サンプルコード2: 複数サイズの追加
function my_additional_image_sizes() {
add_image_size( 'small-thumbnail', 150, 150, true );
add_image_size( 'medium-thumbnail', 300, 300, true );
}
add_action( 'after_setup_theme', 'my_additional_image_sizes' );
このサンプルは、2つの異なるカスタム画像サイズを追加しています。150×150ピクセルと300×300ピクセルのサムネイルを作成します。
サンプルコード3: レスポンシブ画像サイズ
function responsive_image_sizes() {
add_image_size( 'responsive-size', 1000, 9999, false );
}
add_action( 'after_setup_theme', 'responsive_image_sizes' );
このコードは、レスポンシブデザイン用に、高さを制限せずに幅1000ピクセルのカスタムサイズを追加します。
サンプルコード4: 固定比率の画像サイズ
function fixed_ratio_image_size() {
add_image_size( 'fixed-ratio', 400, 300, array( 'center', 'top' ) );
}
add_action( 'after_setup_theme', 'fixed_ratio_image_size' );
このコードは、400×300ピクセルの画像サイズを追加し、画像を中央上部で切り取る設定をしています。
サンプルコード5: ギャラリー用サイズ
function gallery_image_sizes() {
add_image_size( 'gallery-size', 600, 400, true );
}
add_action( 'after_setup_theme', 'gallery_image_sizes' );
これは、ギャラリー表示用に600×400ピクセルのカスタム画像サイズを追加するサンプルです。