Thủ thuật tăng tốc độ tải blog bằng Lazyload


TẠI SAO CẦN TĂNG TỐC BLOGGER

Như các bạn đã biết, việc cải thiện tốc độ blogger là một trong những yếu tố quan trọng quyết định sự thành công khi SEO bởi Google và các cỗ máy tìm kiếm rất quan tâm đến vấn đề này. Mặt khác, việc này đảm bảo sự thoải mái cho độc giả khi xem bài viết trên Blog của bạn. bạn nào càng làm blog màu mè nhiều wiget, hiệu ứng thì blog tải càng chậm.
Thủ thuật tăng tốc độ tải blog bằng Lazyload

TÁC DỤNG CỦA PLUGIN LAZYLOAD
Khi áp dụng plugin này vào Blogger, hình ảnh trên bài viết sẽ được load sau và thay vào đó nội dung bài viết sẽ được ưu tiên load trước. Chính vì thế những Blog thường xuyên có những bài viết dài hoặc nhiều hình ảnh cần áp dụng plugin này để tăng tốc độ tải trang Blogger

1. Đăng nhập vào Blog

2. Vào mẫu (Template)

3. Chọn chỉnh sửa HTML.

4. Thêm vào trước thẻ </head> đoạn mã sau:


[css]<script type=’text/javascript’>//<![CDATA[
(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: "http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50";
})})//]]></script>[/css]

5. Save template lại và kiểm tra

Share on Google Plus

Tác giả: Dưa Bở

Viết lách là thú vui những lúc nhàn rỗi, cũng là cách hoàn thiện bản thân.

0 nhận xét:

Post a Comment