こんにちは！ヒロキチ(@LifeStyleDesi11)です。
先月 にWordpressテーマを無料テーマからJINに移行したのですが、
ある日スマホをチェックしていると
ブログの画像類が全部表示されてない！！！！
ブログに載せた写真はもちろん、アイキャッチ画像やバナーまで表示されてないではないか！
これは一大事。ということでブログの画像類が表示されない時に考えられる原因をまとめたので同じ症状の方がいましたらぜひ参考にしてみてください。
Contents
考えられる原因一覧
- 画像のファイル名が日本語になっている
- WordPress,PHPのバージョンの問題
- Jetpackの設定による不具合
- その他のプラグイン干渉
*原因は上記の4つ以外も考えられます。また、プラグイン干渉の調査などはバックアップを取った上で自己責任でお願いいたします。
画像のファイル名が日本語になっている
スマホからブログを見た時に画像が表示されない場合はまずこれを疑いましょう。
WordPressのダッシュボードのメディアをクリックし、表示されていない画像を選択します。
右上のファイル名の部分が日本語になっている場合、スマホでうまく画像が表示されないことがあります。
対処法
画像のファイル名をアルファベットに変更しましょう。
一度アップロードした画像のファイル名は変更できないので、もう一度画像をアップロードしなおすかMedia File Renamerというプラグインを使用して変更することができます。
WordPress,PHPのバージョン
WordPressやPHPのバージョンが古いとうまく画像が表示されないことがあるみたいです。
WordPress 4.9.8
PHP 7.2.6
2018/9/11現在
PHPは7.2.6にバージョンアップすると不具合が生じるプラグインもあるので、7.0.30あたりにしておくといいと思います。
WordPressのアップグレード方法
ダッシュボードの更新画面からアップグレード可能
更新していないとダッシュボードに更新ボタンが表示されます。
PHPのアップグレード方法（Xserver）
①Xserverのサーバーパネルにアクセス。
②真ん中列の「PHP」欄からPHP.ver.切替を選択。
③変更後のバージョンをPHP7.0.30に設定しPHPバージョン切替（確認）をクリック
④PHPバージョン切替（確定）をクリック
以上でPHPのアップグレードは完了です。
Jetpackの設定による不具合
僕の場合はJetpackの設定によって不具合が生じて画像が表示されなくなっていました。
Jetpackの設定が原因の場合考えられるのは3つです。
- 「画像パフォーマンス」の設定
- 「画像を全画面のカルーセルギャラリーで表示する」の設定
- 「画像の遅延読み込みを有効にする」の設定
「画像のパフォーマンスの設定」の対処法
Jetpackのダッシュボード画面の下の方にあるパフォーマンス欄の、「画像のパフォーマンス」をオフにする。
「画像を全画面のカルーセルギャラリーで表示する」の設定の対処法
Jetpackの設定画面から執筆を選択し、メディア欄の「画像を全画面のカルーセルギャラリーで表示する」をオフにする。
「画像の遅延読み込みを有効にする」の設定の対処法
同じくJetpackの設定画面から執筆を選択し、パフォーマンスおよびスピード欄の「画像の遅延読み込みを有効にする」をオフにする。
その他のプラグインの干渉
Jetpackの他にもテーマによっては相性の悪いプラグインも存在します。
プラグイン干渉が疑われる時は一度すべてのプラグインを停止し、一つ有効化してはブログを確認、もう一つ有効化してはブログを確認…と地道に探していくしかありません。
面倒ですが、原因がわからない場合これが一番早く解決できる可能性が高いです。
まとめ
今回はWordPressのブログをスマホで見ると画像が表示されない問題の対処法をまとめてみました。
僕自身いろいろな解決方法を試しましたがどれも改善に繋がらずプラグイン干渉を調べた結果jetpackが原因であることが判明しました。
そこからさらに画像のパフォーマンスや読み込み遅延の有効の設定をいじっているうちに治すことができました…
画像が表示されていなかったことはとても悲しいですが、一つの問題を解決する経験が詰めたので良かったのではないかと思います。
同じような症状に悩まされる方がいましたらぜひ試してみてください。
