How To Install Lazy Load in Blogger

Read Also

Today XpertShout will share  how to install lazy load in blogger. There is a speed competition between bloggers to increase their website speed and get higher rank in google search engine. Lazy load is a new function in blogging world to increase blog speed. First you have to know that how lazy load works and how lazy load increase website speed.

How To Install Lazy Load in Blogger

First try to know lazy load function and how lazy load works in blogger to increase website speed.

Function Of Lazy Load in Blogger

Lazy load means slow loading. Slow loading does not mean to slow website. In-fact, this function will make to slow loading of scripts and css only. Javascripts and css gain too much time to load the website. So, for this purpose Lazy load works.

There no any difficulty to install lazy load in blogger. This is a simple script to install lazy load in blogger body tag. Lazy load can be installed in one step.

How To Install Lazy Load in Blogger

• Go to blogger Dashboard
• Click on Themes
• Now click on Edit HTML
• Now search for </body>
• Then just add below script above </body> tag

Install Lazy Load in Blogger Script

Here is lazy load script to install in blogger blog or website. Add this script above </body> tag.

<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 : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4NhJbF1EVo34OYHDEzEKBKBgz-YCeFEjyokCTS4xGwp4sZwKQ19GRCDUUn02wwIFEvIMUC5oAkZ4lfc-BdBzm0fMDAutqeSGPCbLEnBPc4rYJmgsZlTnsYh0HWHKlew0o0SxA77gUFH8s/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

• Now save template.

Congrats! You have successfully install lazy load in blogger.