今日の人気記事

  1. WordPressページナビゲーションを作成するプラグインWP-PageNavi
  2. 1ページに表示する最大投稿数を変更 - posts_per_page
  3. 管理画面にログイン・ログアウト
  4. ドメイン変更を伴うWordPressサイトのサーバー移転方法
  5. ページ上部の管理バーを非表示にする方法

画像読み込みを遅延ロード - Unveil Lazy Load

スポンサーリンク

画像読み込みを遅延ロードしてくれる WordPressプラグイン「Unveil Lazy Load」を紹介します。

当サイトでは、これまで画像遅延ロード・プラグインとして「BJ Lazy Load」を使っていましたが、プラグイン「Unveil Lazy Load」を使うようになりました。

プラグイン「BJ Lazy Load」だと画像の多いページで、素早くスクロールすると画像が表示されない場合があり(たまにですが……)、表示されなかった画像を表示させるためには画面を上下にスクロール必要があるため、サイトに訪れてくれた方に不快な思いをさせてしまうからです。

プラグイン「Unveil Lazy Load」だと上記の現象は起きないので、こちらを使うようになりました。

スポンサーリンク

WPプラグイン - Unveil Lazy Load

まず、プラグインのインストールと有効化を行いましょう。

インストールと有効化

WordPressのメニュー
→「プラグイン」
→「新規追加」
→「BJ Lazy Load」を検索
→「いますぐインストール」
→「有効化」します。

設定項目はありません。有効化するだけで自動的に画像が遅延ロードされるようになります。

プラグインを有効化すると画像のソースコードが次のようになります。

<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="https://webkaru.net/wordpress/wp-content/uploads/2013/05/wordpress-mamp-01-625x343.png" alt="wordpress-mamp-01" width="625" height="343" class="alignnone size-large wp-image-4559" /><noscript><img src="https://webkaru.net/wordpress/wp-content/uploads/2013/05/wordpress-mamp-01-625x343.png" alt="wordpress-mamp-01" width="625" height="343" class="alignnone size-large wp-image-4559" /></noscript>

ページロード時には 1x1 の gif画像が読み込まれ、画面のスクロールに合わせて画像を遅延ロードするようです。

スポンサーリンク

関連記事と広告