Thứ Tư, 2 tháng 3, 2011


      Thật tuyệt khi dưới mỗi bài viết trên blogger của bạn có link hiển thị các đường dẫn đến các bài viết có cùng chủ đề liên quan. Các bài viết có cùng chủ đề được chọn từ các bài viết khác trong cùng chủ đề, nhãn, cú pháp. Nhờ thủ thuật này thì độc giả trên blog của bạn không còn phải tốn thời gian nhiều khi tìm kiếm các bài viết liên quan.


Sau đây là hướng dẫn thao tác thủ thuật.

Bước 1: Đăng nhập vào Blogger của bạn. Đến Bố cục (Layout) – Chỉnh sửa HTML (Edit HTML). Nên back up Template hiện thời của bạn trước khi thay đổi. Chọn Mở rộng Mẫu tiện ích (Expand Widget Template).

Bước 2: Thêm đoạn mã bên dưới vào trước thẻ mở </head>.

<style type='text/css'>
#related-posts{float:center;text-transform:none;height:100%;min-height:100%;padding-top:5px;}
#related-posts .widget{margin-bottom:10px}
#related-posts .widget h2,#related-posts h2{height:25px;color:blue;font-size:15px;font-weight:bold;font-family:Arial,Georgia,Tahoma,Times New Roman,serif;margin:0px 4px 0;margin-top:4px;padding:0 0 5px}}
#related-posts a{color:blue}
#related-posts a:hover{color:blue}
#related-posts ul{list-style-type:none;margin:0 0 0px 0;padding:0px;text-decoration:bold;font-size:13px;text-color:#000}
#related-posts ul li{display:block; background : url("http://bit.ly/hqynkc") no-repeat 0 0;list-style-type:none;margin:0;padding-top:0;padding-right:0;padding-bottom:1px;padding-left:21px;margin-bottom:5px;line-height:2em;border-bottom:1px dotted #ccc}
</style>
<script type='text/javascript'>
var relatedpoststitle=&quot;Bài viết liên quan&quot;;
</script>
<script src='http://hacodeproject.googlecode.com/files/relatedposts.js' type='text/javascript'/>

Chú ý: Bạn nên tải file hình rss.png và file relatedposts.js được đánh dấu màu xanh về rồi upload lên webhost của bạn để tránh hạn chế băng thông.

Bước 3: Tìm đoạn mã <div class='post-footer-line post-footer-line-3'>. Sau đó thêm đoạn mã sau đây vào dưới đoạn mã vừa tìm.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=8&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=7;
removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>

Để thay đổi số bài viết tối đa được hiển thị trong mỗi nhãn, chủ đề, hãy thay đổi số theo ý muốn trong đoạn mã var max-results=7.

Lưu Template và bạn sẽ có kết quả như ý.

(Huynh Nhat Ha's Blog)

Bài viết liên quan:
  1. Chỉ hiện tiêu đề bài viết trong Blogger 

  2. Tiện ích Bài viết mới hơn và cũ hơn cùng chủ đề

  3. Tiện ích Bài viết Hot cho blogspot 

  4. Tiện ích Nhận xét mới nhất có icon 

  5. Tiện ích Nhận xét mới nhất theo kiểu cơ bản

  6. Tiện ích Nhận xét mới nhất có ảnh đại diện

  7. Tùy biến với tiện ích Bài viết liên quan của Linkwithin

  8. Tiện ích Nhận xét mới nhất kiểu Author – Comment – Post Title

  9. Cách đơn giản tạo “Bài đăng và Nhận xét mới nhất”

  10. Tiện ích Bài xem nhiều nhất 

Tagged:

0 nhận xét:

Đăng nhận xét