私はワードプレスの無料テーマ「Simplicity」を使っています。⇒現在は「cocoon」を使用しています。
先日、WordPressの設定をいろいろ変更していたところ、画像が表示されない不具合が発生しました。
忘却録として、この不具合についての症状と、解決方法を書いておきます。
―― 筆者が運営するYouTubeチャンネル ――
この記事のINDEX
パソコンの画像だけが表示されない
画像が表示されない不具合の症状について以下の通りでした。
- 本文の画像が表示されない
- サムネイルは表示される
- スマホで見ると特に異常はない
▼パソコンから閲覧すると
- 記事のサムネイルは表示されるけど、本文の画像が一切表示されない
- カエレバやリンカーといった商品紹介ツールの画像も表示されない
- しかし、管理画面にログインした状態で記事を見ると、全ての画像が問題なく表示される
▲画像が表示されない状態、商品リンクも画像が表示されません。
▼スマホから閲覧すると
- パソコンでは表示されなかった本文の画像は正常に表示される
- 特に異常はない
Simplicityテーマを使っていて、この症状と同じ症状の方は、これからご紹介する方法で不具合が解消されるかもしれません。試してみてください。
原因は「Lazy Load」プラグイン
WordPressでは、複数のプラグインを利用していると、使っているテーマとの相性やプラグイン同士が悪さをして不具合が生じることがあります。
先に今回の不具合の原因を言うと「Lazy Load」プラグインが悪さをしていました。
「Lazy Load」プラグインとは、画像の読み込みを遅らせることで、ページ全体の表示速度を高速化することができるプラグインです。
ページの表示速度が遅いと閲覧者をイラつかせてしまったり、SEO的に検索順位にも影響が出てくるため、ページの高速表示化を図るために導入していました。
しかし、これが裏目にでてしまったようで、「Simplicity」テーマと「Lazy Load」プラグインは相性が悪かったみたいです。
調べてみると、SimplicityとLazy Loadは相性が悪い、画像が表示されないという事例が何件も上がっていました。
解決方法1. Lazy Loadを無効化して、不具合を解消する
Simplicityにはカスタマイズページにおいて、ボタン一つでLazy Loadを有効化できるようになっています。これが有効になっていると、画像が表示されない不具合の原因になります。
1. カスタマイズページの「画像」を開く
管理画面にログインして、「外観」メニューから「カスタマイズ」を開きます。カスタマイズのページを開いたら「画像」項目をクリックします。
2. Lazy Loadを有効のチェックを外す
上から2つ目にある「Lazy Loadを有効（画像の遅延読み込み）」という項目のチェックを外します。
チェックを外すことで、Lazy Loadプラグインが無効化されます。
テーマをインストールした初期状態ではチェックは入っていませんでしたが、説明文に書いてある“サーバーの負荷対策”という文字を見てチェックを入れたようです。
3. 保存する
チェックを外したら、ページ上部にある「公開」を押して設定を保存します。
そして、管理画面からログアウトして、記事内の画像がちゃんと表示されているかを確認してみましょう。
私の場合は、この方法で画像が表示されない不具合が解消できました。
解決方法2. Lazy Loadをアンインストール
解消方法1を試してみたけど「該当しなかったよ」という方、そもそも普通に「Lazy Load」プラグインをインストールしていませんか？
インストールしているならば、アンインストールしましょう。
- 「プラグイン」メニューから「インストール済みプラグイン」を開きます。
- プラグインの一覧から「Lazy Load」を探して「停止」します。
- 停止後、「削除」を押してアンインストールします。
まとめ
プラグインは便利な反面、相性によっては不具合を起こす可能性があります。
ブログの変更やプラグインのインストールを行った時は、その都度、必ず不具合が無いか確認しましょう。
画像が表示されないだけでなく、ページ全体が表示されないこともあるので、要注意です。