Bloggerに画像を遅延表示させるプラグインを導入してみました lazyload



最近ブログでよく見かける
Lazyload
スクロールすると画像がホワッと出てくるアレです
ブログを読み込みの際に画像を見える部分だけを読み込むので
ブログの表示が速くなるというメリットがあります
あと、カッコいいと思います
導入は簡単ですので
是非如何ですか??
DSC_8295

まず
Bloggerの管理画面から
「デザイン」→「HTML編集」を選択
「テンプレート編集」の項目で
ウィジェットのテンプレートを展開にチェックを付けます
その下のコードがズラズラならんでいますが
</head>という項目を探して
その直前に下記のコードを追加すれば完了です


<!-- Start jQuery -->
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>google.load(&quot;jquery&quot;, &quot;1.4&quot;);
</script>
<!-- End jQuery -->

<!-- Start Lazy Load -->
<script src='<a href="http://sites.google.com/site/customizeyourblogger/jquery.lazyload.mini.js">http://sites.google.com/site/customizeyourblogger/jquery.lazyload.mini.js</a>' type='text/javascript'/>
<script type='text/javascript'>$(function() {$(&quot;.post-body img&quot;).lazyload({
effect : &quot;fadeIn&quot;});});
</script>
<!-- End Lazy Load -->


①プラグインの動作に必要なJqueryの読み込みを設定

②実際にLazyloadと呼ばれる遅延ロードのプラグインを読み込み

これだけで導入でき

かつブログの表示が速くなるので

是非お試し下さい

  • コメント: 0

関連記事

  1. Tips

    テレビやネットでの印象操作グラフの実例が面白い 物事の見方が正しくなるかも

    色々な物事・様々な写真などをまとめているネットサービスNAVE…

  2. Tips

    【解決】Youtubeからフィードやおすすめ動画の表示を削除する方法

    Youtubeのトップ画面がいつの間にか賑やかになっておすすめ…

  3. Tips

    IEの自動アップグレード開始!!とうとうIE6が無くなる!

    先日よりちょっとした話題になっていたIE、Internet Explo…

  4. Tips

    【Tips】 間違って消してしまったChrome内のブックマークを復旧させる方法

    Chromeで間違って消してしまったブックマークを復旧させるという記事…

  5. Tips

    関西電力から計画停電の案内が届きました。 お知らせメール登録しました

    いよいよ関西にも計画停電の案内が来ました。ただこのハガキですが…

  6. Tips

    お宅のルータは大丈夫?? 初期パスワードで使っている人は要注意

    AdobeFlashPlayerの修正を装った不正プログラムに…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

PAGE TOP