WordPressでサムネイルのサイズを変更する方法と必要な理由

公開: 2019-04-21

新しいWordPressWebサイトをセットアップすると、プラットフォームには、サムネイル、中、大（およびファイルの元の解像度）の3つの画像サイズが表示されます。これにより、使用できるオプションが多数提供されます。ただし、特にサムネイルは、すべてのテーマとデバイスで見栄えがよいことを確認する必要があるため、使用が難しい場合があります。

幸い、WordPressで画像のサムネイルサイズを変更するのにかかる時間は1、2分です。あなたがそれにいる間、あなたはさらに多くの選択のためにあなたのウェブサイトに新しいデフォルトの画像サイズを追加することもできます。この記事では、両方の方法を説明しますので、作業を始めましょう。

私たちのYoutubeチャンネルを購読する

WordPressでサムネイルサイズを変更する方法

WordPressでサムネイルサイズを変更するのは非常に簡単です。従う必要のある手順は次のとおりです。これについては、後ほど詳しく説明します。

WordPressダッシュボードに移動します。
[設定]> [メディア]タブに移動します。
[画像サイズ]> [サムネイルサイズ]セクションを探します。
サムネイルのデフォルトの幅と高さをピクセル単位で変更します。

それはほとんどそれです。ただし、 [画像サイズ]> [サムネイル]セクションを詳しく見てみましょう。

[画像サイズ]> [サムネイル]セクション。

ご覧のとおり、デフォルトのサムネイルサイズは、比例した正方形の画像になります。 150×150ピクセルで、これがあなたが見なければならないものです：

デフォルトのサムネイルサイズの例。

この画像は、クロップサムネイルを正確な寸法に設定できるようにしたため、「ハードクロップ」と呼ばれるものを採用しています。これは、WordPressが設定したサムネイルサイズを取得し、使用する画像で領域を「塗りつぶし」、残りの画像をオフのままにすることを意味します。一方、「ソフトクロップ」は、比率を維持しながら画像を縮小するサイズ変更です。

今のところ、先に進んで、新しいデフォルトのサムネイルサイズを選択してください。次に、設定への変更を保存することを忘れないでください。

新しいデフォルトのサムネイルサイズを設定すると、WordPressはその時点からアップロードするすべての画像にそれを使用します。ただし、他のサムネイルサイズを使用するかなり大きなメディアライブラリがすでにある場合はどうなりますか？

これらの画像を再アップロードする代わりに、単に「サイズを変更」することができます。その仕事に最適なツールは、AJAX ThumbnailRebuildプラグインです。

AJAXサムネイル再構築プラグイン。

このプラグインが行うことは、既存のサムネイルをすべて取得し、それらを1つずつサイズ変更することです。また、中、大など、WordPressが使用する他の画像サイズでも機能します。つまり、これらのデフォルトの寸法のいずれかを変更した場合でも使用できます（後でその方法を説明します）。

開始するには、プラグインをインストールしてアクティブ化します。完了したら、 [設定]> [サムネイルの再構築]タブにジャンプし、サイズを変更する画像を選択して、[すべてのサムネイルを再構築]ボタンをクリックします。

WordPressのサムネイル設定。

メディアライブラリに含まれる画像の数によっては、処理に時間がかかる場合があります。したがって、しばらくお待ちください。[完了]メッセージが表示されるまでタブを閉じないでください。

WordPressのサムネイルサイズを変更する必要がある理由

この時点で、サムネイルサイズの変更方法についてはすでに説明しましたが、その理由についてはまだ説明していません。 WordPressのデフォルトのサムネイルサイズである150×150ピクセルは一部のユーザーには適切に機能しますが、すべてのタイプのデザインに単一の画像解像度が適切であるとは限りません。

たとえば、より詳細を示す大きなサムネイルが必要になる場合があります。これは、eコマースストアを運営している場合に特に関係があります。または、特にブログやニュースサイトの注目の画像に関しては、より長方形の形状を使用することをお勧めします。

Webサイトを再設計したり、新しいテーマを試したりする場合は、画像サイズを試してみることもお勧めします。そうすれば、新しいスタイルで何が最も効果的かを確認できます。さらに、プロセスは非常に単純なので、数分かかることはほとんどありません。また、上記で紹介した追加のプラグインをインストールしない限り、既存のメディアライブラリに影響を与えることはありません。

WordPressにカスタム画像サイズを追加したい場合はどうなりますか？

WordPressに画像をアップロードするときはいつでも、プラットフォームはバックグラウンドで魔法を使って、その画像を使用できる複数のサイズにサイズ変更します。前述したように、これにはサムネイル、中規模、および大規模の画像が含まれます。同じ画像のサイズを複数持つことで、ニーズに最適なオプションを選択できるため、生活が楽になります。

上記と同じプロセスを使用して、これらのデフォルトの画像サイズを変更できます。ただし、サイトに新しいデフォルトサイズを追加することもできます。これは非常に便利なオプションです。サイト全体のさまざまな種類の画像すべてに特定のサイズを設定でき、新しい画像を手動でサイズ変更する必要がなくなります。

WordPressに新しいデフォルトの画像サイズを追加するには、テーマのfunctions.phpファイルを編集する必要があります。つまり、FileZillaなどのファイル転送プロトコル（FTP）クライアントを使用してサイトに接続してから、サイトのルートフォルダーに移動する必要があります。

そこに着いたら、 wp-content / themesディレクトリを開き、テーマの名前を共有するフォルダを探します。

wp-content / themesディレクトリ。

このフォルダー内にfunctions.phpファイルがあります。完了したら、それを右クリックして、 [表示/編集]オプションをクリックします。これにより、ローカルテキストエディタを使用してファイルが開くため、ファイルに変更を加えることができます。

Functions.phpファイル。

テーマのfunctions.phpファイルに変更を加えるときは十分に注意し、既存のコンテンツは変更しないでください。代わりに、下部に新しいコードスニペットを追加する必要があります。

// This enables the function that lets you set new image sizes
add_theme_support( 'post-thumbnails' );
// These are the new image sizes we cooked up
add_image_size( 'post-image', 660 );
// Now we register the size so it appears as an option within the editor
add_filter( 'image_size_names_choose', 'my_custom_image_sizes' );
function my_custom_image_sizes( $sizes ) {
    return array_merge( $sizes, array(
        'post-image' => __( 'Post Images' ),
    ) );
}

このコード内のコメントは、それがどのようにうまく機能するかを説明しています。まず、テーマに新しい画像サイズを追加することをWordPressに通知します。次に、新しいデフォルトオプションを作成し、次に開いたときにエディター内に表示されるように登録します。

登録した新しいデフォルトを詳しく見てみましょう。

add_image_size( 'post-image', 660 );

新しいカスタム画像サイズを追加するときに、幅と高さの両方を設定できます。この例では、幅を設定するだけです。これは常に最初の値です。これは、WordPressが画像のサイズを必要な幅とそれに比例した高さに変更することを意味します。

特定の高さも追加する場合は、代わりに次のようになります。

add_image_size( 'post-image', 660, 480 );

それぞれに新しい行を使用して、必要なカスタムサイズを自由に追加してください。次に、 functions.phpファイルへの変更を保存すると、新しいオプションがWordPressエディターに表示されます。

結論

WordPressを使用する上で最も優れている点の1つは、そのカスタマイズ性です。プラットフォームには、大小を問わず、変更できない側面はありません。これは、WordPressのサムネイルサイズやその他のさまざまなデフォルトの画像オプションにも当てはまります。

デフォルトのWordPressサムネイルサイズを変更する場合は、次の4つの簡単な手順で変更できます。

WordPressダッシュボードに移動します。
[設定]> [メディア]タブに移動します。
[画像サイズ]> [サムネイルサイズ]セクションを探します。
サムネイルのデフォルトの幅と高さをピクセル単位で変更します。

WordPressの画像サイズについて質問がありますか？ 以下のコメントセクションでそれらについて話しましょう！

ConceptVectorDesign / shutterstock.comによる記事のサムネイル画像