申しわけないのですが、僕はiPhoneを持っていないので動作確認はできていません。

ただ、原因の切り分けのために一点確認させてください。
高速化設定のLazy Loadを無効にすると表示されますでしょうか？

iPhoneで確認してみました。

●iPhoneでサイトバーの画像が表示されないサイト
https://wp-cocoon.com/

https://xn--w8jte276hx5vdnebu3f.com

Cocoonサイトは１分ほど待っても表示されませんでした。

kchanさんのサイト（？）は暫く待っても表示されませんでしたが、カルーセルが切り替わるタイミングでサイドバーの画像も表示されました。

がっきいさん、わいひらさん
ありがとうございます。

Lazy Loadを無効すると最初から表示されました。

他のトピックでLazy Loadで画像が表示されないと質問しているのに、そこに気づかずにすみませんでした。

ん〜。ただ私のサイトはLazy Load有効なのですが、サイドバーを開いて３〜５秒位で表示されるんですよね、、、

https://thx.jp

ほんとですね。
がっきぃさんのサイトは、3秒くらいで表示されました。

もし有効化しておきたいって事でしたら、高速化のLazy Loadを除外する□欄に以下を追記すれば表示されると思います。

size-thumb120

ただリサイズされた120pxの画像が使われた場所も除外されると思います。

• トップなどのエントリーカード・次へ前へのページ送りナビ。
• 記事下の関連記事。
• あとどこだろ！？

ただkchanさんの設定で、この辺見ると使われてないようなので、多分？大丈夫かもです。

●サイドバーの画像が表示されるサイト

私はLazy Loadをoffにしてるので、表示される感じだと思います ? 

IntersectionObserverがiOS Safariでは未実装みたいなので、
未実装ブラウザではスクロールとかリサイズとかのタイミングに画像位置を取得して画像をロードしているとか？かもしれませんね。

https://caniuse.com/#feat=intersectionobserver

確認するにも私には難しすぎてざっくりとした推測ですが… ?

かうたっくさん
ありがとうございます。

size-thumb120

と入れたら表示されました！
1ヶ月以上表示されないなぁ…と思っていたので嬉しいです。

今は、一旦 追記を消しておきますね＾＾

草村さん
いつもありがとうございます。
くわしく調べてくださったのですね！

表示されるようになるといいのですが…

実は私もLazyLoadを有効にするとiPhoneでサイドバーの画像が初見で表示されないのが気になっていたんですよね ? 

スマホだとサイドバーが画面外の右の方に隠れている状態なので、試しに発火点が初期では左右20pxになっているところを

rootMargin: "500px 20px"

左右も500pxになるように変更してみました。

rootMargin: "500px"

私のブログでLazyLoadを有効にして試しているのですが、スクロールしなくても表示されるでしょうか？

https://web.monogusa-note.com/

草村さん

表示されています！
スクロールしなくても、表示されてます＾＾

確認ありがとうございました！

恐らく他のIntersectionObserver未実装のブラウザでも開いた時から表示出来るようになってるかと思います。

とりあえず私がやった事ですが、子テーマのfunctions.phpにLazyLoad読み込み用のコードをコピペしてrootMarginの値を書き換えました。

https://github.com/yhira/cocoon/blob/master/lib/utils.php#L366-L373

function wp_enqueue_lazy_load(){
  if (is_lazy_load_enable() && !is_login_page()) {
    wp_enqueue_script( 'polyfill-js', get_template_directory_uri() . '/plugins/polyfill/intersection-observer.js', array(), false, true );
    wp_enqueue_script( 'lazy-load-js', get_template_directory_uri() . '/plugins/lozad.js-master/dist/lozad.min.js', array('polyfill-js'), false, true );
    $data = 'const observer = lozad(".lozad", {rootMargin: "500px",threshold: [0, 0.5, 1.0]});observer.observe();';
    wp_add_inline_script( 'lazy-load-js', $data, 'after' ) ;
  }
}

以前kchanさんはPHPはあまり触りたくないと仰っていたと思うので、現状はかうたっくさんの書き込みの除外設定が一番簡単な対応方法だと思います。

もしくは何か他の、もっとスマートな解決方法があったらいいのですが～…

さすが、草村さん。これは、わいひらさんが修正される気がします。

もし、修正されるのなら、threshold: [0, 0.5, 1.0] の削除もされた方がいいかもしれません。

lazy load で使われている lozad.js は、交差を検出した要素に対しては監視を停止します（lozad.js の 57 行目から 69 行目）。

https://github.com/ApoorvSaxena/lozad.js/blob/master/src/lozad.js#L57

なので、threshold の 0.5 と 1.0 のタイミングではコールバックが呼び出されません。また、threshold のデフォルト値は 0 なので、0 だけの指定はいらない。ということで、この threshold の指定は不要かなと思います。

おお！草村さんありがとうございます！いいねを10個つけたい ? 
その部分については、思いもつきませんでした。
確かに、スライドインメニューは画面の右側に、20px以上はみ出して格納されているので、発火しないのも今言われてみれば、ありえますね。

草村さんとAkiraさんが書かれたことを参考に、修正してみました。
https://github.com/yhira/cocoon/commit/33b6f1bc43b22828dbe5e118d431ba3f59db77a6

当サイトにも適用してみましたので、よろしければiPhoneでご確認いただけると幸いです。

一応、修正版はこちらになります。
https://github.com/yhira/cocoon
最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

iPhone、iPadとも表示されています！
とてもいい感じです。
みなさん、スゴイ?

おかしな対処法じゃないか不安だったので安心しました！よかったです。

私の方でもiPhoneで確認したら、開いた時からちゃんと表示されていました。
修正ありがとうございます！

皆様、解決策と動作確認をありがとうございます ? 
iPhoneノンホルダーの僕だけだったら、多分原因はわからなかったと思います。