[Blogspot]Tạo widget recent post có hiện số nhận xét và ngày đăng

Như bạn thấy ở hình dưới, đó là widget Recent posts quen thuộc để hiển thị những bài viết mới đăng gần nhất của blog. Nó mặc định cho phép hiển thị ngày đăng bài và số lượng nhận xét của bài đăng đó, nhằm giúp cho độc giả nắm các bắt thông tin cơ bản một cách nhanh chóng.

Demo

Và đây là cách tạo ra widget đó:

Bước 1: Bạn vào trang quản lý chính chọn tab Mẫu-> Chỉnh sữa HTML , chèn đoạn code CSS sau vào trước thẻ ]]></b:skin>

#recent-posts img{float:left;margin-right:10px;border:1px solid #999;background:#F3F3F3;width:50px;height:50px;padding:0px}

Bước 2: Vào Bố Cục-> Thêm tiện ích mới-> HTML/Javascript

Copy và paste đoạn code sau vào:

<div id='recent-posts'>
<script type='text/javaScript'>
var rcp_numposts=15;
var rcp_snippet_length=150;
var rcp_info='yes';
var rcp_comment='Nhận xét';
var rcp_disable='Tắt Nhận xét';
function recent_posts(json){var dw='';a=location.href;y=a.indexOf('?m=0');dw+='<ul>';for(var i=0;i<rcp_numposts;i++){var entry=json.feed.entry[i];var rcp_posttitle=entry.title.$t;if('content'in entry){var rcp_get_snippet=entry.content.$t}else{if('summary'in entry){var rcp_get_snippet=entry.summary.$t}else{var rcp_get_snippet="";}};rcp_get_snippet=rcp_get_snippet.replace(/<[^>]*>/g,"");if(rcp_get_snippet.length<rcp_snippet_length){var rcp_snippet=rcp_get_snippet}else{rcp_get_snippet=rcp_get_snippet.substring(0,rcp_snippet_length);var space=rcp_get_snippet.lastIndexOf(" ");rcp_snippet=rcp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rcp_commentsNum=entry.thr$total.$t+' '+rcp_comment}else{rcp_commentsNum=rcp_disable};if(entry.link[j].rel=='alternate'){var rcp_posturl=entry.link[j].href;if(y!=-1){rcp_posturl=rcp_posturl+'?m=0'}var rcp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rcp_thumb=entry.media$thumbnail.url}else{rcp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCqSWwoBlnPJtRXlppF8TS7L7N8GccKpvX0aOKwTQYCViz1qxeSKe7lmsqn89eiOZp_mSigptewfo6rKo4UC6TSHhpGbOo0SvrnJBwTaULWXvNdlaOyJyfdDjo4kDSax223CnO87EYHymQ/"};}};dw+='<li>';dw+='<img alt="'+rcp_posttitle+'" src="'+rcp_thumb+'"/>';dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_snippet+'">'+rcp_posttitle+'</a></div>';if(rcp_info=='yes'){dw+='<span>'+rcp_postdate.substring(8,10)+'/'+rcp_postdate.substring(5,7)+'/'+rcp_postdate.substring(0,4)+' - '+rcp_commentsNum+'</span>';};dw+='<div style="clear:both"></div></li>';};dw+='</ul>';document.getElementById('recent-posts').innerHTML=dw;};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results='+rcp_numposts+'&callback=recent_posts\"><\/script>');
</script>
</div>

Trong đó các bạn có thể thay đổi thông số sau cho phù hợp với blog của bạn:

var rcp_numposts=15; "15 là số lượng bài đăng mới bạn muốn hiển thị"

var rcp_snippet_length=150; "150 là độ dài kí tự tiêu đề bài viết bạn muốn hiện thị"
var rcp_info='yes'; "yes là hiển thị phần mở rộng khi rê chuột vào mỗi bài đăng"

Đặt tên cho widget và nhấn lưu lại rồi xem kết quả.

Chúc các bạn thành công!

www.kieuquangtieu.com