WordPressの画像をWebPにして軽くしたい　〜プラグインの入れ替え

2025年11月23日2025年11月26日

1. プラグインがなんかおかしい　〜Modern Image Formats
2. PageSpeedInsightで自分のサイトのスピードをチェック
3. 新しいプラグインを導入　Converter for Media
4. スピードは変わったのか？
5. 追記
6. トラブルシューティング〜よくある原因と対策

プラグインがなんかおかしい　〜Modern Image Formats

最近Wordpressの画像がちょっとおかしくなって、Modern Image Formatsのプラグインを止めたら正常に戻りました。しかし、プラグインが動いていないと、画像が軽くならない。。。

WordPressに画像をアップロードしても、白いままで表示されなくなった　→プラグインの確認

PageSpeedInsightで自分のサイトのスピードをチェック

PC版は75点でした。。　以前は95点以上あったのに。。。

なおスマホ版は、53点だいぶ遅くなっていました。画像サイズの問題だけではないでしょうが。

新しいプラグインを導入　Converter for Media

Converter for Mediaをいれました。とりあえず、エイ！と実行

30分くらいで実行が終わりました。

スピードは変わったのか？

PC版は92点に戻りました。

追記

ただ、それ以降、画像がうまく上がらないケースも続いています。うまくいく画像もあるのですが・・・

メディアライブラリーで確認すると、正常に画像として中身も見えるのですが、投稿記事上だと、真っ白になってしまう。。どうしてだーー

WodpressのサーバはWPX Speedを使っています。　Converter for Mediaとの相性は悪くないとChatGPTに聞いたのですけどね。

トラブルシューティング〜よくある原因と対策

① WebPファイル自体が生成に失敗している

症状

一部の画像だけ表示されない（すべてではない）
その画像の WebP が壊れている・作られていない

対策

WordPress管理画面 →
「Converter for Media / Convert for Media」プラグインの設定画面へ。
問題の画像をメディアIDで検索できる機能や、
「再生成 / Regenerate」ボタンがある場合は、その画像だけ再生成。
もしくは「すべての画像のWebPを再生成」機能があれば実行（時間はかかります）。

※ それでもダメな画像は、

画像サイズが大きすぎる
画像が壊れている
などの可能性もあるので、別名で再アップロードしてみてください。

② .htaccess やリライトルールが壊れている

多くのWebP変換プラグインは

「.htaccess」に rewrite ルールを追加して
xxx.jpg にアクセスされたら xxx.webp を返す

という仕組みを使います。
ここが崩れていると「何も表示されない」ことがあります。

対策

FTP / ファイルマネージャで WordPressインストール直下の .htaccess を確認・バックアップ。
プラグイン設定内に「.htaccessを再生成」「ルールをリフレッシュ」のようなボタンがあればクリック。
なければ一旦プラグインを無効 → 再度有効化してみる。
有効化時にルールを再生成するタイプもあります。
その後、ブラウザのキャッシュを削除して再表示を確認。

③ HTMLソースが「壊れた WebP URL」を指している

テーマ側や他のプラグインが絡むと、

実在しない example.com/wp-content/uploads/xxxx.webp に書き換えられている
画像URLの途中に余計なクエリパラメータがついて 404 になっている

ということもあります。

対策

表示されない画像のページを開く
ブラウザで「右クリック → 検証」し、画像タグ（<img>）の src / srcset を確認。
そのURLを直接ブラウザのアドレスバーに貼り付けて開く。
- 開けば画像は生きている → テーマ・JS周りの問題の可能性
- 404/500 になる → パスが間違っている or ファイル自体がない

もしファイルがない場合

wp-content/uploads/年/月/ のフォルダの中に、その .webp が存在するか確認。
なければ、前述の「再生成」を実施。

④ 他プラグイン・キャッシュとの相性問題

キャッシュ系 / 画像最適化系プラグインを複数入れていると、

それぞれが画像URLを書き換え
結果として存在しないURLに変換される

ということが起きやすいです。

要注意な組み合わせの例

LiteSpeed Cache / W3 Total Cache / WP Rocket 等のキャッシュ
EWWW、Imagify、Smush など別の画像最適化プラグイン

対策

「他の画像最適化プラグイン」を一旦すべて無効化。
サーバーキャッシュ／プラグインキャッシュ／ブラウザキャッシュを削除。
それでもダメな場合、
- キャッシュ系プラグインの「WebP変換」機能をオフにして、Convert for Media だけに統一する
- あるいはその逆（Convert for Media を停止し、キャッシュプラグイン側のWebP機能だけ使う）

⑤ テーマの画像出力ロジックとの不整合

一部のテーマやページビルダー（Elementor、Divi、Blockテーマ）の場合、

独自の <picture> タグ構造や Lazyload を持っていて
Convert for Mediaの書き換えロジックと噛み合わない

というケースもあります。

対策（ざっくりでOK）

プラグイン設定で「HTML書き換えモード」「出力方法」を切り替える項目があれば、
- <picture> モード
- <img> の src を直接書き換えるモード
  など、別パターンに変えてテスト。
Lazyload系プラグイン（a3 Lazy Load 等）を一旦オフにして表示確認。