Tiện ích Bài viết ngẫu nhiên cho blogspot

Posted by chiasedamme on Tuesday, January 11, 2011

Bài viết ngẫu nhiên cũng là một tiện ích cần thiết cho bất kỳ blogspot nào. Tiện ích này hiển thị danh mục các bài viết trên blog một cách ngẫu nhiên cho toàn blog hoặc cho một nhãn nào đó.

Tôi chưa biết đích xác ai là tác giả viết phần Javascript của tiện ích này, chỉ biết rằng nó được lưu truyền khá lâu rồi. Trước đây Blogger Fan Dung có giới thiệu tiện ích này tại một bài viết trên Mothuthuat.com. Khi tôi giới thiệu lại tiện ích này, tất nhiên ban đầu sẽ không được chú ý bởi các độc giả đã biết qua cách cài đặt tiện ích này. Tuy nhiên, tôi muốn cho tiện ích hoàn thiện hơn và bạn sẽ không phải uổng công khi đọc lại bài viết của tôi.

Bạn có thể xem Demo ở đây.

Bài viết ngẫu nhiên





Để cài đặt tiện ích này cho blogspot của mình, bạn chỉ cần đặt toàn bộ phần code sau đây vào phần nội dung của một tiện ích HTML/JavaScript là được.

<style type="text/css">
#random-posts {
}
#random-posts ul {
list-style-type: none;
margin: 0 10px;
}
#random-posts li {
}
#random-posts a {
background: transparent url(http://img97.imageshack.us/img97/9070/weedbullet.gif) no-repeat 5px 50%;
display: block;
font-weight: normal;
height: 16px;
line-height: 16px;
padding: 3px 5px 2px 20px;
}
#random-posts a:hover {
background-color: #f5f5dc;
}
</style>
<div id="random-posts">
<script type="text/javascript">
function getRandomPosts(json) {
var maxEntries = 10; // Thay số 10 để hiển thị số lượng bài viết
var numPosts = json.feed.openSearch$totalResults.$t;
var indexPosts = new Array();
for (var i = 0; i < numPosts; ++i) { indexPosts[i] = i; }
indexPosts.sort(function() {return 0.5 - Math.random()});
if (maxEntries > numPosts) { maxEntries = numPosts; }
var container = document.getElementById('random-posts');
var ul = document.createElement('ul');
for (i = 0; i < maxEntries; ++i) {
var entry = json.feed.entry[indexPosts[i]];
var li = document.createElement('li');
var a = document.createElement('a');
a.title = entry.title.$t;
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == 'alternate') {
a.href = entry.link[j].href;
break;
}
}
a.appendChild(document.createTextNode(entry.title.$t));
li.appendChild(a);
ul.appendChild(li);
}
container.appendChild(ul);
}
</script>
<script src="/feeds/posts/summary?alt=json-in-script&callback=getRandomPosts&max-results=999" type="text/javascript"></script>
</div>

Tôi đã thêm vào phần CSS để định dạng các thuộc tính CSS cần thiết cho tiện ích này. Nếu muốn hiển thị các bài viết ngẫu nhiên cho một nhãn nào đó thì thay đoạn code được đánh dấu màu đỏ bằng đoạn code sau.

<script src=”/feeds/posts/summary/-/Tên nhãn?alt=json-in-script&callback=getRandomPosts&max-results=999999″ type=”text/javascript”></script>

Bạn cần thay tên nhãn áp dụng tiện ích cho đoạn code trên.

{ 0 comments... read them below or add one }

Post a Comment