WordPressサイトのテーマを変更すると、画像が適切なサイズでなくなってしまうことがあります。
そんな時にどんな解決策が考えられるでしょうか？それはサムネイルの再生成です。つまり、WordPressの基本設定にある画像の寸法をリセットすることになります。これは、プラグインを使用して素早く実施できます。
今回の記事では、WordPressでのサムネイル再生性の方法について深掘りするとともに、Regenerate Thumbnails WordPressプラグインを使用して画像の問題を解決する方法、WP-CLIを使用して手動で解決する方法もご紹介します。
早速見てみましょう。
画像に何が起こっているのか
WordPressでサムネイルを再生成する方法を理解するにはまず画像とそのサイズの仕組みについて理解する必要があります。
WordPressにはアップロードした画像を自動でトリミングする機能があります。この設定は管理画面の 「設定」>「メディア」から開けます。
「メディア設定」画面では「サムネイル」、「中サイズ」、「大サイズ」のサイズが設定できます。必要に応じてピクセル数を変更することもできます。
サイズを変更した際は画面下部にある「変更を保存」ボタンをクリックするのを忘れないようにしましょう。
デフォルトの寸法は次の通りです。
- サムネイル– 150 px x 150 px
- 中サイズ– 600 px x 600 px
- 大サイズ– 1024 px x 1024 px
ご利用になるテーマで特定の画像サイズが指定されていて、「メディア設定」画面のオプションに優先して適用されることがあるという点には注意してください。新しいテーマに切り替えると設定がそのテーマのものに更新されます。
しかし、過去にアップロードされた画像はその影響を受けません。
ここで少し厄介なことが起きます。過去にアップロードした画像の全てが新しく設定された画像サイズに適合するようにリサイズされなければなりませんが…残念ながら、そのための設定は存在しません。
そこで「サムネイルの再生成」が必要になります。
WordPressでサムネイルをリサイズする3つの方法
WordPressでサムネイルを再生成する方法の前にWordPressの管理画面で画像をリサイズする方法を知ることが重要です。
さらに重要なのは、この方法では過去の画像が必ずしもリサイズされるわけではないということ。そのため、やはりWordPressからプラグインを使用するか、それ以外の方法でサムネイルを再生成する必要があります。
サムネイルや画像をリサイズしたい場合、主に3つの方法があります。
1. テーマ内で画像サイズを変更する
WordPressテーマによってデフォルトの画像サイズが変更されることがあることから、テーマ自体を変更するか、そのテーマに画像サイズを調整するための設定があるかどうか確認しましょう。
テーマはそれぞれ異なるので、該当するドキュメンテーションを確認し、別のテーマをインストールすることなく、テーマの画像サイズを変更できないかどうかよく確認しましょう。
もしくは、子テーマを作成し、画像サイズをPHPから変更することもできます。
2. メディアライブラリで画像をトリミングする
画像サイズを変更する方法の一つは、「メディアライブラリ」でのトリミングです。
ステップ1
WordPressの管理画面から「メディア」>「ライブラリ」を開きます。
次に、一覧の中からリサイズしたい画像をクリックします。
開いた画面の「画像を編集」ボタンをクリックします。
ステップ2
画像の編集方法はいくつかあります。
画像をクリックし、画像の残しておきたい範囲をマウスでドラッグして選択し、離します。その後、「トリミング」をクリックします。
画像を正確にトリミングしたい場合は、好きな縦横比を入力して調整することもできます。
例えば、1:1にして正方形にすることもできますし、4:3、16:9…など、自由に設定できます。
次に、「shift」キーを押しながらマウスで画像をドラッグします。残したい画像の部分を選択したら離します。選択範囲をクリックして、移動することで、画像の必要な範囲を正確に指定することができます。
選択した範囲が気に入らない場合には選択範囲の角をクリックしてドラッグすることで、サイズを変更することもできます。
もしくは範囲を選択し、画面右側の「画像のトリミング」下の「選択範囲」という欄に具体的な画像のサイズをピクセル数で入力することもできます。
完了したら「トリミング」をクリックし、「保存」ボタンをクリックします。
ステップ3
画像をトリミングではなくリサイズしたい場合は右側の設定で縮尺を変更することもできます。
好きな画像サイズを入力し、「縮尺変更」をクリックします。
ステップ4
どの画像サイズを標準で適用するかを「サムネイル設定」の画面で設定することができます。
設定を次のいずれに適用するかを選択できます。
- 全ての画像サイズ
- サムネイル
- サムネイル以外の全サイズ
3. メディア設定画面で画像をリサイズする
ここまでのやり方は1、2個の画像の編集であれば使えますが、全ての画像をリサイズする必要がある場合は設定画面から行うのが一番です。
ステップ1
管理画面から「設定」>「メディア」を開きます。
ステップ2
全てのサムネイル、中サイズ、大サイズに適用したい寸法を入力します。好きな幅と高さを必要に応じてそれぞれの画像タイプで設定できます。
サムネイルを縮尺でないサイズでリサイズしたい場合、「サムネイルのサイズ」にある「サムネイルを実寸法にトリミングする」という項目にチェックを入れましょう。
ステップ3
次に、アップロードフォルダー内で新しい画像がバラバラに表示されるのを避けたい場合は、「アップロードしたファイルを年月ベースのフォルダーに整理」にチェックを入れます。
調整が完了したら画面の下部にある「変更を保存」をクリックします。
WordPressでサムネイルを再生成する方法
これらの設定を変更した後や、テーマを変更した後に、画像がサイト上で更新されない場合は前述の通り、サムネイルを再生成する必要があります。
最も簡単なのは、無料のWordPressプラグインRegenerate Thumbnailsを利用し、過去にアップロードした画像を修正する方法です。
このプラグインはWooCommerceとも互換性があります。
ステップ1
まずはRegenerate thumbnailsプラグインをインストールし有効化します。
その後、「ツール」>「Regenerate Thumbnails」を開くと、WordPressの画像関連の設定が確認できます。
ステップ2
デフォルトでは、「Skip regenerating existing correctly-sized thumbnails」にチェックが入っています。Regenerate Thumbnailsプラグインを利用して全ての画像を調整するにはこの項目のチェックを外します。
ただし、サーバーのリソース利用量を節約したい場合は、チェックを入れたままにしておきましょう。
テーマなどによって既に一部の画像サイズが更新されている場合はチェックを外さないことをお勧めします。「Delete thumbnail files for old unregistered sizes」という項目にチェックを入れることもできます。チェックを入れると（古い未登録のサイズのサムネイルファイルを削除することで）、サーバーのスペースを節約することができます。
この設定を行う前に、これらの画像が本当に必要ないか必ず確認しましょう。該当する画像がサイトで使用されている場合、このオプションを選択すると画像が削除され、サイトで表示されなくなります。訪問者には画像の破損として表示されます。
記事内のコンテンツで使用している画像も更新したい場合は、「Update the content of posts to use the new sizes 」（投稿内のコンテンツにも新しいサイズを適用）というチェックボックスにチェックを入れることもできます。
ステップ3
必要な設定を選択したら「Regenerate Thumbnails」（サムネイルを再生成）ボタンをクリックし、サムネイル、中サイズ、大サイズの画像サイズを含め再生成します。
その後、処理が完了するのを待ちます。サイト上にある画像の数によっては、しばらくかかることがあるので、コーヒーやお水でも飲みながら気長に待ちましょう。規模の大きなサイトでも高性能のサーバーを利用していれば、通常ほんの数分で完了するはずです。
処理が完了すると「All done!」というメッセージが表示されます。
これで完了です。
サムネイルと画像が再生成できているはずです。
強制的にサムネイルを再生成する方法
他にもForce Regenerate Thumbnailsプラグインを利用する方法もあります。その名前が示すように、古い画像を削除することによって強制的にWordPressによる画像の再生成を行います。プラグインはWooCommerceを用いたECサイトとも互換性があります。
ただし、このプラグインは、記事執筆時点では、直近3回のメジャーリリースを反映したアップデートが行われていないため、使用には注意が必要です。本番サイトで使用する前に、必ずステージングサイトかローカルテスト環境で試すようにしましょう。
Regenerate Thumbnailsとこのプラグインの違いは、Regenerate Thumbnailsの場合、該当するオプションを選ばない限り画像をリサイズするだけで、古い画像は削除されないという点です。
Regenerate Thumbnailsでうまくいかない場合は、Force Regenerate Thumbnailsを試してみるといいでしょう。
ステップ1
強制的にサムネイルを再生成するにはまずForce Regenerate Thumbnailsプラグインをインストールし有効化します。
次にWordPressの管理画面から「ツール」>「Force Regenerate Thumbnails」を開きます。
ステップ2
古い設定のサイズが適用されている全ての画像を削除し、サムネイルを強制的に再生成するには「すべてのサムネイルを再生成する」ボタンをクリックします。
しばらく待つと、画像がリサイズされます。規模の小さなサイトの場合、すぐ完了しますが、たくさんの画像を使用している大規模なサイトの場合、数分間かかることがあります。
特定の画像を再生成する
すべてのサムネイルを再生成する必要はなく、特定のものだけ行いたい場合もあるでしょう。Regenerate Thumbnailsプラグインはそんな場合にも使えます。
ステップ1
「メディア」>「ライブラリ」を開きます。グリッドビューで特定の画像をクリックします。
ステップ2
右側の「サムネイル再生成」ボタンをクリックします。
「メディアライブラリ」をリストビューで表示している場合、再生成したい画像にマウスを合わせて「サムネイル再生成」をクリックします。
WP-CLIでサムネイルを再生成する
プラグインを使用したくない方には、別の方法もあります。プラグインを使用せずにWP-CLIを使用して手動でサムネイルを再生成する方法です。
ただしこの方法を利用するにはサーバー上のコマンドラインが利用できる必要がありますのでご注意ください。
WP-CLIを利用してサムネイルを再生成する方法は、プラグインを使用するよりも速く、HTTPの制限やタイムアウトの対象とならないため便利です。
サムネイルを再生成する基本的なコマンドは次のとおりです。
wp media regenerate入力後、yesを表すyをキーボードで押し、全てのサムネイルを再生成することを確認します。
WP-CLIを使用してすべてのサムネイルを再生成する
コマンドラインを起動後、次のWordPressのコマンドを利用するとプラグインを使用せずにあっという間にサムネイルを再生成することができます。
wp media regenerate --yesこのコマンドでは、手動で確認することなくサムネイルが再生成されます。
WP-CLIを使用して特定のサムネイルを再生成する
WP-CLIと更新したい画像のIDを使用することで特定のサムネイルを再生成することもできます。
コマンドは以下の通りです。
wp media regenerate 12 34 567例で使用している3つのID、“12”、“34”、“567”を実際に再生成したい画像のIDに入れ替えてご利用ください。
好きなだけIDを追加することができますが、必ず間にスペースを入れるようにしましょう。
まとめ
テーマを変更した時に、画像が適切に表示されないのは腹立たしいものです。
幸い、WordPressでこれを素早く解決する方法が2通りあります。Regenerate Thumbnailsプラグインを使用して数クリックで対処することもできますし、WP-CLIを使用すれば、コーヒーをいれる間もないほどあっという間に完了してしまいます。
コメントを残す