Bài viết ngẫu nhiên tốc độ cao cho Blogger kèm ảnh thumbnail

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ề. Trong tiện ích mình giới thiệu sau đây 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.

☼ Thêm bài viết ngẫu nhiên dạng một cột và 2 hay nhiều cột cho blogspot.

1- Đăng nhập vào Blog
2- Vào mẫu (Template)
3- Chọn Chỉnh sửa HTML (Edit HTML)
4- Chọn một trong các đoạn mã dưới đây vào trước thẻ ]]></b:skin> trong template của bạn.
4.1 Đoạn mã dành cho bạn thích giao diện một cột,

VIEW DEMO

#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}

4.2 Đoạn mã tiện ích chia thành 2 hay nhiều cột thì bạn thêm đoạn mã bên dưới vào nha:

VIEW DEMO

#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}
#random-posts li{list-style:none;width:45%;float:left}

5- Bấm Lưu Mẫu lại.

6- Vào phần Bố cục (Lay out) => Bấm vào Thêm tiện ích (Add widget) => Thêm 1 tienj ích HTML/Javascript tại nơi muốn hiển thị Bài viết ngẫu nhiên (Random Posts). Dán đoạn mã dưới đây vào phần Nội dung của tiện ích bạn vừa tạo.

<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=5;
var rdp_info='yes';
var rdp_comment='Nhận xét';
var rdp_disable='Tắt Nhận xét';
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){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;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;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDcQdc1qnWZo_4P4VyvmGbmTRQSsvq2fhO1ByISXjBit4ZqyKzs3HUmOtyhGvHDP6T20HVzWvJOp2OdiLut66PmyrqCxM3UYX99r6l4cIURcueBA2ZG6pMPjcsEzxJUqTZgBbedKBgssob/"}}};document.write('<li>');document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span>'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</span>'}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>

Thay 5 bằng số bài viết bạn muốn hiển thị. Nếu không muốn hiển thị thông tin ngày tháng đăng bài và số nhận xét hãy thay yes thành ký tự bất kỳ khác.

Nếu muốn áp dụng cho một nhãn bạn thay:

/feeds/posts/default

Bằng:

/feeds/posts/default/-/Tên%20Nhãn 

%20 để thay cho ký tự trống nếu tên nhãn gồm 2 câu trở lên.
Nếu muốn cho tiêu đề bài viết thành chữ in đậm thì  Thêm đoạn mã dưới đây vào trước thẻ ]]></b:skin> trong template của bạn.

#random-posts a{font-weight:bold}

Demo:

Chúc thành công!

Theo: Duypham.