WordPress
その他
運営中のサブブログ
主に私のデスク周りアイテムを紹介しています。
在宅作業の参考になるかもしれません。
運営中のサブブログ

WordPressのメディア設定とは、画像のアップロードに関するものです。
実は初期設定のままだと、1つの画像に対し、複数のサイズが自動生成されています。
私は7年以上サイトを運営していますが、自動生成は必要ないと結論付けました。
当記事では、画像生成の仕組みと自動生成を停止する方法を解説します。


WordPressに画像をアップロードすると、メディア欄には1枚しか表示されませんよね。
しかし実際は、画像を保存しているサーバー側に最大7枚も自動生成されています。
お使いのテーマに独自生成サイズが設定されている場合、もっと増えます。


試しにファイル名「test-image」サイズ3000×2000px、容量660KBの画像をアップロードしてみましょう。
あえて3000pxにしたのは、2561px以上の画像をアップロードすると、生成されるファイルがあるためです。


右上の検索窓に①「uploads」と入力後→②「進む」をクリック


複数のドメイン管理している方は、いくつか候補が出てきますので
/public_html/希望のドメイン/wp-content/uploadsをダブルクリックしてください。


もちろんFTPソフトからも確認および編集可能です。


サーバーの画像フォルダを見てみると、サイズ違いの画像が7つ生成されました。
基本的にオリジナル画像より、小さいサイズが自動生成されます。
例えば1000pxの画像をアップロードした場合、「150・300・768px」の3つが生成されるということ。
※.またサンプル画像は横長だったため、縦横比も横に調整されていますが、縦長画像の場合は、縦に調整されます。


ちなみにWordPress側のオリジナル画像を削除すると、サーバー側のデータも同時に消えます。
※自動生成含む。
削除方法は「メディア」からでも「投稿画面」でも同じです。


一番下の「scaled」は、2561px以上の画像をアップロードすると、強制的に2560pxサイズに自動変換されるものです。
つまりWordPressのデフォルト状態では、2561px以上の画像をアップロードできません。
記事の後半で、scaledを無効にする方法を解説しています。
そして問題なのは右側の「容量」です。
オリジナル1枚なら660.07KBですが、他7つを合計すると(660.7+2128.7)=2789.4KBにもなります。
サンプル画像は「scaled=2560px画像」を生成するため、あえて大きなサイズにしました。
しかしそうでなくても、デフォルトでは画像を1枚アップロードするたびに最大7枚分の容量がサーバーに保存されていることになります。



ぶっちゃけチリツモどころじゃないよ
特に画像をたくさん使うサイトは要注意


レンタルサーバーのストレージはプランによって上限があります。
例えば当サイト使用中のmixhost
![]()
![]()
管理しているサイトを全部合わせると、1万枚以上の画像をアップロードしました。
それでもオリジナル1枚だけなら、わずか15GB前後に収まっています。



もしデフォルトのまま自動生成されていたら、どれだけ容量を圧迫していたかわかりません…
このような問題が発生するため、プランのアップグレードが必要になります。
ストレージを圧迫する要素
このうち自分で節約できるものが、プラグインとデータベース=画像および動画容量です。
プラグインは必要最低限に抑え、利用しなくなったものは「停止」ではなく「削除」しましょう。
画像は先ほど解説した通り、自動生成を停止すればかなり容量を節約できます。
ではなぜWordPressは複数の画像を生成しているのでしょうか。
次章はそれについて解説します。


あらためて先ほどの容量を見てみましょう。
オリジナル(660.7KB)に対し、最小の150×150は(8.3KB)に収まっています。
約80倍も差がありますね。


例えば、サイドバーに設置した人気記事ランキングのアイキャッチ画像は、スペースの関係上かなり小さいですよね。
この画像を読み込ませるとき、オリジナル画像だけだと毎回その容量を読み込まなければいけません。
このような場合、サムネイルのサイズ(150×150)を設定しておけば、サイトの読み込みが軽くなります。
「関連記事」や「トップページ記事一覧」も同様です。


そのほか記事内に挿入する画像も、状況に応じてサイズ選択できます。


試しに当サイトのトップページを、サイトスピードを測れるPageSpeed Insightsに読み込んでみましょう。
改善欄に「適切なサイズの画像」と表示されました。
ちなみに測定時のトップページは12枚の画像(記事)が並んでいます。
減らせるデータ量は46KBと出ていますね…。
えっ?こんなもの?と思ったのではないでしょうか?
そうなんです、そもそも最初にアップロードする画像をしっかり圧縮しておけば、読み込み速度に影響を与えるほど遅くならないのです。
もう一つの注意点は、小さな画像は解像度が低いということです。
以下4つ画像を見比べてみましょう。








どうでしょうか。
1000pxを超えると4Kモニターで見てもさほど劣化を感じないはずです。
サンプルは「JPEG」ですが、現在は「AVIF」というもっと軽量で画質の劣化を防げる拡張子もあります。
「AVIF」はWordPress6.5から対応しています。
確かにSEOを考慮すると、サイト表示は速いに越したことはありません。
ただし100KB以下の画像であれば、実際の読み込みに影響を与えるほど遅くならないのです。
以上のことから私は、1200px前後のオリジナル画像1枚だけにして、その他の自動生成は停止しています。
また7年以上サイト運営してきましたが、SEOに影響を及ぼしたことはありません。



ということで、ここからメディア設定と自動生成の停止方法を解説するね


管理画面>設定>メディアを開きます。
サムネイルのサイズ・中サイズ・大サイズはコードを記述して無効化させるため、デフォルトのままで大丈夫です。


デフォルトでチェックしてあるはずですが、外れていたら「チェック」しましょう。




チェックすると、画像ファイルが「年月フォルダ」に自動分類されるため、管理が楽です。
逆にノーチェックの「ファイル管理」だと、ファイルがズラーッと並ぶだけですので、数が増えてきたときの管理が難しくなります。



画像は年月フォルダで管理しよう
それでは、今回のメイン設定。
画像生成を停止するコードを記述していきましょう。
//すべての画像生成を停止する
function resize_disabled($sizes) {
$sizes = array();
return $sizes;
}
add_filter('intermediate_image_sizes', 'resize_disabled');
add_filter( 'big_image_size_threshold', '__return_false' );このコードであれば、テーマ側にデフォルト以外の独自画像生成があっても停止できます。
2561px以上の画像をアップロードする予定がなければ、一番下のコードは削除しても構いません。
停止コードは過去の画像には反映されないので注意しましょう。
過去画像を削除するには、ファイルマネージャーまたはFTPソフトから手動で削除する必要があります。
ファイルマネージャーの削除方法


①Shiftで複数選択>②右クリック>③Deleteをクリック


④ゴミ箱をスキップしてファイルを完全に削除するに「チェック」します。
⑤Confirmをクリック


//項目別に画像生成を停止する
function resize_disabled( $stop ) {
unset( $stop['thumbnail'] );
unset( $stop['medium'] );
unset( $stop['large'] );
unset( $stop['medium_large'] );
unset( $stop['1536x1536'] );
unset( $stop['2048x2048'] );
return $stop;
}
add_filter( 'intermediate_image_sizes_advanced', 'resize_disabled' );
add_filter( 'big_image_size_threshold', '__return_false' );| コード | 項目またはサイズ |
|---|---|
| thumbnail | サムネイルのサイズ|151px以上 |
| medium | 中サイズ|301px以上 |
| large | 大サイズ|1025px以上 |
| medium_large | medium_large_size_w|769px以上 |
| 1536×1536 | 1537px以上 |
| 2048×2048 | 2049px以上 |
| add_filter( ‘big_image_size_threshold’, ‘__return_false’ ); | scaled|2561px以上 |
記述したコードが停止されますので、必要な項目があればコードを削除してください。
一番下のコードで、2561px以上の画像もアップロードできるようになります。
また冒頭で解説したとおり、基本はオリジナル画像以下のサイズが自動生成されます。
//項目別に画像生成を停止する
function resize_disabled( $stop ) {
unset( $stop['thumbnail'] );
unset( $stop['medium_large'] );
unset( $stop['1536x1536'] );
unset( $stop['2048x2048'] );
return $stop;
}
add_filter( 'intermediate_image_sizes_advanced', 'resize_disabled' );
add_filter( 'big_image_size_threshold', '__return_false' );例えば「medium」と「large」を削除した状態で、1200px画像をアップロードしたとしましょう。
その場合”300px“と”1024px“の画像が生成されます。
くどいようですが、必要な画像サイズを削除してください。
以上、WordPressのメディア設定について解説しました。
画像の自動生成はサーバーを圧迫するため、すべて停止しちゃいましょう。
オリジナル画像だけで読み込み速度のテスト(PageSpeed Insightsなど)を実行すると、必ず「画像をもっと小さくできる」と注意喚起されますが、気にしなくてOKです。
特に画像を多用するサイトの場合は、自動生成を放置しておくと膨大な量になりますので、全停止がおすすめです。
WordPress初期設定


この記事が気に入ったら
フォローしてね!
記事への質問等はこちらからどうぞ