WordPressにアップロードした画像が表示されない！
画面サイズが思った通りに表示されない！
ド素人の私が遭遇したこの問題。
期待する画像はこんな感じで画面サイズに合わせて可変になること。
期待するフルサイズの表示はこんなイメージ。
ブラウザの表示幅を狭くした場合はこんなイメージ。
画像が表示されない。
しかし、URLにアクセスするOSやブラウザによって表示されない。
画像サイズが自動変化しない。
とか、画像のサイズが自動変化しない。
作成するブラウザによって画像が表示されたり、されなかったり。
MACのSafari, Chorome, FireFox
Windows10のIE, Chorme, FireFox
AndroidのChome, ASUSUのブラウザ
iPad、IphoneのSafari
といろいろ試したのですが、その時々で現象が変わり、どうも問題のまとまりがつきません。
先人の知恵を借りるべく、ググって見ると、
- 画像ファイル名が日本語。⇨全て英語orローマ字で登録済み
- 画像ファイル名が大文字小文字。⇨全て小文字を使用
- プラグインLazy Loadとの相性。⇨未インストール
- サーバーにアップロードしたファイルのアクセス権限。⇨アクセス権限は644で誰でも読める。
４項目が主な対策のようで、全部確認したのですが問題無し。
こんな問題が起こり、２〜３日悩み続けたのですが、WordPressのプラグインJetPackの設定にある「画像と写真をスピードアップ」を停止する事で解決しました。
WordPressのプラグインJetPackのPhoton「画像と写真をスピードアップ」が原因
いよいよ、迷宮入りか？とプラグインの設定を見直しているとJetPackに「画像のスピードアップ」のオプションがオンになってました。
素人ながら、JetPackをインストールしたときに「画像表示が高速化されるのね。 ﾌﾝﾌﾝ!!」とオンにしていたんです。
試しにオフにすると、あっさりと問題解決。
JetPackの「画像のスピードアップ」は、Photonと言うそうです。
Photonについて先人の知恵をお借りしてググって見ましたが、具体的な原因は分かりませんでした。
因みに、インストールしているプラグインは
- Jetpack by WordPress.com
- Akismet Anti-Spam,
- BackWPup,
- Calculated FieldsForm
- Compress JPEG & PNG images
- TablePress
です。
同じ現象でお困りの場合はJetPackのPhotonを停止してみるのもいいかもしれません。