【WordPress】アイキャッチなどに使用する、アップロード画像のトリミング位置を変更する方法

WordPressでホームページ制作をしているときに気を遣いたいのがアイキャッチ画像です。

記事一覧の見栄えを良くしてくれるアイキャッチ画像ですが、WordPressの場合、アップロードした画像ファイルはデフォルトで画像中央からトリミングされるようになっています。

こうしたトリミング位置のせいで、画像の見せたい部分がうまく表示出来ない場合が結構あります。
せっかくアイキャッチ画像を設定しても、思い通りの画像位置が表示できないとなんだかもやもやしますよね。

そこで今回はWordPressでアップロード画像の切り抜き位置を変更する方法を紹介します。

アップロード画像の切り抜き基準点を変更するにはfunctions.phpで関数を上書きする

デフォルトの切り抜き基準点についてはWordPressのコアファイルに記述があるのですが、コアファイルをいじってしまうとWordPressのバージョンアップ時にまたやり直しをしないといけません。

そこでfunctions.phpで切り抜き位置を設定している関数を上書きしてしまいましょう。

画像切り抜き位置を「画像の一番上、左右中央」に設定

以下の記述をfunctions.phpに加えるとトリミングの基準点が画像トップの左右中央になります。

その他のトリミング位置に変更する場合

切抜き基準点を変更したい場合は上記ソースコードの$s_xと$s_yの値を書き換えます。
一応その他4パターンをならべて記載しておきます。

例えば基準点を左上にする場合は、

基準点を右上にする場合は、

基準点を左下にする場合は、

基準点を右下にする場合は、

などに書き換えれば良いでしょう。

アイキャッチ画像の切抜き調整は、WordPressでホームページ制作をするときに度々必要になるので覚えておくと便利だと思います。

画像をアップロードする都度切抜き位置を選びたいという場合は、次のようなプラグインを利用すると良さそうです。

【WordPress】サムネイル画像のトリミング基準点を変更するプラグインThumbnail Crop Position

参考サイト

今回の記事は以下のブログを参考にさせて頂きました。

【WordPress】アップロード画像の切り抜き基準点を「中心」から「左上」にする方法 | ITキヲスク

アイキャッチ画像のトリミング位置 | naocoppola.com|30歳からウェブデザイナーとして働いて必要だった事。

アイドットデザインのブログはWeb業界の話題に限らず幅広いビジネストピックについて書いています。
よろしければFacebookページのフォローをどうぞ!ビジネスに役立つ情報をお届けします!

福岡のホームページ制作・SEO対策はアイドットデザインまでご相談ください!
インターネット集客やWebマーケティングのご相談も承ります。

follow us in feedly

Facebookページに「いいね!」して更新情報をチェック!

»