WordPressの投稿にお洒落なアイキャッチ画像は欠かせないものですが、テーマ・テンプレートの自動作成の場合、切り抜く位置を指定できず、画像表示がおかしくなることが多いです。人物の頭部が切れてしまったり、「空と車」の”空”だけが表示されたり。
もうちょっと右寄りに切り抜いてくれれば……と思っても、特定のアイキャッチ画像だけ、手動で切り抜く機能はありません。
自動作成にまかせると、こんな風に、人物の頭部がカットされて、アイキャッチ画像が残念なことになってしまいます。
アイキャッチ画像を理想的に表示する為に、同じ画像を二重にアップロードしたり、ローカルでトリミング加工したり、いちいち手間をかけるのも面倒です。
そこでおすすめしたいのが、画像切り抜きプラグイン『Crop-Thumbnails』。
Crop-Thumbnails
https://ja.wordpress.org/plugins/crop-thumbnails/
WordPressの『メディアを追加』の編集画面で、元画像に変更を加えずに、アイキャッチ画像(もしくはサムネイル)を自由にクロップできる便利なプラグインです。
管理画面で有効化すると、『メディアを追加』の画面、右下方に、Crop Featured Thumbnail というボタンが現れます。
Crop Featured Thumbnail をクリックすると、次のような作業画面が現れます。
私が使っているテーマ・テンプレートの場合、ヘッダーに表示するアイキャッチ画像は icatch という名称のサムネイルが自動作成されます。
自動作成だと、画像の中央でクロップするため、人物の頭部が切れてしまいます。
クロップをやり直したい画像を指定し(この場合、icatch )、右側の作業画面で、手動で切り抜きを行います。
Crop all images with same ratio at once
(選択した)全ての画像を同じ比率で同時にクロップする
指定した画像だけクロップする場合は、チェックを外します。
deselect all で、全選択が解除されます。
画像をクロップする際、テーマ・テンプレート指定のサイズ(この場合、icatch の画像サイズ)の切り抜きボックスが表示されるので、いちいちピクセル数を気にする必要はありません。
このあたり……という箇所に切り抜きボックスを配置し、Save Crop をクリックすれば、icatch の画像だけがクロップされて、上書き保存されます。オリジナル画像や、その他のサムネイル画像に影響はありません。
作業が完了したら、いったん画像の編集画面を閉じ、投稿画面に戻って『アイキャッチ画像を設定』をクリックして、新規にクロップした画像を確定します。
アイキャッチ画像のクロップで、テンプレートのヘッダーも理想通りに表示されました。
『設定』に関しては、クロップしたくない画像を選択する機能があります。
カスタム投稿タイプ別に、サムネイル画像の種類が表示されるので、クロップしたくない画像があれば、チェックを入れます。
使用中のテーマ・テンプレートによって、表示される画像の項目は異なります。
Hide Crop-Thumbnails button below the featured image?
『メディアを追加』の画面の Crop Featured Thumbnail のボタンを非表示する場合、チェックを入れます。
Plugin Test
プラグインが正常に機能するか、テストします。
Do Plugin quick-test をクリックすると、数秒後にメッセージが表示されます。
末尾に、INFO Tests complete と表示されたらテスト成功です。
Developer Settings
上級者向けです。
プラグインが正常に機能しない場合、試してみて下さい。
画像表示や管理に関する記事
None found