ワードプレスのadd_image_size関数の使用方法・解説

概要

add_image_size 関数は、WordPress においてカスタム画像サイズを設定するために使用されます。この関数を用いることで、投稿やページにアップロードされた画像に対して、必要なサイズのサムネイルを自動的に生成することができます。以下はこの関数がよく使われる機能の例です:

  1. ギャラリーのレイアウトに合わせた画像サイズの設定
  2. モバイルデバイス用の最適化された画像サイズの作成
  3. 特定のテーマデザインに合わせたカスタムサムネイルの追加
  4. レスポンシブ画像の管理
  5. 画像の読み込み速度を改善するためのサイズ調整
  6. ポートフォリオや製品ページ用のサムネイルサイズのカスタマイズ
  7. ソーシャルメディアでのシェア画像サイズの設定
  8. 検索エンジン最適化 (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ピクセルのカスタム画像サイズを追加するサンプルです。

この関数について質問する


上の計算式の答えを入力してください