HOME

ABOUT

ARCHIVES

CONTACT

wordpress

wordpressのサムネイル画像を任意の大きさに指定する

wordpressを使っていて「サムネイル画像(アイキャッチ)の大きさを変えたいな〜」と思い調べてみたら意外と簡単だったので方法をご紹介

KEY SENTENCE

[1] function.phpへの指定

[2] 呼び出し方法

[3] 注意点

[1] function.phpへの指定

まずはfunction.phpに以下のコードを記載します。

add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size(横のサイズ, 縦のサイズ, 切り抜きの有無);

これで記事・固定ページの投稿画面にアイキャッチの設定項目が追加されます。

set_post_thumbnail_size(220, 165, true);

この指定の場合、横幅220px,縦幅165px,自動的に画像をリサイズした後に、画像を中心から切り抜いてくれます。

次に任意のサイズの指定方法です。

指定したいサムネイル画像のサイズを規定し、以下のコードをfunction.phpに続けて記載します。

add_image_size( '任意の名前',横のサイズ, 縦のサイズ, 切り抜きの有無 );

以上で準備は完了です。

[2] 呼び出し方法

実際に呼び出す場合は任意のphpファイルのサムネイルを呼び出したい箇所に以下のコードを記述してください。

<?php the_post_thumbnail(); ?>

この場合、初期設定のサムネイルサイズが呼び出されるため、横幅220px,縦幅165px,切り抜きモードでのサムネイル画像が表示されます。

そして任意の大きさのサムネイル画像を指定する場合は、

<?php the_post_thumbnail('任意の名前'); ?>

のように、()内に任意の名前を加えて呼び出します。

これで任意の大きさでのサムネイル画像を呼び出すことが可能です。

[3] 注意点

最後に一点だけ注意事項を。

サムネイルの画像指定の設定は、設定の後にアップロードした画像のみにリサイズが適用されます。
それ以前にアップロードした画像には、リサイズされた画像が用意されていないため、切り抜きがうまく機能してくれません。
ある程度運営を進めたサイトの場合、画像を一つ一つ再度アップロードするのは非常に手間になるため、プラグインを活用して既にアップロードした画像をまとめてリサイズしましょう。

その際に便利なのはRegenerate Thumbnailsというプラグインです。

Regenerate Thumbnailsのインストール方法

まずは『プラグイン』>『新規追加』から『Regenerate Thumbnails』を検索し、インストールし有効化します。

『ツール』>『Regen. Thumbnails』を選択し、『Regenerate All Thumbnails』ボタンをクリックします。

これでアップロード済みの画像をまとめてリサイズしてくれます。

また『メディア』>『ライブラリ』から個別にリサイズも可能です。

画像サイズをリサイズをするときは、元々設定されていたサイズの画像が無くなるためバックアップを取ってから行ってくださいね。