この記事は最後に更新してから1年以上経過しています。
説明
「WordPress 5.3 Beta 1」に記載されていた「Automatic image rotation during upload」という見出し。画像ファイルに含まれるEXIF情報内の「向き」により、画像の向きを自動的に調整するというもの。どんな実装なのか気になったのでソースコードをざっくり眺めてみた。
はじめに、この記事は公開された5.3 Beta 2をもとにしており、正式リリースの際に変更される可能性があることを予めお断りする。
EXIF情報のOrientation
JPEG画像の向きをどこで調整しているのかを調べていくと、WP_Image_Editorクラスのmaybe_exif_rotateメソッドにたどり着く。このメソッドは wp_get_image_editor関数を使ってWP_Image_Editorオブジェクト(サーバー環境に応じてWP_Image_Editor_ImagickまたはWP_Image_Editor_GDオブジェクト)を生成して使用するものだ。
maybe_exif_rotateメソッドでは、PHPのexif_read_data関数を使用してEXIF情報を読み取り、その中にOrientationが含まれ、1以外の場合にその内容に応じてイメージの向きを調整するが、向きを調整する前にフィルターを実行するのがWordPressらしさである。
$orientation = apply_filters( 'wp_image_maybe_exif_rotate', $orientation, $this->file );
サイトのコンテンツで自動的に向きを調整してほしくない場合は、この'wp_image_maybe_exif_rotate'フィルターを使用してコントロールできる。例えば、無条件に向きを調整させない場合は次のようにすればよい。
add_filter( 'wp_image_maybe_exif_rotate', '__return_zero', 10, 2 );
アップロード時に作られる縮小イメージ
5.3では向きの自動調整に加え、高解像度への対応が行われている。この対応の一環だと思われるが、アップロード時に自動的に作成される縮小イメージが変更されている。次の表は解像度3024×4032ピクセルで縦向きのJPEG画像をアップロードした場合に作成される縮小イメージの違いを示すものだ。
幅×高さ | 5.2.3 Twenty Nineteen | 5.2.3 Twenty Twenty | 5.3 Beta 2 Twenty Nineteen | 5.3 Beta 2 Twenty Twenty |
---|---|---|---|---|
150×150 | 〇 | 〇 | 〇 | 〇 |
225×300 | - | - | 〇 | 〇 |
300×225 | 〇 | 〇 | - | - |
768×576 | 〇 | 〇 | - | - |
768×1024 | - | - | 〇 | 〇 |
1024×768 | 〇 | 〇 | - | - |
1152×1536 | - | - | 〇 | 〇 |
1200×900 | - | 〇 | - | - |
1200×1600 | - | - | - | 〇 |
1536×2048 | - | - | 〇 | 〇 |
1568×1176 | 〇 | - | - | - |
1568×2091 | - | - | 〇 | - |
1920×2560 | - | - | 〇 | 〇 |
1980×1485 | - | 〇 | - | - |
1980×2640 | - | - | - | 〇 |
まず5.2.3と5.3 Beta 2では縦向き画像が自動的に向きを調整されたことにより、作成される縮小イメージの幅と高さが異なることがおわかりいただけるだろう。
次は使用するテーマに依存する違いになるが、緑字の幅についてはテーマ「Twenty Nineteen」の指定によるものだ。
set_post_thumbnail_size( 1568, 9999 );
またテーマ「Twenty Twenty」では青字と赤字の幅がそれぞれ指定されており、その指定にしたがって縮小イメージが作成されている。
set_post_thumbnail_size( 1200, 9999 );
add_image_size( 'twentytwenty-fullscreen', 1980, 9999 );
【追記】フルサイズのしきい値
5.3ではフルサイズのしきい値(標準時2560ピクセル)が設定されている。上記の解像度3024×4032ピクセルで縦向きのJPEG画像の場合は、メディアにフルサイズとして登録されるのはアップロードしたオリジナルではなく、1920×2560ピクセルにリサイズされたものが適用される。このフルサイズのリサイズ処理は幅または高さのいずれかがしきい値より大きい場合に行われるようになっている。
フルサイズのしきい値を設定せずにオリジナルのサイズをフルサイズとして扱いたい場合は、次のように'big_image_size_threshold'フィルターを使用することで対応できる(既存のサイトで幅または高さが2560ピクセルの画像をアップロードしている場合は事前に対応を検討しておくこと)。
add_filter( 'big_image_size_threshold', '__return_false', 10, 4 );
こうすることで、アップロードしたJPEG画像がEXIF情報のOrientationがないか1の場合はそのままフルサイズの画像と適用される。EXIF情報のOrientationが1以外の場合は解像度を維持して向きを調整したもの生成され、フルサイズの画像として適用される。
5.3(Beta 2)では背景の違いで区分けした従来よりも大きな解像度の縮小イメージが追加されている。コンテンツで高解像度の写真やイラストを扱っているサイトはストレージの容量にも留意する必要がありそうだ。
最後にここに記載した内容を確認する際に私がやらかしてしまったことについて触れておく。スマートフォンで撮影した際に撮影者が横向きで撮ったと思っても実際には縦向きで保存されている場合がある。このようなJPEG画像をアップロードすると、自動向き調整が正常に機能していないかのような状況になる。そんな時は、まず落ち着いてアップロードした画像ファイルを確認すべきだ。WordPressの機能を疑うのはその後でいい。
最終更新 : 2019年10月17日 14:25
関連
お勧め
add_shortcode(2018年5月27日 更新)
get_user_setting(2022年1月31日 更新)
have_posts(2018年5月27日 更新)
in_category(2018年5月27日 更新)
add_feed(2024年6月24日 更新)