Author Topic: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin  (Read 1047 times)

0 Members and 1 Guest are viewing this topic.

Offline DE_Light

  • Lead Admin
  • *****
a Faster web hosting service
How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin



This post will explain to you howto add JQuery Lazy Load Plugin toyour blogger blog or any other website easily.
If you have a blogor website containing many images, this tricks will be very helpful to you. It can reduce the page loading time of your site. You can see more details about this JQuery Lazy Load Plugin.

Lazy loader is a jQuery plugin written in JavaScript. It delays loading of images in (long) web pages . Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them. Using lazy load on long web pages containing many large images makes the page load faster. Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load.

How To Reduce Page Loading Time in Blogger By Adding JQuery Lazy Load Plugin?

STEPS TO FOLLOW BELOW

1. Go to your Blogger Dashboard > Template > Edit HTML .

2. Search (Ctrl   F) for </head> Tag.

3.Copy below code and paste it just before the </head> tag .


Code: [Select]
<script src='http://beautifulbloggerwidgets.googlecode.com/files/lazyload-min.js' type='text/javascript'/><script charset='utf-8' type='text/javascript'>$(function() {$(&quot;img&quot;).lazyload({placeholder :&quot;http://beautifulbloggerwidgets.googlecode.com/files/grey.gif&quot;,threshold : 200});});</script>
Note : You can download java script files from here if you want to host above files yourself.
4. Now save your template and you are done.Refresh your site to see the result.

Source: Click here!
« Last Edit: August 24, 2012, 03:42:04 AM by DE_Light »

Offline obasimiracle

  • Support Expert
  • *****
this is interesting specially high image bloggers are for sure gonna enjoy this
Wisdom pays! Be wise!

dspacedude

  • Guest
You can also reduce your blog page speed by compressing your css codes...

Offline DE_Light

  • Lead Admin
  • *****
this is interesting specially high image bloggers are for sure gonna enjoy this

thanks for droping ur comments...

Offline DE_Light

  • Lead Admin
  • *****
You can also reduce your blog page speed by compressing your css codes...

quite right, but dats a long job, for high class bloggers that blog about big images on their blog. The jquerry codes does it with easy for them. Thanks for dat method too.

cisprakash

  • Guest
Re: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin
« Reply #5 on: September 06, 2012, 12:53:48 PM »
Yahh This is really great concept here, i have gone through the code where you have use JavaScript as well as JQuery but i am little bit confused with "lazyload", Is it predefined method ?

Online zeal

  • Lead Admin
  • *****
Re: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin
« Reply #6 on: September 07, 2012, 10:45:52 AM »
Yahh This is really great concept here, i have gone through the code where you have use JavaScript as well as JQuery but i am little bit confused with "lazyload", Is it predefined method ?
have you resolved it?
zealous for perfection

Offline DE_Light

  • Lead Admin
  • *****
Re: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin
« Reply #7 on: September 07, 2012, 07:20:17 PM »
Quote from: cisprakash
Yahh This is really great concept here, i have gone through the code where you have use JavaScript as well as JQuery but i am little bit confused with "lazyload", Is it predefined method ?


Just explain were you are confused? So i can let you in. And remember, before you can do it, you must have a little knowledge of HTML Editting before you can do it. You can use the above link to learn it and also learn about tags, etc.







cisprakash

  • Guest
Re: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin
« Reply #8 on: September 10, 2012, 08:45:09 AM »
Quote from: cisprakash
Yahh This is really great concept here, i have gone through the code where you have use JavaScript as well as JQuery but i am little bit confused with "lazyload", Is it predefined method ?


Just explain were you are confused? So i can let you in. And remember, before you can do it, you must have a little knowledge of newbielink:http://www.w3schools.com [nonactive] Editting before you can do it. You can use the above link to learn it and also learn about tags, etc.

Well i am having a knowledge of HTML, CSS, Java Script, JQuery but i am little bit confused with "lazyload", Is it predefined method ?

Offline ebenzunlimited

  • Lead Admin
  • *****
Re: How To Reduce PageLoading Time in Blogger By Adding JQuery Lazy Load Plugin
« Reply #9 on: September 16, 2012, 12:37:26 AM »
Compressing your css code helps a lot to reduce load time. use http://www.csscompressor.com/ to compress your css code.

for blogger (.blogspot) just copy the codes between
Code: [Select]
    <b:skin><![CDATA[/*
Code: [Select]
]]></b:skin> and replace them with the cpmpressed code.
Insane I Lived♥ Sane I Died♥<img src='http://i253.photobucket.com/albums/hh74/reallytired2/family%20pictures/buckeye%20stuff/clap.gif' />

cisprakash

  • Guest
Great this really works well, thanks for it.

Offline DE_Light

  • Lead Admin
  • *****
I think that could help u too.
« Last Edit: October 28, 2012, 03:01:08 PM by DE_Light »

 


Inside: 3P Techies Blog

* Newest Techies

Get Updates


Sign up to get latest updates delivered to your inbox. No Spam, We Promise!

Get Hosting!

a Faster web hosting service

Copyright 3rd Planet Techies. All rights Reserved.

Top || Mobile ||Advertise || Contact Us || Privacy