増子良太のブログです

増子良太が書いているブログです。テーマをしぼらず、思いついたものをただひたすら書いていきます。

WordPressでiPhone(スマホ)だけ画像が表示されない時

   

WordPressでPCでは通常通り表示されている画像が、スマホでは表示されないという事象に遭遇。

PCでレスポンシブ表示にしても表示される。でも実機だけ表示されない。。。

画像のタグを見てみると、「 srcset」という見慣れない属性がついている。

The srcset attribute

画面のサイズとかでimgタグのsrcを自動的に切り替えてくれるもの。

どこを探してもそんなプラグイン入ってない!と思ったら、WordPressのバージョン4.4から自動で入るっぽい。

Responsive Images in WordPress 4.4

これ自体は問題ないのかな?とりあえずスマホ(iPhone)をmacにUSBでつないでsafariを立ち上げて、webインスペクタでデバッグしてみる。

srcset自体は動いていて、読み込もうとしているけど、画像がない。。。

アップロードした時に自動で作るのがうまく動いていないのかな?おそらくテーマの中の「add_image_size」あたりも関係してそう。

ここまで調査したけど、めんどくさくなって、Responsive Imagesを無効にしてしまうことに。

これで大丈夫になりましたーと思ったら、、、まだ読み込まれない。。。

ファイル名が日本語なのが悪いのか?と思ってローマ字にしてファイルアップロードしたら表示された。

色々と不安は残るけど、、、

 

 - wordpress