10:22 PM

Tạo bài viết liên quan mới và cũ cho bloger

 No comments

 humghn.com 

Trong bài viết lần này , chuyên mục tiếp tục gửi đến các bạn một mẫu bài viết liên quan mới - thực sự tiện dụng . Với mẫu này , các bài viết liên quan sẽ được hiển thị theo 2 cột chính . Một cột là các bài viết liên quan mới , cột còn lại là các bài viết liên quan cũ . Hi vọng rằng , với mẫu bài viết liên quan - relate posts này , các bạn sẽ làm khoa học hơn site của mình . 
Ảnh DEMO



Tạo bài viết liên quan mới và cũ cho bloger
Cách thực hiện 
Bước 1 : Đăng nhập bloger , chọn " Mẫu " , chọn " Chỉnh sửa HTML "
Bước 2 : Dán đoạn mã sau vào trước thẻ ]]></b:skin>
#related-posts-block ul{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSfhXivpY2sQQnvThMaY1Jjcj53A71g29QcaJc8yyZYzly3EhKaO55TT1ZdC3HR4MHjg5wsZSOPPq073p00XClAaeMQe7dkzOz-RNhvrDLazPDyVlsnxR08x2NT7ZiMNXfpuItRN-aLz8/s1600/bg_other_bittuot-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/AVvXsEhrZEtF9LhFQKro1fWInsW_2GdHZNw1CsXUGRfI9xK2ud6FbiQY_jbLUSi2nuL8cjPTI0NK7y46K6oOkwdj2Y_uDQ64IiV5tmQfSeM3KiKpca1vKdiEHPWk0ILcF_6ZA04mAi5CUmJi4xk/s1600/li_bittuotblog-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%;}
Bước 3 : Tìm một trong 4 đoạn code sau :
Đoạn 1: <div class='post-footer'>
Đoạn 2: <div class='post-footer-line post-footer-line-1'>
Đoạn 3: <div class='post-footer-line post-footer-line-2'>
Đoạn 4: <div class='post-footer-line post-footer-line-3'>
Bước 4 : Thêm vào sau 1 trong 4 đoạn code vừa tìm được dải mã dưới đây ( Bạn thử ở vị trí nào được thì lưu lại ở đó nhé ) .
<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/AVvXsEhEwZgadn-qCAln8RNodeatmFeAbg1_-sTkRppQhWZUzxwCk4R3ZyKxbKaNM9ouY4Ax-4yXpmSFAsymXUHimek4Q19ztB1V_-u2Aqdm2YI082zD7o4m51ScgUsF5X4oM99nECRkaOvk7Ssy/'/></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
Bước 5 : Lưu lại và tận hưởng thành quả
Chúc các bạn thành công !

0 nhận xét:

Subscribe to: Post Comments (Atom)

 

Copyright @ 2013 Thông Tin Công Nghệ - Giải Trí & Học Tập.

Designed by Templateism | MyBloggerLab