wordpressでテーマ「Twenty Twelve」を使っているのですが、
デフォルトではアイキャッチ画像サイズが縦に固定化は出来ませんでした。
アイキャッチ画像サイズを縦（高さ）に固定化する方法を紹介しましす。
■目次
環境
- ロリポップ
- wordpress 4.8.1-ja
- Twenty Twelve 2.3
結果的に「テーマの編集」することになります。
デフォルト（初期設定）。テーマ設定では高さは無制限の縮小設定
まずはアイキャッチのサイズを決めている箇所がどこなのかを探します。
- 「外観」-「テーマの編集」-「テーマのための関数(functions.php)」
を開き、「set_post_tumbnail_size」関数を探します。一か所しかないです。
Twenty Twelveではデフォルトで
set_post_thumbnail_size( 624, 9999 );
と定義されていて、この意味は、
- アイキャッチ画像のサイズを横624pxで縦9999に収まるように画像を縮小する。
という意味合いになります。
なので、アイキャッチ画像は横幅の方が624pxに収まるように画像が縮小されて表示されていることがわかります。
set_post_thumbnail_size関数のサイズを修正すれば自由にアイキャッチ画像のサイズを縮小出来ます。
アイキャッチの周りの関数の意味
// This theme uses a custom image size for featured images, displayed on “standard” posts.
add_theme_support( ‘post-thumbnails’ );
set_post_thumbnail_size( 624, 9999 ); // Unlimited height, soft crop
上記、functions.php内のset_post_thumbnail_size付近を見ますと、「add_theme_support( ‘post-thumbnails’ );」と書かれています。
これはアイキャッチ画像を作るという意味合いになり。
実際、content.phpに書かれているアイキャッチ画像を表示する関数
the_post_thumbnail();
の関数引数（カッコ内）が無い場合と、
the_post_thumbnail( ‘post-thumbnails’ );
と同じ意味合いになります。
つまり、set_post_thumbnail_size関数は、’post-thumbnails`画像のサイズを決めて作っていることになります。
アイキャッチ画像を縮小ではなく切り取りたい（トリミング）
アイキャッチ画像を縮小ではなく高さ固定の切り取り（トリミング）したい場合はset_post_thumbnail_sizeに引数をもう一つ付けます。
set_post_thumbnail_size( 624, 400, true );
上記は、アイキャッチ画像では画像から横624px縦400pxで切り取り（トリミング）することを意味します。
トリミングするので、アップロードした画像から新たなコピー画像を作っています。
functions.php内のset_post_thumbnail_size関数の引数を変更しただけでは、過去の投稿記事の画像のトリミング画像は作成できていませんので、過去の投稿記事のアイキャッチ画像に設定の変化はありません。
set_post_thumbnail_sizeを設定変更した後の記事からアイキャッチ画像のサイズが変わります。
過去の投稿記事のアイキャッチ画像も変更したい。「Regenerate Thumbnails」プラグイン
過去の投稿記事のアイキャッチ画像も変更したい場合は、プラグインを使うことで出来ます。
少し古いプラグインになりますが、今回の環境で動作することが出来ました。
プラグイン「Regenerate Thumbnails」をインストールし
- 「ツール」-「Regen. Thumbnails」
を開き「すべてのサムネイルを再作成する」ボタンを押します。
その後、100%処理が終わるまで待ちます。
すると、過去の投稿記事のアイキャッチ画像もサイズ変更トリミングが出来ていることが確認できます。
これは、サイズ変更された画像が新規に作られているからです。
トリミングされるのが画像の中央。画像の左上からトリミングしたい
上記true設定で画像がトリミングされる場所は、投降した画像の中央でトリミングされます。
- いや、アイキャッチ画像は画像の中央じゃなく左上からトリミングしてほしい！
という場合は、以下のようにset_post_thumbnail_size関数の引数を設定します。
set_post_thumbnail_size( 624, 400, array( ‘left’, ‘top’ ) );
trueの引数を場所を示す配列に変更することによって、トリミング開始場所を指定できます。