記事内に商品プロモーションが含まれる場合があります
子テーマでWordPressをカスタマイズしているときに、何かと困るのがfuctions.phpの関数のオーバーライドです。このページでは、WordPressの親テーマで指定されているサムネイル画像のサイズを、子テーマから変更する方法を紹介します。
親テーマを直接編集してはダメなの?
親テーマのfuctions.phpなどのファイルを直接編集すると、テーマをアップデートした際に、ファイルが上書きされてしまいます。つまり、アップデート後にファイルの編集を再度しなければならなくなります。
できれば子テーマでカスタマイズは完結
というわけで、できれば親テーマを触ることなく、子テーマだけでカスタマイズを行うのが理想的です。子テーマについては下の記事で詳しく解説しています。
add_image_sizeを子テーマからオーバーライドする方法
ここからは具体的な手順を解説をしていきます。
手順1:どのサムネイル画像をオーバーライドするか決める
まず、どの画像のサムネイル画像のサイズを変えるのかを決めましょう。親テーマのfuctions.phpなどのファイルを見ると、おそらく下記のようなコードが見つかるかと思います。
add_image_size( '◯◯', 520, 300, true );
このコードによりWordPressにサムネイル画像を登録しています。
◯◯にはサムネイルの名前が入っています。上の例での520と300はそれぞれサムネイルの幅と高さのpx指定ですね。trueは「指定したサイズに画像をトリミングする」という指定になります。
手順2:子テーマにオーバーライド用のコードを書く
上の例では、520×300pxのサムネイル画像が登録されていますが、高さを半分(150px)にしたいとします。その場合には子テーマのfunctions.phpに下記のコードを追加します。
//サムネイル画像をオーバーライド function my_change_thumb_size() { add_image_size( '◯◯', 520, 150, true ); } add_action( 'after_setup_theme', 'my_change_thumb_size', 11); //END サムネイル画像をオーバーライド
変えたいサイズの値で指定しなおすわけですね。◯◯にはさきほどのサムネイル名と同じ名前を入れましょう。
親テーマで、add_image_sizeが含まれる関数がif(!function_exists())
と定義されている場合には、上のようにオーバーライドする必要はありません。中身を変えた同名の関数を記述すればOKです。
手順3:Regenerate Thumbnailsでサムネイル画像を再生成
これで設定は完了ですが、すでにアップロードされている画像は新サイズに自動リサイズされません。そこで「Regenerate Thumbnails」というプラグインを使って、アップロード済みの画像も新サイズに変えましょう。
使い方は簡単。プラグインをインストール&有効化して「ツール」「Regenerate Thumbnails」「すべてのサムネイルを再生成する」をクリックするだけです。