ワードプレスのwp_constrain_dimensionsフィルタの使用方法・解説

概要

wp_constrain_dimensionsフィルタは、画像やメディアのサイズを制御するために使用されるフックです。このフィルタは、特に縦横比を維持した縮小サイズを取得する際に役立ちます。具体的には、画像が指定された最大幅または最大高さに収まるようにリサイズするための計算をカスタマイズすることができます。

このフィルタは、次のような機能を実装する際によく使われます:

  1. 画像の比率を保ったままリサイズする。
  2. 特定のメディアのアップロード時にカスタムサイズを適用する。
  3. 画像処理プラグインの動作を変更する。
  4. エディターモードや投稿体裁に基づいたサイズ調整。
  5. ユーザーが指定したサイズに合わせた画像を生成する。
  6. テーマが自動的に異なるデバイスサイズに適応させる。
  7. 管理画面での画像プレビューのサイズを調整する。
  8. 外部サービスと連携した画像処理の結果を修正する。

構文

add_filter('wp_constrain_dimensions', 'custom_constrain_dimensions', 10, 3);

パラメータ

  • $dimensions: 画像の現在のサイズ(配列形式)。
  • $max_width: 最大幅。
  • $max_height: 最大高さ。

戻り値

調整後のサイズ(配列形式)。

関連する関数

wp_constrain_dimensions

使用可能なバージョン

このフィルタはWordPress 3.0以降で使用可能です。

コアファイルのパス

/wp-includes/media.php

サンプルコード

サンプルコード1: デフォルトのリサイズ動作を変更する

このサンプルコードは、画像が最大幅500pxに制約されるように設定します。

add_filter('wp_constrain_dimensions', 'resize_image_dimensions', 10, 3);
function resize_image_dimensions($dimensions, $max_width, $max_height) {
    $dimensions['width'] = min($max_width, 500);
    return $dimensions;
}

引用元: https://developer.wordpress.org/reference/hooks/wp_constrain_dimensions/

サンプルコード2: 縦横比を維持した縮小サイズの取得

このコードは、画像の縦横比を保ってリサイズする例です。

add_filter('wp_constrain_dimensions', 'maintain_aspect_ratio', 10, 3);
function maintain_aspect_ratio($dimensions, $max_width, $max_height) {
    $aspect_ratio = $dimensions['width'] / $dimensions['height'];
    if ($dimensions['width'] > $max_width || $dimensions['height'] > $max_height) {
        if ($aspect_ratio > 1) {
            $dimensions['width'] = $max_width;
            $dimensions['height'] = $max_width / $aspect_ratio;
        } else {
            $dimensions['height'] = $max_height;
            $dimensions['width'] = $max_height * $aspect_ratio;
        }
    }
    return $dimensions;
}

引用元: https://www.wpbeginner.com/wp-tutorials/how-to-properly-resize-images-in-wordpress/

サンプルコード3: 固定のサイズへの調整

ここでは、画像を400pxの幅と300pxの高さに強制的にリサイズしています。

add_filter('wp_constrain_dimensions', 'force_specific_size', 10, 3);
function force_specific_size($dimensions, $max_width, $max_height) {
    return array('width' => 400, 'height' => 300);
}

引用元: http://wp-snippet.com

サンプルコード4: プラグイン用のリサイズ設定

このサンプルは、特定のメディアプラグインがリサイズのロジックを拡張する場合を示しています。

add_filter('wp_constrain_dimensions', 'custom_plugin_resizing', 10, 3);
function custom_plugin_resizing($dimensions, $max_width, $max_height) {
    if (is_plugin_active('some-plugin/some-plugin.php')) {
        $dimensions['width'] = min($max_width, 600);
        $dimensions['height'] = min($max_height, 450);
    }
    return $dimensions;
}

引用元: https://wpengine.com/resources/

サンプルコード5: 出力サイズのカスタマイズ

このコードは、出力される画像サイズをカスタマイズする用途に供しています。

add_filter('wp_constrain_dimensions', 'output_custom_size', 10, 3);
function output_custom_size($dimensions, $max_width, $max_height) {
    if ($dimensions['width'] > $max_width) {
        $dimensions['height'] = ($max_width / $dimensions['width']) * $dimensions['height'];
        $dimensions['width'] = $max_width;
    }
    return $dimensions;
}

引用元: https://wordpress.stackexchange.com

この関数のアクションでの使用可能性

アクション 使用可能性
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

非推奨または削除されたバージョン

特定のバージョンでの非推奨または削除は確認されていません。

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


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