Blogger Lazy Load Eklenti Kodları

İçindekiler

1. Blogger Lazy Load Nedir?
2. Blogger Lazy Load Nasıl Yapılır?

Blogger hızlandırma yapmak için birçok geçerli yöntem bulunmaktadır. Bunlardan birisi ise Lazy Load eklentisidir. Lazy Load kodları ile sitenizin ilk açılış hızlarına olabildiğince fayda sağlayabilirsiniz.

Blogger Lazy Load Nedir?

Lazy Load, sitenizde bulunan resim dosyalarını yüklemeyi erteleyerek sitenizi hızlandırır. Bir siteye ilk giriş yapıldığın yüklenmesi gereken dosya sayıları oldukça fazladır. Yükleme yapılan dosyalar arasında ise resimler de oldukça fazla yer kaplamaktadır. Sitenize Lazy Load uygulaması yaparak bu resimlerin yüklemesini erteleyebilir ve sitenizde kullanıcılar sitede aşağı doğru gezinme yaptığında sonradan yüklenmesini yaparak site hızınızı artırabilirsiniz.

Blogger Lazy Load Nasıl Yapılır?

Blogger panelinizde Tema bölümüne giriş yaptıktan sonra HTML’yi Düzenle diyerek tema düzenleme bölümüne giriş yapın.
Daha sonra aşağıda bulunan kodları sitenizde </body> etiketlerinin üstüne ekleyerek temanızı kaydedin.

<script type='text/javascript'> 
//<![CDATA[ 
// Lazy Load
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : -200, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : -200, container: window})","right-of-fold":"$.rightoffold(a, {threshold : -200, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : -200, container:window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCP2ar9xMgOIftnmJ_O69Ges29umVCPsq0OzH1O15xbdK71uiU21-QszRYD0f3gfn3lhiaTBd30zOvwe9njgK-nLXl_NdUTHriEm-lTf20BqzpQ6dCgbmgEYXIEOMneGa5vkeY5UZcGEaF/s40/yukleniyor.gif",effect:"fadeIn",threshold:"-200"})}); 
//]] > </script>

Bu işlemleri yaptıktan sonra Blogger (Blogspot) sitenize Lazy Load resim yüklemesini ertelemeyi uygulamış olursunuz sitenizde artık resimler aşağı doğru indikçe yüklenecektir ve site hızınız daha fazla olacaktır.