WordPressのスクロールに合わせて画像を読み込むプラグイン

jQuery Image Lazy Load WP

画面のスクロールに合わせて画像を読み込むWordPressのプラグイン「jQuery Image Lazy Load WP」をインストールしました。

ページ表示がかなり早くなったのと、スクロールに合わせて画像がふわっとフェイドインする感じがちょっとおしゃれでいい感じです。

jQuery Image Lazy Load WPはスマートフォンにも対応しています。

jQuery Image Lazy Load WPのインストール

WordPressの管理画面の左側のバーのプラグインの新規追加から「jQuery Image Lazy Load WP」を検索してインストールして有効にします。

設定はとくに何もいらないようです。

jQuery Image Lazy Load WPの改良

画像を読み込む順番はソースの上から順になるため、メインコンテンツよりもサイドバーの記述が下になっているような場合には、一番下までスクロールしないとサイドバーの画像を読み込まないという問題が発生します。
なので、サイドバーに画像を使用しているような場合には、少し改良が必要です。

改良方法は、WordPressの管理画面の左側のバーのプラグインの「プラグイン編集」のページを開いて、「jQuery Image Lazy Load WP」を選択し、「jquery-image-lazy-loading/jq_img_lazy_load.php」の27行目の”img”を”#content img”に書き換えて、ファイル変更のボタンをクリックするだけでです。

変更前

jQuery("img").not(".cycle img").lazyload({

変更後

jQuery("#content img").not(".cycle img").lazyload({

普通はこれで解決するはずなのですが、私の場合は上記のような書き換えを行ってオどういうわけかサイドバーに画像の下の方がうまく表示されません。
原因は不明です。
でもネットを見る限りでは、ほとんどの方は上記の書き換えだけでうまくいっているようです。