How to Add Lazy Load for Images in Blogger Blogs

How to Add Lazy Load for Images in Blogger Blogs

Make you Blogger blog load faster by adding Lazy Load feature for the all the images in your Blogger blog and increase its performance.

For webmasters and web developers who wants their website’s and blog’s to load faster in browsers Lazy Load is well known name. There are many easy solutions for to implement Lazy Load in your website if you are using WordPress or any other system.

 

Except for us Blogger users there’s no plugin or simple code to use Lazy Load. However with a little outside of the box thinking Lazy Load can be used in Blogger.

In this post we are going use a jQuery lazy load solution that is fast and easy to implement in the Blogger blog. Not only the post images, every images of every widget/gadget or section of your blog can be lazy loaded and it will cause absolutely no problem to your blog’s functionality, design, content, SEO, or whatever you are worried about.

Lazy load is a super pro-feature that will make you blogger blog awesome but it will take some focused hard work too implement this.

What is lazy Load?

Lazy loading is a design pattern commonly used in computer programming. Its purpose is to defer initialization of an object until the point at which it is needed. In other words load things when they are needed not loading them all at the sometime. Lazy Load in websites loads objects (i.e.. image, iframe) only if any only that is in the user’s browser viewpoint size is at that time. Instead of loading all the elements at once load then in need to load basis.

Why Should You Use Lazy Load in Your Blogger Blog

Many will ask why use this but the question should be why not. Our website’s and blog’s are no longer just a webpage with some text and one or two pictures. They are now filled with images, embedded elements, social media buttons and badges, advertisements, slides, and many other must use items. In spite of loading all at once, load them only when the object comes to the viewpoint of the user’s viewpoint.

Lazy load is truly for the users or visitors benefit. Throwing all the data of the website at once to browser to load may cause the impression that the website is going to take forever to load. This could lead to a performance hit.

These tips in this post are for anybody who is using Google’s Blogger platform; especially for:-

  • The brilliant custom Blogger template makers. They spend very long time to develop the beautiful looking and functional blogger templates. And many of them release the templates for free of charge.Some of them try sale the template in places like freelancer.com, themeforest.Unfortunately many of the custom made templates fails in speed test. They are awesome and but sometime they take an awful long time to load. Adding lazy load to you blogger template means a new super professional features to you Blogger template which attract more free-users downloads and/or buyer.
  • The professional or want to be professional blog’s hosted in blogger.
  • Blog’s which uses a lot of image everywhere.
  • Blogger’s who care about their visitors comfort and bandwidth.
  • If you are tired of the slowness of you blogger blog.
  • Anybody who is using blogger for blogging, learning, earning.

Adding Lazy Load in blogger requires making serious change in your blogger blog’s template and entire template. Before making any changes you must backup you blogger template.

Enough chit chat; in this post we are going to try to use lazy load for images and other elements in our Blogger/Blogspot blog.

Add jQuery in Blogger

First we will need to use jQuery in our blog. All most all the custom made blogger templates available uses jQuery as it helps to add many pro elements in the blogger blog like; related posts, pagination, next and previous post and much more.

If you are using the default templates given by blogger then your blog probably do not use jQuery in you blog. Try this tool to check if you are using jQuery in your blog.

For this particular solution you will need jQuery version 1.7 or above. I am going to use jQuery v1.11.1 for this.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

If you are not using the jQuery then;

  1. Go to Blogger dashboard > template > click ‘Edit HTML‘.
  2. Find </body> and paste the jQuery code just before it. Please note; I am assuming that you are not using jQuery and any other elements that uses jQuery. So I am calling it as late as possible but you can put this in any part of the blog. Many use this just above </head>.
  3. Save template.

The jQuery should be used before any other element and script that uses jQuery.

Add Lazy Load codes in Blogger

This particular solution is given by ressio.in which one of the popular lazy load solution. It is a fast and mobile-oriented jQuery plugin for lazy loading of images/videos/iframes with build-in support of jQueryMobile framework. Works find in in IE 6-11, Chrome 1-31, Firefox 1.5-27.0, Safari 3-7, Opera 10.6-18.0, iOS 5-7, Android 2.3-4.4, Amazon Kindle Fire 2 and HD 8.9, Opera Mini 7.

We are going to try and implement this in the blogger:-

  1. Again go to the template editor of Blogger.
  2. Find </body>.
  3. Paste the following JavaScript code just before it and click ‘Save template‘.
<script type='text/javascript'>//<![CDATA[
/*! Lazy Load XT | (C)2014 RESS.io | MIT License
 * BLOGGER Implementation by Muntasir Minhaz http://www.techinfoknow.com/2014/08/lazy-load-blogger.html */
(function($,window,document,undefined){var lazyLoadXT='lazyLoadXT',dataLazied='lazied',load_error='load error',classLazyHidden='lazy-hidden',docElement=document.documentElement||document.body,forceLoad=(window.onscroll===undefined||!!window.operamini||!docElement.getBoundingClientRect),options={autoInit:true,selector:'img[data-src]',blankImage:'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7',throttle:99,forceLoad:forceLoad,loadEvent:'pageshow',updateEvent:'load orientationchange resize scroll touchmove focus',forceEvent:'',oninit:{removeClass:'lazy'},onshow:{addClass:classLazyHidden},onload:{removeClass:classLazyHidden,addClass:'lazy-loaded'},onerror:{removeClass:classLazyHidden},checkDuplicates:true},elementOptions={srcAttr:'data-src',edgeX:0,edgeY:0,visibleOnly:true},$window=$(window),$isFunction=$.isFunction,$extend=$.extend,$data=$.data||function(el,name){return $(el).data(name)},$contains=$.contains||function(parent,el){while(el=el.parentNode){if(el===parent){return true}}return false},elements=[],topLazy=0,waitingMode=0;$[lazyLoadXT]=$extend(options,elementOptions,$[lazyLoadXT]);function getOrDef(obj,prop){return obj[prop]===undefined?options[prop]:obj[prop]}function scrollTop(){var scroll=window.pageYOffset;return(scroll===undefined)?docElement.scrollTop:scroll}$.fn[lazyLoadXT]=function(overrides){overrides=overrides||{};var blankImage=getOrDef(overrides,'blankImage'),checkDuplicates=getOrDef(overrides,'checkDuplicates'),scrollContainer=getOrDef(overrides,'scrollContainer'),elementOptionsOverrides={},prop;$(scrollContainer).on('scroll',queueCheckLazyElements);for(prop in elementOptions){elementOptionsOverrides[prop]=getOrDef(overrides,prop)}return this.each(function(index,el){if(el===window){$(options.selector).lazyLoadXT(overrides)}else{if(checkDuplicates&&$data(el,dataLazied)){return}var $el=$(el).data(dataLazied,1);if(blankImage&&el.tagName==='IMG'&&!el.src){el.src=blankImage}$el[lazyLoadXT]=$extend({},elementOptionsOverrides);triggerEvent('init',$el);elements.push($el)}})};function triggerEvent(event,$el){var handler=options['on'+event];if(handler){if($isFunction(handler)){handler.call($el[0])}else{if(handler.addClass){$el.addClass(handler.addClass)}if(handler.removeClass){$el.removeClass(handler.removeClass)}}}$el.trigger('lazy'+event,[$el]);queueCheckLazyElements()}function triggerLoadOrError(e){triggerEvent(e.type,$(this).off(load_error,triggerLoadOrError))}function checkLazyElements(force){if(!elements.length){return}force=force||options.forceLoad;topLazy=Infinity;var viewportTop=scrollTop(),viewportHeight=window.innerHeight||docElement.clientHeight,viewportWidth=window.innerWidth||docElement.clientWidth,i,length;for(i=0,length=elements.length;i<length;i++){var $el=elements[i],el=$el[0],objData=$el[lazyLoadXT],removeNode=false,visible=force,topEdge;if(!$contains(docElement,el)){removeNode=true}else if(force||!objData.visibleOnly||el.offsetWidth||el.offsetHeight){if(!visible){var elPos=el.getBoundingClientRect(),edgeX=objData.edgeX,edgeY=objData.edgeY;topEdge=(elPos.top+viewportTop-edgeY)-viewportHeight;visible=(topEdge<=viewportTop&&elPos.bottom>-edgeY&&elPos.left<=viewportWidth+edgeX&&elPos.right>-edgeX)}if(visible){triggerEvent('show',$el);var srcAttr=objData.srcAttr,src=$isFunction(srcAttr)?srcAttr($el):el.getAttribute(srcAttr);if(src){$el.on(load_error,triggerLoadOrError);el.src=src}removeNode=true}else{if(topEdge<topLazy){topLazy=topEdge}}}if(removeNode){elements.splice(i--,1);length--}}if(!length){triggerEvent('complete',$(docElement))}}function timeoutLazyElements(){if(waitingMode>1){waitingMode=1;checkLazyElements();setTimeout(timeoutLazyElements,options.throttle)}else{waitingMode=0}}function queueCheckLazyElements(e){if(!elements.length){return}if(e&&e.type==='scroll'&&e.currentTarget===window){if(topLazy>=scrollTop()){return}}if(!waitingMode){setTimeout(timeoutLazyElements,0)}waitingMode=2}function initLazyElements(){$window.lazyLoadXT()}function forceLoadAll(){checkLazyElements(true)}$(document).ready(function(){triggerEvent('start',$window);$window.on(options.loadEvent,initLazyElements).on(options.updateEvent,queueCheckLazyElements).on(options.forceEvent,forceLoadAll);$(document).on(options.updateEvent,queueCheckLazyElements);if(options.autoInit){initLazyElements()}})})(window.jQuery||window.Zepto||window.$,window,document);(function($){var options=$.lazyLoadXT;options.selector+=',video,iframe[data-src]';options.videoPoster='data-poster';$(document).on('lazyshow','video',function(e,$el){var srcAttr=$el.lazyLoadXT.srcAttr,isFuncSrcAttr=$.isFunction(srcAttr);$el.attr('poster',$el.attr(options.videoPoster)).children('source,track').each(function(index,el){var $child=$(el);$child.attr('src',isFuncSrcAttr?srcAttr($child):$child.attr(srcAttr))});this.load()})})(window.jQuery||window.Zepto||window.$);
//]]></script>

Please remember that the jQuery should be above of this code always. Do not remove the license comment at top of the code. The coder tried hard to build this and I tried had to run this in Blogger.

You have just added the codes of Lazy Load but still the main work is remaining.

Basic Setting of Lazy load: Required Changes for Image and iframe Tags

Image tags in html looks like this;

<img src='bloggerimage.png' width='200px' height='200px' title='maybe a title text' alt='maybe a alt text'/>

Now for lazy loading we need to change the only src='...' to data-src='...'; like this:

<img class='lazy' data-src='bloggerimage.png' width='200px' height='200px' title='maybe a title text' alt='maybe a alt text'/>

Now the image will be lazy loaded. As you see here; src='...' to data-src='...' and a class='lazy' is added and both is a must.

It is wise to add a noscript tag for the images in case users wonder in you website disabling the JavaScripts:-

<img class='lazy' data-src='bloggerimage.png' width='200px' height='200px' title='maybe a title text' alt='maybe a alt text'/>
<noscript>
<img src='bloggerimage.png' width='200px' height='200px' title='maybe a title text' alt='maybe a alt text'/>
</noscript>

Now image will load even if the JavaScript is disabled. Inside the noscript tag do not change src="..." to data-src="..." and do not add class="lazy".

For iframe add use data-src="...." instead of sre="..." in the tag; like this:-

<iframe data-src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Ftechinfoknow%2F&amp;width=280&amp;height=62&amp;colorscheme=light&amp;show_faces=false&amp;header=true&amp;stream=false&amp;show_border=true&amp;appId=282574525118582" scrolling="no" frameborder="0" rel="nofollow" target="_blank" style="border:none; overflow:hidden; width:280px; height:62px;" allowtransparency="true"></iframe>

YouTube videos are also can be emmeded using iframe and they can be lazy loaded by doing the same simple thing:-

<iframe allowfullscreen="" class="lazy" data-src="//www.youtube.com/embed/pcnCF1brqWs&rel=0" frameborder="0" height="480" width="640"></iframe>

Now that’s you have an idea how lazy load for images and iframes works. Let’s try to implement it in blogger’s different parts.

Lazy Load the Post Images in Post Pages of Blogger

Normally images after uploading an image in post editor it will look like this in HTML of post editor:-

<a herf='bloggerimage.png.jpg'>
<img title='maybe a title text' class="lazy-loaded" height="600" width="800" src="bloggerimage.png.jpg" alt="maybe a alt text"></a>

Change this to:-

<a herf='bloggerimage.png.jpg'>
<img class="lazy" title='maybe a title text' height="600" width="800" data-src="bloggerimage.png.jpg" alt="maybe a alt text">
<noscript>
<img title='maybe a title text' height="600" width="800" src="bloggerimage.png.jpg" alt="maybe a alt text">
</noscript>
</a>

Remove the <a> tag completely if you do not want the images to be clickable. As mentioned right above; the src="..." will become data-src="...", class="lazy" will be added and for noscript tag there will be no change.

If you have done all the above that means the in the post image will be lazy loaded in the post pages.

Lazy Load Images in the Default gadgets/ widgets, Snippet Images and Other Parts of Blogger Blog

This part is very tricky and requires making huge changes in you blog’s template. You need not only to lazy load images of widgets or gadgets; such as; Popular Posts, Author info and bio, search results from the default blogger search box and more. Also require to add lazy load to the images in the post summaries (read more post summaries) of the home and index pages. These need to be updates from the template and they are very tricky.

However we are going to add lazy load value to all of them. First let’s know a little basic thing. Go to you template and just look for the <img (image tag) in you blogger template. Almost in ever one you will find something like this;

<img expr:src='data:something.something' ..... />

The <img tags will come with expr:src='' instead of src=''. It’s the same actually; it’s basically telling that get the image from something.something. Now inside of the something.something part you will find thing like these;

  • data:sourceUrl : Load the header image/blog’s logo. I suggest you to leave the header image along as it’s the first think your blog that loads. So there’s no need to lazy load this.
  • data:blog.postImageUrl : Loads the first image of your blog.
  • data:post.thumbnail : Loads the thumbnails; the 72×72 sized cropped images of your blog posts.
  • data:post.thumbnailUrl : Also loads the thumbnails.
  • data:post.authorPhoto.url : Loads the profile picture from your blogger or Google plus account.
  • And more like this.

Now to lazy load them all we need to do in something like this;

<img class='lazy' expr:data-src='data:something.something' ..... />

As you see I just change it to expr:data-src='data:something.something'. Adding the data-src='' that is required for lazy loading. Do not worry this will work perfectly. Also added the class='lazy' to. I do not think the <img tags you will come across will have any class attribute before adding it, unless you or the template designer added it. Also you may want to add a noscript tag for the image too.

<img expr:data-src='data:something.something' ..... />
<noscript>
<img expr:src='data:something.something' ..... />
</noscript>

As you see it’s the same principle. Now let’s see the example below for changes in the popular posts widget images.

    1. If you are using the blogger’s default popular posts and you show images with them then;
      In the blogger template editor Look for <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'> or use the ‘Jump to widget‘ button on it to go to the popular posts.
    2. Look for this <div class='item-thumbnail-only'> inside it
    3. Inside that you will find a <img tag like this; 
      <img alt='data:post.title' border='0' expr:src='data:post.thumbnail' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize'/>
    4. Just change the expr:src='data:post.thumbnail' to expr:data-src='data:post.thumbnail' and add the class='lazy'. Also are a noscript tag along like this; 
      <img alt='data:post.title' border='0' class='lazy' expr:data-src='data:post.thumbnail' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize'/><noscript><img alt='data:post.title' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/></noscript>
    5. After that save you template and you will see the lazy load working just fine and the images also appear when JavaScript loading is turned oof in the browser.

I think this example help you to understand the point. Just find expr=src='' in an <img tag and make necessary changes to it. It’s not that complicated as its sound. And these changes will not cause and problem to your blogger template, blog’s design and in loading the blog.

Lazy Load for Images of Auto Generated Widget or Gadgets via JavaScripts of Blogger

New custom made templates are getting more and more complex for the average user and most of them come with little or no instruction to edit. That makes it harder to implement Lazy Load in blogger. But still we can use lazy load for images in other parts of blogger. It will be difficult than before but we can still do it.

It will be tricky to use Lazy Load in the auto generated gadget/widgets by JavaScript for an average Blogger user. Most custom made blogger blog’s use them. Widgets or gadgets like related post, features posts, label wise posts, and more like then are generated by JavaScript and most of them requires jQuery.

This means one part of the job is done; adding jQuery to blog. These gadgets generates post link and details with images which are sometimes unavoidable for providing a better user experience to visitors.

Despite this you can easily implement lazy load for images generated by these auto generated widgets. Let’s see the following example:-

<!-- label wise recent post -->
<script defer='defer' type='text/javascript'>
hposts=5;imgr = new Array();showRandomImg = true;aBold = true;summaryTitle = 250;
function showhomeposts(json) {j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;img  = new Array();for (var i = 0; i < 15; i++) {var entry = json.feed.entry[i];var posttitle = entry.title.$t;var pcm;var posturl;if (i == json.feed.entry.length) break;for (var k = 0; k < entry.link.length; k++) {if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href;break;}}
var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error) {s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src="",a);c=s.indexOf(""",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}else thumburl='http://3.bp.blogspot.com/-zP87C2q9yog/UVopoHY30SI/AAAAAAAAE5k/AIyPvrpGLn8/w200/picture_not_available.png';}if (i==0) {

var trtd = '<a title="'+posttitle+'" alt="'+posttitle+'" href="'+posturl+'"><div id="plw" class="plw"><div class="entry"><div class="feature-image"><img class="wimage" src="'+thumburl+'" title="'+posttitle+'" alt="'+posttitle+'"><h2 class="onetittle" >'+posttitle+'</h2></div></div></div></a>';

document.write(trtd);}
else{var trtd = '<a href="'+posturl+'"><div class="widgeth"><li>'+posttitle+'</li></div></a>';document.write(trtd);}j++;}}
</script>
<!-- Goes in widget content -->
<script type='text/javaScript'>
    document.write( & quot; & lt; script src =  & quot;
    /feeds/posts /
    default / -/LABEL?max-results="+hposts+"&orderby=published&alt=json-in-script&callback=showhomeposts"></script>");
</script>

On the above example in line-7 find <img class="wimage" src="'+thumburl+'" title="'+posttitle+'" alt="'+posttitle+'">. It indicates the HTML class of the image and its source. Actually the entire line-7 indicates what the HTML of generated gadget will look like.

You will find something similar in your auto generated widgets like this. In most cases there will a line or section in the main JavaScript code where you will find the possible HTML which indicates the structure of the generated widget. It also requires for building CSS styles for them.

Now coming to the line-7 again where we will add the lazy load settings for the images;

  • Find <img class="wimage" src="'+thumburl+'" title="'+posttitle+'" alt="'+posttitle+'">.
  • We are going to change the class to or add class="lazy" and change the src="+thumburl+" to data-src="+thumburl+"..
  • After replacing it will look like this:- <img class="wimage" src="'+thumburl+'" title="'+posttitle+'" alt="'+posttitle+'">.

Done. Now images generated by this gadget will be lazy loaded. For auto generated widgets like related post, recent post, featured or label wise post and others this is what you have to do. Find the HTML setting in the JavaScript and add required thing for lazy load. Unless they are encoded; you will easily find them.

Right now I am using this kind of solution in the related posts section of my blog. Ask the person who have made the blogger template and/or ask the author who have given you the widget code and tutorial. Also I will try to help.

SEO Impact of Lazy Load

Many say that adding a lazy load feature will increase your rank in Google and other search engines. There are others who say it does completely opposite of that because of the empty src attribute in the <img tag of the websites. Both assumptions are somewhat wrong and also right. Actually it’s complicated but let’s simplify.

Dose it increase search engine rank?

Remember; you are adding lazy load only for the images, videos and iframes in you website or blog. It stops visitor’s browser to load all the images at once instead the images are loaded only when they come in the view port of the user’s or visitor’s browser.  In most cases the lazy load will increase the page speed, or at least reduce the time takes loading all the images in webpage.

You might be using lazy load but for other elements in you website it might be still slow to load. Improving the perceived performance of your site for users can really help your rankings.

Google is concerned about page speed it’s old news. If fewer people bounce back to the search results because of performance problems with your site, your rankings will improve. So just adding lazy load will not increase you visits and page views, a fast loading website will; provided that your website is containing original content and on-page SEO is done properly.

Dose it reduce search engine rank?

Lazy load do not increase and certainly not responsible for decrease in the rank of your site. I have not found any examples where the website’s rank went down because of lazy load.

Only slight problem is that Google will not be able to index your images for image search but there’s remedy for that too. There are some easy technical fixes such as:

  • Use <noscript> tags that show the images for users that don’t have JavaScript enabled and search engine bots. As you noticed I have incoraged this in the whole post.
  • This is a better solution; link to your images. 
    <a href="/imageblogger.png "><img data-src="/imageblogger.png"…..></a>

It doesn’t seem to matter to image search whether the image is in the <img src or in the a href. So the above snippet would get the image lazy loaded and the full size image linked will be indexed in image search.

For blogger it’s easy as after uploading the post editor shows the images in linked form. Also by resizing the Google photos or picasa images you can load a smaller sized image in the blog and the original sized image will be indexed.

How Fast the Lazy Load Will Make a Blogger Blog

Lazy load will make you blog faster than before most certainly. But it’s not the only factor to truly making your blog loading fast. Instead of lading all the images of a blog pages from top to bottom at once; Lazy Load will load you images one by one as visitors scroll down top to bottom. Not only to the destop viewer also to the mobile viewers too.

Most mobile devises run on a low-speed internet connection and also they have problems loading websites that contains large dates; especially the images. Lazy Load will help you mobile viewer to load you blog smoothly.

Lazy Load You can also use lazy load for iframe items, like Facebook like box and button, YouTube video. No matter how much codes you have in your blogger blog or website, images are the ones that takes most of the bandwidth and you should optimize their loading by lazy load.

Suggestion and CSS codes for Beautifying the Use Lazy Load

I suggest you that:-

  • Only after completely writing a new post, implement these changes for lazy loading images.
  • Copy the entire post’s HTML from the post editor and save it in a notepad. Then make the changes in the codes. Update/publish you post and see if they are working.
  • If you have lot of post in your blog then I suggest you do this from newer to older posts.
  • Do not rush into making these changes.
  • If your blog has too many posts do not rush in changing them. Do this changes one post at a time. Check if it’s working properly even in noscript. Then movie to another post.

Use these CSS codes to beautify and avoid problems in Lazy Load. If you use a responsive template and after uploading an image if you fix the width and height of it in the post editor; then you will need to add this CSS code in your template:-

@media screen and (max-width: 700px)
.post img {
width: auto !important;
height: auto !important;
max-width: 100% !important;}

Change (max-width: 700px) according to you templates style and settings to change the width and height of the image in smaller screen. Add to any existing <style> tag of your blogger template.

Use the following in your CSS code for a fade-in load effect of images.

.lazy-hidden{opacity:0;background:#038D1A url('http://2.bp.blogspot.com/-bL-eL_VIl2A/UoHFt0i8-wI/AAAAAAAAFI8/vn7h5nIbz6A/s1600/bs+loading+dot.gif') no-repeat center}
.lazy-loaded {-webkit-transition: opacity 0.4s;-moz-transition: opacity 0.3s;-ms-transition: opacity 0.4s;-o-transition: opacity 0.4s;transition: opacity 0.4s;opacity: 1;}

You can try your code for style and loading effect and add to any existing <style>.tag of your blogger template.

Use this code below so that the blog and images do not look wired in noscript mode;

<noscript>
<style>img.lazy{display:none;}</style>
</noscript>

Make changes to these posts according to you Blogger template design.

At the end; I hope the post gives the whole picture about Lazy Load and using it in Blogger blogs. You probably have question regarding this tip even you have great knowledge of blogger templates and codes like HTML, CSS, JavaScript. Do put forward them in the comments box and I will try my best to solve them. Thanks for reading.

Posted by Tech News | Leave a Comment  

Tags: blogger

Tech News

Tech Info Know

Comments are closed.

© Tech Info Know   Technology News  About  Web Design by Enterpriser UK