Tiện ích Bài viết liên quan cho Blogspot

Blogspot có nhiều ưu điểm, ví dụ như giao diện viết bài đơn giản, thân thiện, hosting thoái mái, chịu tải lớn giúp chủ trang không lo lắng khi lượng người dùng tăng đột biến. Nhưng yếu điểm của Blogspot là nó không có nhiều widget hỗ trợ giống như các CMS khác.
Thực tế Blogspot chỉ có khoảng 20 tiện ích mà người dùng cảm thấy thực sự có ích:

Còn lại phần đa đều phải tự tìm trên mạng, chẳng hạn tiện ích bình luận gần đây hay bài viết mới nhất đều phải tự tìm. Và lần này cũng vậy, tiện ích bài viết liên quan - điều rất quan trọng để giữ chân độc giả lâu hơn cũng không được Blogspot cho vào kho tiện ích mặc định.

Một điều chắc chắn không phải Google không làm được, nhưng lý do gì mà họ không bổ sung các widget cơ bản đó vào thì tôi vẫn chưa rõ.

Quay lại vấn đề trọng tâm. Tại sao chúng ta cần tạo tự động các bài viết liên quan? Điều này nói cho cùng là cần thiết cho các trang web có số lượng bài viết lớn. Bởi vì khi đó, một bài viết thường liên quan đến vài bài khác, và mỗi lần viết bài mới bạn phải mất rất nhiều công sức cập nhật mối liên kết qua lại giữa chúng với nhau.

Tuy nhiên ở khía cạnh khác, tạo các mối nối bằng tay giữa các bài tạo ra sự liên kết mạnh mẽ hơn, vì bạn biết rõ nhất với bài viết A thì bài viết C là liên quan nhất chứ không phải bài B, trong khi đó hệ thống tự động có thể đưa ra bài B cho độc giả.

Do vậy để cân bằng bạn nên kết hợp cả hai, vẫn có những liên kết bằng tay ngay trong bài và một hệ thống auto các bài liên quan ở cuối.

Và bây giờ sẽ là đoạn code để làm điều đó. Nếu bạn có kinh nghiệm với Blogspot thì mới nên làm nhé, mới dùng mà chiến cái này luôn là hơi bị nhức đầu đấy! Backup lại Template của bạn phòng khi lỗi nhé.

Vào mẫu chọn chỉnh sửa HTML

Tìm thẻ đóng </head>

Và paste đoạn code dưới đây vào trước thẻ </head>:


<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
margin-right:5px;
color:black;
background-color:#CCC;
text-align:center;
}
#related-posts a:hover{
background-color:#2AA4CF;
color:#FFF;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDeawhh8wiyNv_0kXN0TO3CWUqsagUxa2xNa4pFWerZRT56n0j69fCd0siXmMVXW-u3qzRyMwL2dOiTjHmywo9cAq9fyREQ11jh87TdK4tFgCcx9_KqfdYXWWo5qjhgfMQhrLpBY1tsQ/s1600/no-image.jpg";
var maxresults=5;
var splittercolor="#DDDDDD";
var relatedpoststitle="Bài Viết Liên Quan";
</script>
<script src='https://googledrive.com/host/0BxKUKf8tfKupSnQ0Znd2Tm5xT1E' type='text/javascript'/>
</b:if>


Nếu muốn thay đổi số lượng bài viết liên quan thì điều chỉnh giá trị: var maxresults=5; thường để 3 cho đến 5.

Tìm đến dòng <div class='post-footer'>Rồi paste đoạn code dưới đây vào sau dòng đó:


<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
</b:if></b:if>



Cuối cùng nhấn Save để lưu tempalte. Chú ý là nhiều template thì bạn phải paste vào sau: <div class='post-footer-line post-footer-line-1'> chứ không phải <div class='post-footer'> thì nó mới hiện bài viết liên quan. Bạn cứ thử lần lượt, cái nào OK thì dùng.

Bài viết lấy code mẫu từ trang: http://helplogger.blogspot.com/2012/03/how-to-add-related-posts-widget-to.html

Nếu quá chán với code, bạn có thể dùng http://www.linkwithin.com/ nó cũng tạo bài viết liên quan rất đẹp mắt thông qua chỉ vài click thôi chứ không nhức đầu như trên đâu, yếu điểm là trang web chậm đi đôi chút.