Phân trang dạng Load More cho Blogger

Một số bạn nhắc tới thủ thuật xem thêm bài đăng dưới dạng Load More như haivl. Với kỹ thuật này trong Blogspot thì chỉ cần 1 đoạn Code Javascript là các bạn có thể yên tâm với phân trang auto này. Giúp bạn không phải phân trang bằng những con số như [1] [2] [3]...
Phân trang dạng Load More cho Blogger

Demo tại Blog: Hình ảnh đẹp

Hướng dẫn thủ thuật: Phân trang dạng Load More cho Blogger

1. Vào bảng điều khiển Blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascrip
Lưu ý, cho tiện ích ngay dưới tiện ích POSTS nhé
2. Dán code dưới đây vào tiện ích vừa thêm

<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script type='text/javascript'>
(function(a){function h(){g||(g=!0,d?(b.find("a").hide(),b.find("img").show(),a.ajax(d,{dataType:"html"}).done(function(c){var c=a("<div></div>").append(c.replace(j,"")),e=c.find("a.blog-pager-older-link");e?d=e.attr("href"):(d="",b.hide());c=c.find(i).children();a(i).append(c);window._gaq&&window._gaq.push(["_trackPageview",d]);window.gapi&&window.gapi.plusone&&window.gapi.plusone.go&&window.gapi.plusone.go();window.disqus_shortname&&a.getScript("http://"+window.disqus_shortname+".disqus.com/blogger_index.js");
window.FB&&window.FB.XFBML&&window.FB.XFBML.parse&&window.FB.XFBML.parse();b.find("img").hide();b.find("a").show();g=!1})):b.hide())}function k(){var a=Math.max(f.height(),l.height(),document.documentElement.clientHeight),b=f.scrollTop()+f.height();0>a-b&&h()}var d="",b=null,i="div.blog-posts",g=!1,f=a(window),l=a(document),j=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;a(document).ready(function(){if("item"!=_WidgetManager._GetAllData().blog.pageType&&(d=a("a.blog-pager-older-link").attr("href"))){var c=
a('<a href="javascript:;" >XEM THÊM BÀI ĐĂNG</a>');c.click(h);var e=a('<img src="https://raw.github.com/techirsh/infinite-scroll-css-styles/master/images/fb-style-loader.gif" style="display: none;">');f.scroll(k);b=a('<div class="techirshloader"></div>');b.append(c);b.append(e);b.insertBefore(a("#blog-pager"));a("#blog-pager").hide()}})})(jQuery);
</script>
<style>
.techirshloader a{text-decoration:none;display:block;width:100%;color:#3772AB;}
.techirshloader{font-family:arial, helvetica, sans-serif; padding: 8px 8px 8px 8px; font-weight:bold; text-align: center; color: #3772AB; font-size: 24px;}
.techirshloader a:hover{color: #000000;}
</style>


- Chữ bôi xanh bạn thay đổi theo câu của bạn nhé
Lưu lại và xem kết quả !
Phân trang dạng Load More cho Blogger

Phân trang dạng Load More cho Blogger

Nếu bạn thấy hay thì hãy để khích lệ tinh thần chia sẻ của tác giả BV "Phân trang dạng Load More cho Blogger"

No comments:

Copyright © 2014 Thanh niên Bình Định - Supported by: IT Việt