Bài viết liên quan giúp độc giả khi truy cập blog của bạn tiện theo dõi các chủ đè của ban hơn thông qua danh sách các bài viết cũ và mới có cùng chủ đề. Điểm đặc biệt của tiện cihs này là chia thành 2 cột. được mình cải tiên từ tiện ích của blogger anhvo mà mình từng giới thiệu tại bài viết trước đây. Các bạn có thể xem ảnh minh họa để thấy rõ hơn.

☼ Thêm Bài viết liên quan mới và cũ cùng chủ đề cho blogger.

1- Đăng nhập vào blog
2- Chọn mẫu (template)
3- Chọn chỉnh sửa HTML => Chọn mở rộng tiện ích mẫu
4- Dán đoạn code bên dưới vào trước thẻ ]]></b:skin>:
#related-posts-block ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWtjcQAAfO7sGns4N89ReVCPS0eAqrb-rYmboX1Eej7-8V7vSin0dObZEQ0vbdP8zWJjIRKHJaZXKwqMTkQw7VA7RIvnIza0PrtWD_QrQXaBigH8N3_HJcnD6S9qC1UzAnQH_rKcLNSpUk/s1600/bg_other_namkna-blogpot.jpg) repeat-x;margin:0px 0 0 0;padding:6px 0 0 0;list-style:none}#related-posts-block li{margin:0 0 0 8px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibr5V03xBpb0p4TdumGA3vCOP3U2jbRgqo5-wOkEh5c8jvLTwPdoY0T-olm0lwhyQs1xFzLn1rS6svKttP9QxfOI8UgazglN_tjF2b8fxHolYCN-oU3wg672eRgF34ZdriG4n79ytD-csO/s1600/li_namkna-blogspot-com.png) 0 5px no-repeat;padding-left:15px}#related-posts-block{line-height:1.5;margin:0 0;font-size:11px;color:#7c7b7b}#related-posts-loading-text{font-size:12px;text-align:center;color:#002c28}#related-newest-href{margin:10px 0 2px}#related-newest-title{font-size:12px;margin:5px 0 0 0;color:#033947}#related-posts-block #related-newest-href a{font-size:12px;font-family:Arial,Helvetica,sans-serif;color:#002c28}#related-posts-block #related-newest-href a:hover{color:#00f}#related-older-href{margin:10px 0 2px}#related-older-title{font-size:12px;margin:5px 0 0 0;color:#033947}#related-posts-block #related-older-href a{font-size:12px;font-family:Arial,Helvetica,sans-serif;color:#002c28}#related-posts-block #related-older-href a:hover{color:#00f}#related-posts-block > div {float: left;width: 48%;}
5- Tìm thẻ 1 trong 4 thẻ sau:
Thẻ 1:
<div class='post-footer'>
Thẻ 2:
<div class='post-footer-line post-footer-line-1'>
Thẻ 3:
<div class='post-footer-line post-footer-line-2'>
Thẻ 4:
<div class='post-footer-line post-footer-line-3'>


=> Thêm và sau 1 trong các thẻ trên đoạn code bên dưới:
<script type='text/javascript'>
//<![CDATA[
var showdate = true;
var max_post = 8;
//]]>
</script>

<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='post-labels-for-related' style='display:none'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop></b:if></div><div id='post-timestamp-for-related' style='display:none'><data:post.timestampISO8601/></div>

<div id='post-timestamp-for-related' style='display:none'><data:post.timestampISO8601/></div>
<div id='related-posts-block'><div id='related-posts-loading-text'>Loading...<br/><img align='absmiddle' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0ANFPxYa1XoOiJxXvygGBGEhKjyWaVwXaACSShmyqrtiGavlg39GWsKWSVrUkIc2_dil_R0YSNApB6LAYfMoaDK5biBIRYIbd7XJgc3HzUqLtfzphX003ieY1p126iHVRWCQeA9VVldZL/'/></div><div id='related-newest-href'><div id='related-newest-title'/></div><div id='related-older-href'><div id='related-older-title'/></div></div></b:if>

<script type="text/javascript">
    //<![CDATA[
function format(ptime){ 
 return ptime.substr(0,19);
}

function formatdate(d){
 var month = [1,2,3,4,5,6,7,8,9,10,11,12];
 var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
 var m = parseInt(d.substring(5,7),10);
 for(var j=0; j<month.length;j++){
  if(m==month[j]){
   m = month2[j]; break;
  }
 }
 return d.substring(8,10) + "-" + m + "-" + d.substring(0,4);
}

function getRelatedNewestLinks(json){
 var entry = json.feed.entry;
 if(entry){
  for(var k=0;k<entry.length;k++){
   var li = document.createElement("li");
   if(showdate){
    li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>" + ' - <i>' + formatdate(entry[k].published.$t) +'</i>';
   }
   else {
    li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>";
   }
   if(!checkRelaxLinks("related-newest-href",entry[k].link[4].href)){
    document.getElementById("related-newest-href-ul1").appendChild(li);
    document.getElementById("related-newest-title").innerHTML = "<b>Các bài viết mới cùng chủ đề</b> ";
                                
   }
  }
 } else {
  document.getElementById("related-older-title").innerHTML = "<b>Không có bài viết mới nào cùng chủ đề</b>";
 }
}

function getRelatedOlderLinks(json){
 var entry = json.feed.entry;
 if(entry){
  for(var k=0;k<entry.length;k++){
   var li = document.createElement("li");
   if(showdate){
    li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>" + ' - <i>' + formatdate(entry[k].published.$t) + '</i>';
   }
   else {
    li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>";
   }
   if(!checkRelaxLinks("related-older-href",entry[k].link[4].href)){
    document.getElementById("related-older-href-ul2").appendChild(li);
    document.getElementById("related-older-title").innerHTML = "<b>Các bài viết cũ cùng chủ đề </b>";
   }
  }
 } else {
  document.getElementById("related-older-title").innerHTML = "<b>Không có bài viết cũ nào cùng chủ đề</b>";
 }
        document.getElementById("related-posts-loading-text").style.display = "none";
}

function createRelatedJson(min_or_max,cRJ_label,fcn_callback,cRJ_max){
 var script = document.createElement("script");
 script.src = "/feeds/posts/summary/-/"+escape(cRJ_label)+"?orderby=published&max-results="+cRJ_max+"&published-"+min_or_max+"="+escape(format(document.getElementById("post-timestamp-for-related").innerHTML))+"&alt=json-in-script&callback="+fcn_callback;
 script.type = "text/javascript";
 document.getElementsByTagName("head")[0].appendChild(script);

}

function checkRelaxLinks(cid,clink){
 var check = false;
 var u = document.getElementById(cid);
 var a = u.getElementsByTagName("a");
 for(var i=0;i<a.length;i++){
  if(a[i].href==clink){
   check = true;
   break;
  }
 }
 var url = location.href.split(".html")[0]+".html";
 if(clink==url) check = true;
 return check;
} 

function createRP(){
 var postLabel = document.getElementById("post-labels-for-related").innerHTML.split(',');
 var max_ = Math.round(max_post/postLabel.length);
 var ul1 = document.createElement('ul');
 ul1.id = 'related-newest-href-ul1';
 document.getElementById('related-newest-href').appendChild(ul1);
 for(var i=0; i<postLabel.length;i++){
   createRelatedJson("min",postLabel[i],"getRelatedNewestLinks",max_);
 }
 var ul2 = document.createElement('ul');
 ul2.id = 'related-older-href-ul2';
 document.getElementById('related-older-href').appendChild(ul2);
 for(var j=0; j<postLabel.length;j++){
   createRelatedJson("max",postLabel[j],"getRelatedOlderLinks",max_);
 }
        
}
createRP();
    //]]>
</script>
Tùy chỉnh:
  • var showdate = true; Nếu không muốn hiển thị ngày tháng đăng bài, bạn thay True thành False
  • var max_post = 8; Số bài viết hiển thị trong mỗi phần (Bài cũ và bài mới) của tiện ích
6- Lưu lại và xe kết quả nha!

Một vài lưu ý nhỏ:

Có một số nguyên nhân các bạn cần chú ý khi áp dụng thủ thuật này đó là:
  1. Tiện ích này chỉ hoạt động với những trang nhãn bằng tiếng anh hoặc tiếng việt không dấu.
  2. Trang phải ở chế độ công cộng để tất cả mọi người cùng xem. Ở chế độ chỉ người được mời và tác giả có thể xem được thì nó không hiển thị nha.
  3. Trang phải được đăng ký feedbunner.
  4. Một trang có nhiều đoạn ở bước 5,. Ví dụ một blog có 2 đoạn <div class='post-footer'> như vậy bạn chèn đúng đoạn cần thiết nó sẽ hiển thị.
Chúc các bạn thành công, nếu có bất kỳ thắc mắc nào vui lòng commnet cuối bài viết này nha.