2679.2.11-月 9:42

PageSpeed Insights で「オフスクリーン画像の遅延読み込み」をせよとの警告が出たので Lazy Load を導入した。

 

 

Lazy Load 系のプラグインをいくつか試してみた。

どれもWPP=WordPress Popular Posts のサムネイル画像の表示に問題があった。

 

Jetpack のLazyload    WPP のサムネイル画像が表示されない。真っ白。

Lazy Load by  WP Rocket 全く機能しない

BJ Lazy Load   WPP の画像が表示されない

a3 Lazy Load   WPP の画像が表示されない

Lazy Load Optimizer  WPP の画像は表示されるが、Lazy Load にならない。一部のページで表示が乱れるので停止。

Lazy Loader  WPP の画像は表示されるが、Lazy Load にならない。

Autoptimize の Lazyload 機能を有効にする。これがWordPress Popular Posts 内のタグにも class="lazyload" を追加できていた。

WordPress Popular Posts にもLazyload を適用する方法

 

 

Autoptimize の Lazyload 機能 を使用すればいい。

警告が出なくなった。

 

と思ったら、iframe の google map や、 youtube 動画がLazyload にならないことが判明した。

それで、 iframe もLazyload できる Lazy Loader を改良して、WPPのサムネイル画像もLazyload でいるようにした。

 

lazy-loading-responsive-images/src/Plugin.php

の88行目に、次のように wpp_post にフィルターをかけるだけでよかった。

// Filter markup of the_content() calls to modify media markup for lazy loading.
add_filter( 'the_content', array( $this, 'filter_markup' ), 10001 );
add_filter( 'wpp_post', array( $this, 'filter_markup' ), 10001 );

 

Lazy Load 画像遅延読込の導入とWordPress Popular Posts

タナカ売りの少女

 

 

次の記事

💬 コメント欄表示

カテゴリ別人気記事 GL

WordPress カテゴリ人気記事

カテゴリ別新着記事

WordPress カテゴリ最新記事

最近更新した記事

 

ランダムフォト

ランダムフォト