WordPressでサイトを作っていると、記事の一覧を表示するときにアイキャッチ画像を表示することが多いと思います。

その際、任意のサイズのサムネイル画像を表示したくなるのが人情です。

この記事では、「任意のサイズのサムネイル画像を生成する方法」とWordPressでサイトを構築して運用し始めた後、新しくサムネイル画像のサイズを追加して再生成する方法をご紹介します。

任意のサイズのサムネイル画像を生成する方法

WordPressで画像をアップロードすると、

サムネイル「150 x 150px」
中サイズ「300 x 225px」
フルサイズ「600 x 450px」

上記の3パターンで自動的に画像が生成されます。

これはデフォルト設定の場合で、これ以外のサイズで画像をリサイズ・切り出して欲しい場合は少し手を加える必要があります！

といっても簡単で、テーマにある functions.php というファイルに一行加えるだけ。

<?php add_image_size( $name, $width, $height, $crop ); ?>

引数の$nameは、新しい画像サイズの名前を指定します。
$widthは、切り出したいサムネイル画像の幅をピクセル単位で指定します。
$heightは、切り出したいサムネイル画像の高さをピクセル単位で指定します。
$cropは、画像を切り出すかどうか。デフォルトはfalseで、指定の幅または高さに合わせてリサイズ、trueの場合は、指定のサイズで切り抜きます。

参考サイト:

関数リファレンス/add image size

メディアのサイズを追加する

例えば、functions.phpに以下のように画像サイズを指定したとします。

<?php add_image_size('post_100x100_thumbnail', 100, 100, true); ?>

指定した後、画像をアップロードすると、100x100pxで画像が切り出されます。

100x100pxで切り出された画像を利用する場合は、こんな感じで指定します。
※ループでpostを回している場合

<?php the_post_thumbnail('post_100x100_thumbnail'); ?>

めっちゃ簡単です！

サムネイル画像を再生成する方法

WordPressでサイトを運用し始めたあと、サイトの改修などでサムネイル画像のサイズを新しく追加してそちらを使いたい場合があります。

そのときに問題になるのが、過去にアップした画像の新しいサムネイル画像をどう生成するのかという問題。

いまからアップロードする画像は指定したサムネイルの画像サイズで生成されるのですが、過去の画像については改めて画像をアップロードするなどしないといけません。

とてもめんどくさい......

でも、WordPressはプラグインが豊富！解決してくれるプラグインがありました！

Regenerate Thumbnails

使い方もめちゃ簡単！

まず、プラグインの新規追加からregenerate-thumbnailsで検索してインストールして有効化します。

すると、サイドバーのツールにRegen. Thumbnailsと表示されるようになるのでクリックします。

regenerate-thumbnailsの管理画面に遷移すると、Regenerate All Thumbnails表示されたボタンがあるのでクリックするとサムネイル画像の再生成が始まります。

これで、functions.phpに追加した新しいサイズのサムネイル画像が再生成されるはずです。

※自分のブログ内容から転載しています。