概要
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ピクセルのカスタム画像サイズを追加するサンプルです。