Thêm tiện ích bài viết gần đây (Recent Posts) cho blogger

Tiện ích bài viết gần đây ( recent posts widget) được hầu hết các blogger sử dụng. Bài viết này mình xin giới thiệu tiện ích này với đặc điểm là đơn giản, không có ảnh thumbnail,
Đầu tiên bạn phải đăng nhập vào blogger, vào chỉnh sửa Template
Chèn đoạn code dưới đây lên trên thẻ </head>
<b:if cond='data:blog.isMobile == "false"'>
 <script type='text/javascript'>
 //<![CDATA[
  function recentpostslist(json) {
   document.write('<ul>');
   for (var i = 0; i < json.feed.entry.length; i++) {
    if (i == json.feed.entry.length) break;
    for (var j = 0; j < json.feed.entry[i].link.length; j++) {
     if (json.feed.entry[i].link[j].rel == 'alternate') {
      entryUrl = json.feed.entry[i].link[j].href;
      break;
     }
    }
    var entryTitle = json.feed.entry[i].title.$t;
    var item = '<li>' + '<a href="' + entryUrl + '" title="' + entryTitle + '">' + entryTitle + '</a></li>';
    document.write(item);
   }
   document.write('</ul>');
  }
 //]]>
 </script>
</b:if> 
Các bạn chú ý là ở đoạn trên mình sử dụng thẻ điều kiện <b:if cond='data:blog.isMobile == "false"'> , mục đích là không cho phép tiện ích này hiển thị trên giao diện mobile, nếu bạn nào muốn nó hiển thị thị xóa bỏ thẻ này <b:if cond='data:blog.isMobile == "false"'> và </b:if>  nhé
Tiếp theo bạn vào Blog => Bố cục => Thêm tiện ích => HTML/JavaScript và dán đoạn mã code dưới đây :
<script src='/feeds/posts/default?orderby=published&amp;max-results=7&amp;alt=json-in-script&amp;callback=recentpostslist'/>
Bạn thay giá trị 7 bằng số lượng bài muốn hiển thị.
Còn nếu bạn muốn hiển thị bài viết gần đây của một nhãn (Label) thị bạn dùng đoạn code sau:
<script src='/feeds/posts/default/-/Labelname?max-results=7&amp;alt=json-in-script&amp;callback=recentpostslist'/>
Bạn thay Labelname bên trên bằng nhãn muốn hiển thị
Nguồn bài viết: gianmr.com

No comments:

Post a Comment