テーマをカスタマイズして、記事のアイキャッチ画像など任意のサイズで出力させたいときってあると思います。ここでは、新しいサイズのサムネイル画像の設定方法についてお話します。最初にお話しておきますが、テーマを変えたり新しいサムネイルサイズの追加をした場合、それまでにアップロードされた写真については、新しいサイズの画像は生成されませんのでお気をつけください。
過去にアップした画像の新しいサムネイルを生成するにはこのプラグインを使ってください。
コンテンツ
新しいサムネイル画像サイズを追加する方法
ここでは、「外観」＞「テーマの編集」から「テーマのための関数」というファイルを編集する方法についてご紹介します。
function.phpに画像サイズを追加するコードを追加する
新しいサムネイルサイズの設定は下記のコードを追加するだけです。
add_image_size('サイズ名', 横幅, 高さ, 切り取り);
サイズ名は半角英数字で入力してください。分かりやすくするために「img180x180」のような名前にすると良いと思います。
具体例
add_image_size('img180x180', 180, 180, true);
※サイズに単位（px）は入れません。
ここで設定した名前がサムネイルを出力させるときに必要になります。横幅、高さ（ピクセル）は数字で入力します。「切り取り」の部分は画像を設定したサイズにトリミングするかどうかの設定です。トリミングする場合は「true」と入力し、
add_image_size('サイズ名', 横幅, 高さ, true);
このように入力します。
反対に、切り取りをしない場合は最後の項目を省力して、次のように書きます。
add_image_size('サイズ名', 横幅, 高さ);
サムネイルのトリミング設定について
切り取りをするしないの意味がいまいち分からない方がいるかもしれないので、具体例で見てみたいと思います。例えば、次の元画像を180×180ピクセルのサムネイルサイズにしたい場合
true：切り取りをする場合
このように設定したサイズ（180×180）で画像が切り取られます。
false（初期値）：切り取りをしない場合
画像の縦横の比率が保たれたまま画像が縮小されます。この画像の場合、横長なので横幅は180ピクセルになりますが、高さは元画像の比率が保たれ101ピクセルで生成されます。
どちらの設定が良いかはみなさんのやりたい方向で決めてくださいね。
作成したサムネイルの出力方法
最後に作成したサムネイルのサイズで画像を出力する方法について見ていきたいと思います。アイキャッチが表示されているテーマのソースコードを見ると、下記のようなコードが見つかるはずです。
the_post_thumbnail();
このカッコの中に先ほど、作成したサイズ名を「’」でくくって入力します。
the_post_thumbnail('サイズ名');
以上で作成したサイズでサムネイルが表示されます。
