12
comments
Reduce Page Loading Time in Blogger Adding JQuery Lazy Load Plugin
If your blog is contain too much images and Page Loading time of your blog is too high, then Adding jQuery Lazy Load Plug-in in you blog can help to Reduce Page Loading Time in Blogger.
Images below the fold (the ones lower than window bottom) are not loaded with help of the Lazy Load Plug-in, Means when scrolling down they are loaded only when they needed.
This post will explain to you how you can add JQuery Lazy Load Code in your blogger blog or any other website. It can reduce the page loading time of your site. You can see more details about this JQuery Lazy Load Plugin from here: http://www.appelsiini.net/projects/lazyload.
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.
Steps To Add Lazy Load jQuery Plugin in Blogger:
#Step 1. Log in to your blogger dashboard--> layout- -> Edit HTML.
#Step 2. Scroll down to where you see </head> tag .
#Step 3. Copy below code and paste it just before the </head> tag .
<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='https://sites.google.com/site/addinblogger/how-to-add-in-blogger/lazyload-min.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$("img").lazyload({placeholder : "https://sites.google.com/site/addinblogger/how-to-add-in-blogger/grey.gif",threshold : 200});
});
</script>Updates: Change the Code because of previous forbidden issues.
Nice post.I will try on my blog.As my blog is full of images(games and movies).It takes time to load.I will test it and also recommend this post to others.
www.hacknol.blogspot.com
coz i just tried...but then when i test my page speed..its the same....just copy the javascript then paste it rite? am i missing something here?
Please see my site www.thenokiagallery.com and let me know if it takes too long time. I have added the (You have provided) in the template. I will be waiting for your reply.
With Regards
Prasanta Borah
My questions is referring to Wordpress and pages.
I wan to only use Lazy Loader on my Blog page but not on the rest since it misses with how the images load.
Is there a means to only define using this plugin on a certain page?
Thanks
good info.