WordPress 画像をCropで中心以外のでのトリミングの方向を指定する

WordPressでは画像をアップロードすると自動で色々なサイズの画像を生成することが出来るのですが、その画像を生成するときに自動でトリミングを行うことが出来ますが、デフォルトでは中心部を基準にしたトリミングになりますがオプションを設定する事でトリミングの仕方を指定できます。

add_image_size の crop にオプションを追加してトリミングの方法を指定する

まずは、Wordpressで画像の生成の基本的な部分の説明になりますが。functions.php でアップロードされた画像から指定した画像サイズを生成する方法。

画像サイズを追加する場合

add_image_size( 'create_image_name', width, height );

//実例
add_image_size( 'category_random', 300, 300 );

指定の画像サイズを追加する場合は上記の文が基本になります。

create_image_name = 識別するための名前
width = 画像の横幅の指定 0を指定すると無制限単位はピクセル
height = 画像の縦幅の指定 0を指定すると無制限単位はピクセル

画像サイズを追加及びトリミングを行う場合

add_image_size( 'create_image_name', width, height, crop );

//実例
add_image_size( 'slide', 1000, 200, true );

自動トリミングを行う場合は、heightの指定の後にカンマを付け true とすることでcropが有効になりトリミングされます。trueのみとした場合は画像の中心を基準にトリミングが行われる。

create_image_name = 識別するための名前
width = 画像の横幅の指定 0を指定すると無制限
height = 画像の縦幅の指定 0を指定すると無制限
crop = トリミングのオプションの指定 true で有効 false で無効。 falseの時は省略可

画像サイズの追加及びトリミングで方向を指定する場合

add_image_size( 'create_image_name', width, height, array( 'Horizon', 'Vertical' ) );

//実例
add_image_size( 'big_image', 500, 300, array( 'left', 'top' ) );

トリミング方向を指定する場合は、cropの有効か無効か指定する箇所でarrayで縦軸と横軸での基準となる一を指定することでトリミングの方向を指定する事ができます。

create_image_name = 識別するための名前
width = 画像の横幅の指定 0を指定すると無制限
height = 画像の縦幅の指定 0を指定すると無制限
crop = トリミングのオプションの指定 true で有効 false で無効。 falseの時は省略可。方向指定時には arrayを使用する
Vertical = 縦軸でのトリミングの開始地点を決める指定出来る値は top center bottom
Horizon = 横軸でのトリミングの開始地点を決める指定出来る値は left center right

WordPressの公式の日本語CODEXにはこの方法は紹介されていないようですが、実はcropの方向を指定することが可能で、Wordpressのコアファイル wp-includes/media.php に載っています。Wordpressでの画像の自動生成はよく使う機能のひとつでさらにWordpressは画像アップロード周りが良く出来ていますのでPCの方でリサイズとか圧縮とかトリミングとかはWordpressのテーマファイルの方でしっかり考えて工夫すると、ポンポンっとアップロードするだけで良くなる。

WordPressでは画像サイズの追加と設定をうまく使いこなすことで日々の更新でかなり時間短縮に繋げれれる部分であったりします、実はあまり知られていないこのオプションも有効に活用しましょう。