トップページfront-pageと商品カテゴリーでのa3 Lazy Loadの動作

[mai]

宜しくお願いいたします。

現在の環境は下記の通りです。
WordPress のバージョン：5.2.2
Welcart のバージョン： 1.9.19
Welcart専用の拡張プラグイン：
ご利用のテーマ：welcart_basic(子テーマ)
症状を確認したブラウザ：chrome
サーバー：（会社名、サービス名）xserver
SSLの利用：（独自　常時SSL）
画像遅延読み込みプラグイン「a3 Lazy Load」プラグインを使っています。

固定記事、商品詳細ページでは正常に動作していますが、
トップページ(front-page.php)と商品カテゴリーのページで動作していません。
フッター部分においては動作している様です。

もしかするとプラグインを読み込む位置の関係かとも思いますが、
問題が読み込み位置だとするなら、header部に読み込み位置を変更できないでしょうか。
a3 Lazy Loadが動作しない原因が他の場合も合わせて
ご教示、宜しくお願い致します。

[mai]

プラグインの読み込み位置は関係ないようです。
プラグインの設定にて、headerに読み込み位置を変更しても同じでした。
front-pageでは、画像を横に4枚usces_the_itemImage(0, 175, 175, $my_post)にて
表示しています。このパターンが何段か続いています。

[hsasaki]

chrome の要素検証で、
エラーは出ていませんでしょうか？
Basic の子テーマ（carina）で検証してみましたが、
トップページ、商品一覧でも、
動作しています。
エラーも出ておりません。

[mai]

hsasaki　様
有り難うございます。

>chrome の要素検証で、
>エラーは出ていませんでしょうか？

chrome の要素検証とはどのようにすれば良いのでしょうか。
デベロッパーツールのconsoleのエラー表示の事でしょうか。
console内にはエラー表示はありません。

ソースを見ても<img ・・・の後にnoscriptとかimg タグ内にlazyの文字も有りません。

ただfront-page.phpとcategory.phpは追加変更を加えています。
それが原因とは考えにくいのですが・・・。

[mai]

追記
category.phpの変更が原因している可能性を探るため
子テーマ内にあるcategory.phpを一時的に削除して
親テーマのcategory.phpにて確認するも同様に動作していませんでした。
すぐさま子テーマ内にcategory.phpをftpにより復活。
a3 Lazy Loadを停止してLazy Load有効にしても同様に動作していませんでした。

アドバイス宜しくお願いします。

[hsasaki]

エラーがないとのことで、
確認ですが、
a3 Lazy Load の設定で、
「Image Lade Threshold」項目があると思いますが、
そこに値は入ってますでしょうか？
値を0にした場合どうなりますでしょうか？
また、
ページの長さがはどれくらいありますか？
画像がスクリーン内に収まっている場合、
ファーストビュー内のイメージには適用されないようですが。
※ファーストビュー内でも後方にあるサイドバーなどは別です。
改めて設定等をもう一度見直してみてはいかがでしょうか。

[mai]

hsasaki　様

有り難うございます。

Image Lade Thresholdの値は400にしています。
一応10に設定して、デベロッパーツールでiphone x の画面で見たりresponsiveの画面設定で縦長にしたりしています。

ブラウザ幅を狭くすると横に4枚の商品写真は2枚になり
10段以上になります。画像も圧縮をしている為さほど時間は掛かりません。スクロールをすると直前で画像が現れる感じはありません。また、ソースを開くと<imgタグ内にclass=”lazy lazy-hidden”の代替え画像もありません。
<noscript ・・・画像url･･</noscript>も無いところを見ると、lazy loadが何らかの原因で動いていないと思います。

固定記事の中にショートコードでusces_the_itemImage(0, 175, 175,・・・を記したphpファイルを実行させて4枚の商品画像を並べていますが、その記事はlazy loadが正常に動作している様に見えます。またソースもそのようになっています。

現状は、front-pageとcategoryの二つのページで動作していません。
子テーマ内のカスタマイズしたcategory.phpを一時的に削除して、親テーマのcategory.phpで実行しても動作ししていません。

あと考えられるのは、function.phpでの追加分が影響を与えているかも知れないと、リストを見ていますがそれらしいものはありません。朝早くに子テーマのfunction.phpを削除し見ればはっきりすると思います。ただ function.phpの可能性は低いと思っています。

引き続きアドバイス宜しくお願いします。

[hsasaki]

おはようございます。
他のプラグインの影響を受けている可能性はございませんでしょうか？
また、トップページとカテゴリーページで、個別に読み込んでいるライブラリー等ございませんか？
もしありましたら、一度それらの読み込みを切ってみて試していただけませんでしょうか。

[mai]

hsasaki　様

有り難うございます。
早速ご提案頂きました下記事項を試してました。

>他のプラグインの影響を受けている可能性はございませんでしょうか？

プラグインは全15個なので下記以外は停止をしてみました。
a3 Lazy Load
All In One SEO Pack
Google XML Sitemaps
Welcart e-Commerce
WP Multibyte Patch
zipaddr-jp

症状は改善しませんでした。
固定ページとか商品詳細ページで正常に動作しているので
プラグインの影響とは考えにくいと感じています。

>トップページとカテゴリーページで、個別に読み込んでいるライブラリー等の影響

個テーマ内の下記のファイルを一時的に削除して、カテゴリーを表示してみました。
category.php
function.php
header.php

この段階で親テーマのfunction.php → heder.php → category.phpと流れていると考えています。この状態でもa3 Lazy Loadは動作していません。
親テーマの該当ファイルの更新日は2018/12/21でした。
ただし、footer内の画像themes/welcart_basic-child/images/category.pngは
画像遅延読み込みされています。(子テーマ内のcategory.phpでも同様です)

私が加筆したcategory.php　function.php　header.phpを取り除いた状態でも
画像遅延読み込みが動作していない状態と考えますが・・・？

usces_the_itemImage(0, 175, 175)が原因しているのかとも考えましたが、
hoge_hoge.php内にusces_the_itemImage(0, 175, 175,$my_post)を使用して
固定ページ内でショートコードにてhoge_hoge.phpを呼び出しています。
この場合は画像遅延読み込みは正常に動作しています。

動作しているかどうかは目視による確認とソース内の<imgタグの代替えと、それに続く<noscript記載がされているかで判断をしています。

引き続きアドバイス宜しくお願いします。

[投稿者]

投稿