WIDGET BÀI VIẾT NGẪU NHIÊN LOAD SIÊU NHANH CHO BLOGSPOT

Đã Xuất Bản
Một trong những tiện ích mình kiêng kỵ nhất là Random Posts, bởi tiện ích này tải toàn bộ dữ liệu từ feed về, không những làm chậm tốc độ cho blog mà còn không chính xác với blog có trên 500 bài viết - đây là con số bài viết tối đa được feed tải về. Bởi vậy nhiều Blogger đã e ngại sử dụng tiện ích này.
Trong tiện ích mình giới thiệu sau đây được lấy JS từ tiền bối Duy Phạm thay vì 1 lần tải toàn bộ feed thì mình tải lần lượt theo số bài viết muốn hiển thị và chỉ lấy duy nhất 1 bài trong 1 lần tải. Trước đó sẽ có 1 lần tải dữ liệu đầu tiên từ feed để xác định tổng số bài viết hiện có, 1 hàm lấy ngẫu nhiên 5 số khác nhau từ 1 đến tổng số bài viết. Ví dụ muốn hiển thị 5 bài viết ngẫu nhiên thì sẽ có 6 lần tải feed, mặc dù số lần lấy nhiều nhưng dung lượng 1 lần lấy lại nhỏ. Khối lượng chỉ tương đương với blog bạn có tổng số bài viết là 6, so sánh vậy để thấy nếu blog càng nhiều bài viết thì tiện ích này có tốc độ nhanh hơn kiểu tải toàn bộ feed rất nhiều lần




Các bước thực hiện
Bước 1: Đăng nhập Blogger > Chủ đề  > Chỉnh sửa HTML > Chèn CSS dưới đây vào dưới thẻ <style>:
#random-posts img{float:left;margin-right:10px; background:#FFF;width:50px;height:50px; border-radius: 50%}
.li_rd_post_tkn {margin-bottom: 7px!important; list-style: none; line-height: 23px; padding: 0!important; margin-top: 0!important; margin-left: 0!important; margin-right: 0!important}
.a_rd_post_tkn {
color: #000!important;
text-decoration: none!important;
font-family: Roboto;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
}
.svc_rd_post {
font-size: 14px;
font-family: Roboto;
font-weight: 400;
color: #878787;
padding-top: 3px;
}
.rcs_tkn1 {
background: #f4f4f4;
padding: 2px;
padding-left: 10px;
padding-right: 10px;
border-radius: 13px;
}
.lifatkn { padding-left: 10px;
padding-right: 1px;}

Bước 2: Chèn đoạn code sau vào vị trí muốn hiển thị trong HTML blogspot: (Hoặc bạn có thể vào Bố cục > Thêm tiện ích > HTML/Javascript, chèn đoạn code dưới vào):
<ul id='random-posts' style='margin: 0!important; padding: 0!important'>
<script type='text/javaScript'>
var rdp_numposts=5;
var rdp_snippet_length=150;
var rdp_info='yes';
var rdp_comment='bình luận';
var rdp_disable='Tắt bình luận';
var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};
</script>
<script type='text/javaScript'>
function random_posts(json){a=location.href;y=a.indexOf('?m=0');for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;if(y!=-1){rdp_posturl=rdp_posturl+'?m=0'}var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="http://lh3.ggpht.com/--Z8SVBQZ4X8/TdDxPVMl_sI/AAAAAAAAAAA/jhAgjCpZtRQ/no-image.png"}}};document.write('<li class="li_rd_post_tkn">');document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a class="a_rd_post_tkn" href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<div class="svc_rd_post"><span class="rcs_tkn1">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+'</span> <i class="fa fa-comments lifatkn" aria-hidden="true"></i> <span class="time_tkn1">'+rdp_commentsNum)+'</span></div>'}document.write('<div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};
</script>
</ul>

Bước 3: Lưu chủ đề và hưởng thụ.
Bây giờ bạn sẽ không còn e ngại bởi tốc độ load trang khi sử dụng random post nữa nhé !
Chúc các bạn thành công !
Mọi hình ảnh/bài viết trên trang web này điều được tự mình design hoặc sưu tầm từ các trang khác ! Mọi hành động Copy & Reup vui lòng ghi rõ nguồn Lê Anh Đức

Bài Viết Bạn Nên Xem


63 bình luận

Hãy cùng tham gia bình luận về bài viết này nhé!

  1. Cái này người ta gọi là 'quá dữ'

    Trả lờiXóa
  2. Nên để cái lưu ý là: Nhớ sữa khanhblogger.com thành tên miền của các bạn :)

    Trả lờiXóa
  3. :v chỉ làm nút ủng hộ tôi đi anh

    Trả lờiXóa
    Trả lời
    1. bottom này bên CODEDAYROI. để a xin phép admin r share cho mn nhá

      Xóa
  4. Khanh ơi ! Làm bài hd về code popular post của temp fb parody của Pc đi

    Trả lờiXóa
    Trả lời
    1. cái đó hỏi a Cường đi bạn chứ mình không lưu CSS gì hết

      Xóa
  5. không chỉ nhẹ mà còn đẹp =))

    Trả lờiXóa
  6. Khanh thật đẹp trai, hãy như Khanh

    Trả lờiXóa
  7. Nhận xét này đã bị quản trị viên blog xóa.

    Trả lờiXóa
  8. sao đăng nhập vào khanhblogger lại redirect sang blogger hả em :v

    Trả lờiXóa
    Trả lời
    1. thì nó là đăng nhập blogger mà. khi a đăng nhập rồi mà click vào đăng nhập nữa là nó tự chuyển sang blogger. còn nếu a là admin khanh blogger đăng nhập vô là nó chuyển sang blogger - khanh blogger

      Xóa
  9. Trả lời
    1. bản thân admin đã đẹp thì cái gì cũng cần phải đẹp :v

      Xóa
  10. Thêm tiện ích này bị treo trình duyệt.

    Trả lờiXóa
  11. Theme này hay nha, có nhiều cái để bắt chước :D

    Trả lờiXóa
  12. Ủa e làm cái ẩn bớt cmt đi rồi đấy à ?

    Trả lờiXóa
  13. Chờ Khanh làm cái thumbnail group fb để nhếch về mà lâu quá trời :3

    Trả lờiXóa
    Trả lời
    1. https://static.xx.fbcdn.net/rsrc.php/v3/yk/r/LOOn0JtHNzb.gif
      đó a :v

      Xóa
    2. nhầm :v cái này nè a :v
      https://scontent.fdad3-2.fna.fbcdn.net/v/t1.0-0/p480x480/29389211_2004858806501513_2667822316049661952_o.jpg?oh=d3d16c0ee1f3bc18265baa310cf49247&oe=5B31FE6C

      Xóa
    3. sao ko hiện nhỉ
      https://i.imgur.com/a8tnGU5.jpg

      Xóa
    4. Cái này cho rõ
      https://imgur.com/a/PeEiy.png

      Xóa
    5. Méo hiện :v
      https://i.imgur.com/0yRYBPb.png

      Xóa
Có Thể Bạn Đang Tìm