WordPressの画像サイズ：デフォルトの画像サイズを理解し、変更する方法

WordPressで画像を扱うのは、時に難しい場合があります。

要件や解像度に十分注意を払わないと、Webサイトのデザインが崩れたり、読み込み速度に影響を与えることもあります。

そのため、WordPressのデフォルトの画像サイズとその変更方法について理解しておく必要があります。この記事では、WordPressの画像サイズに関する基本情報、カスタマイズの方法、そしてカスタム画像サイズを再生成するためのWordPressプラグインの使い方について解説します。

WordPressのデフォルト画像サイズとは

WordPressでは、画像をアップロードすると、次の解像度に基づいて4種類の画像サイズが自動的に作成されます：

• サムネイル: 150 x 150 ピクセル
• 中サイズ:  最大300 x 300 ピクセル
• 大サイズ: 最大 1024 x 1024 ピクセル
• フルサイズ: アップロードされた元の画像サイズ

WordPressは画像をどのように処理するのか

画像をメディアライブラリにアップロードすると、WordPressは3つのデフォルトの画像サイズで追加の画像を自動的に生成し、それぞれを個別に保存します。

そのため、画像をアップロードすると、4種類の画像オプションが表示されます。最初の3つはデフォルトのWordPress画像サイズと呼ばれ、フルサイズはアップロードした元の画像サイズです。

WordPressがこれらのオプションを作成するのは、画像を表示する場所によって必要な解像度が異なるためです。例えば、サムネイルで使う画像の解像度は、スライダーで使う画像の解像度とは異なる場合があります。

そのため、同じ画像をさまざまな場所で異なる解像度で使用したい場合でも、手動で画像を編集・リサイズする必要はありません。1枚の画像をアップロードするだけで、あとはWordPressが自動で処理してくれます。

デフォルトのWordPress画像サイズを変更する方法

WordPressにはすでに3つのデフォルトサイズが用意されていますが、これらの選択肢がお客様のニーズに合わない場合は、Webサイト用画像に最適なサイズを設定する別の方法があります。例えば、より小さいサムネイルや、より横長のアイキャッチ画像が必要なこともあるでしょう。そのため、WordPressのデフォルトの画像サイズを変更する必要があります。

以下の手順で変更できます：

• 管理パネルにアクセスします
• 「設定」にカーソルを合わせ、「メディア」をクリックします
• 「メディア設定」画面で、各サイズの希望するピクセル数を入力します
• 「変更を保存」ボタンをクリックして設定を保存します

カスタムのWordPress画像サイズを追加する方法

お客様には3つのデフォルトサイズがあります。例えば、サムネイルにはサムネイルサイズの画像、投稿の画像には中サイズ、アイキャッチ画像には大サイズの画像を使用しているとします。

しかし、ポップアップバナーやウィジェット用に、さらにデフォルトの画像サイズが必要だと気付くことがあります。このような場合は、カスタムのWordPress画像サイズを追加して、そのニーズを満たすことができます。

ステップ1. function.phpファイルを編集してカスタムWordPress画像サイズを追加する

一部のテーマでは、追加の画像サイズオプションが用意されていることがあります。しかし、それらが見つからない場合は、お客様自身でカスタム画像サイズを追加することも可能です。

• 管理パネルにアクセスします
• 「外観」にカーソルを合わせ、「エディター」をクリックします
• functions.phpファイルを編集します
• 以下のスクリプトをコピーして、ファイル内に貼り付けます

add_theme_support( 'pop-up-banner' );

• 「ファイルを更新」ボタンをクリックします

上記のスクリプトにより、add_image_size()関数が有効になります。

この関数がすでに有効になっている場合は、以下のように新しいWordPress画像サイズを追加することができます：

add_image_size( 'pop-up banner size', 1000, 590 );
add_image_size( 'widget size', 220, 180 );

以下の例では、追加する画像サイズに「Pop-up banner size」や「Widget size」といった名前を付けています。

サイズ名の後に続く2つの数値は、それぞれ幅と高さを表しています。

ステップ2. テーマ内にカスタムサイズを表示する

新しいカスタム画像サイズの追加には成功しました。しかし、まだWordPressテーマ上に表示されていません。次に、テーマで新しいサイズを有効にする必要があります。

まず、変更を加える前に、サイトのバックアップを作成してください。その後、投稿ループ内のテーマファイルにアクセスし、編集します。そして、以下のコードを貼り付けます：

<?php the_post_thumbnail( 'your-specified-image-size' ); ?>

your-specified-image-sizeの部分は、前のステップで設定した名前に変更してください。例えば、pop-up-banner sizeに変更することができます。これらの手順を完了すると、画像をメディアライブラリにアップロードする際に、pop-up-banner sizeのオプションが表示されるようになります。

プラグインを使って画像サイズを再生成する方法

WordPressで新しいカスタム画像サイズを設定しても、既存の画像には影響しません。そのため、これまでのカスタム画像サイズを再生成する必要があります。

幸いなことに、手作業で一つずつ処理する必要はありません。Regenerate Thumbnailsというプラグインを使えば、これまでの画像サイズを簡単に更新できます。以下の手順に従って操作してください。

• 管理パネルにアクセスします。
• 「プラグイン」→「新規追加」をクリックします。
• 検索バーに「Regenerate Thumbnails」と入力します。
• プラグインをインストールして有効化します。
• 次に、「ツール」→「Regenerate Thumbnails」に進みます。
• 「Regenerate Thumbnails For X Attachments」ボタンをクリックします
• これで、これまでにアップロードしたすべての画像が新しい画像設定に合わせて再生成されます。

まとめ

WordPressの画像サイズは一見些細なことのように思えますが、実は頭を悩ませる原因にもなり得ます。アップロードした画像ファイルが、思い通りのサイズで表示されないこともあるでしょう。

この問題を解決するには、2つの方法があります。WordPressのデフォルトの画像サイズを変更するか、カスタム画像サイズを追加することができます。新しいサイズを設定する前に注意すべき点として、高解像度の大きな画像をアップロードするのはおすすめできません。

大きな画像は多くの容量を占め、Webサイトの読み込み速度を遅くしてしまう可能性があります。

この記事が、お客様が正しい画像を、正しい場所で、適切なサイズで使うための助けになれば幸いです。

本サイトのチュートリアルコンテンツは、 Hostingerの編集方針と価値観に基づき作成されています。