どもです。
スマブラ3DSを購入した餅。です。

エムブレムのキャラ使いたいなーとか思っていたのに、
気づけば毎度のごとくカービィプレイヤーなうです。

可愛くて使い易いから仕方ないやん……
ルフレの使い方が未だによくわからんねん……

それはともかくWordPress。

WordPressでカスフィの画像やアイキャッチを使っていると、どうにもページが重い感じがしまして。

よく考えたら、フルサイズの画像をCSSで縮めている状態だったことに気づきました。
そら重いわ。

というわけで、今回はサムネイルやカスフィの画像サイズを調整したい話。

①アップロード時に自動生成される画像サイズについて

WordPressの気の利くところは、画像をアップロードした際に、
大中小とサイズ調整したものを作っておいてくれるところ。

これの設定を変更するには、「設定」→「メディア」へ。

これはデフォルト設定。

例えば400px*200pxの画像をアップロードすると、
150px*150pxのサムネイルと300px*150pxの画像が自動で作られます。
大サイズより小さいので、大サイズは作られません。頭良い。

テンプレ作るときは、まずここをサイトのデザインによって調整しましょう。

また、例えばトリミングした画像が2種類欲しい場合など追加で画像サイズが欲しいときは
function.phpに以下の一文を入れます。

add_image_size( 'size01', 520, 220, true );

add_image_size( 名前, 横px , 縦px )で新しい画像を設定できます。
また、その後ろにtrueをつけることで画像がトリミングになります。

複数設定する場合、

add_image_size( 'size01', 520, 220, true );
add_image_size( 'size02', 200, 150, true );

複数設置でおｋです。

②アイキャッチやカスタムフィールドでサイズを指定する

投稿の中で登場する画像は管理画面から選択するので良いとして、
問題はアイキャッチ画像やカスタムフィールドで画像を設定した場合です。

アイキャッチ画像の場合、

the_post_thumbnail('size01');

the_post_thumbnailの中で画像サイズを呼び出します。
サイズは①で作成したものの他、

と指定できます。

カスタムフィールドの場合は、

wp_get_attachment_image_src( post_custom('カスタムフィールド名'),'size01' );

で指定できます。
こちらもthumbnailなどの画像サイズが指定できます。