Thư viện

Trải nghiệm

Chủ Nhật, tháng 7 15, 2012

Widget bài viết ngẫu nhiên dạng list từ 1 nhãn nhất định

Hướng dẫn thêm bài viết ngẫu nhiên theo từng nhãn cho blogspot, tiêu đề bài viết được liệt kê dưới dạng danh sách load cực nhanh.

Chia sẻ:
Ứng dụng của thủ thuật Random Posts : Tạo widget bài viết ngẫu nhiên từ 1 nhãn nhất địnhĐây là một thủ thuật hoàn toàn tương tự với thủ thuật tạo các bài viết ngẫu nhiên cho blog, chỉ khác là mở rộng riêng cho từng nhãn. Nếu blog bạn có một đề tài, chuyên mục nào đó nổi bật, bạn có thể tạo 1 widget random các bài viết từ nhãn (chuyên mục đó).

Thủ thuật này được Blogger Fandung coder sau đây mình sẽ giới thiệu lại cho các bạn. Mình đã làm thử và thành công rùi

Ví dụ như ở blog của mình, mình có thể tạo một widget hiển thị các bài viết ngẫu nhiên của nhãn "Thủ Thuật Blog", xem hình minh họa bên dưới:


Ảnh minh họa:
Ứng dụng của thủ thuật Random Posts : Tạo widget bài viết ngẫu nhiên từ 1 nhãn nhất định

☼ Cách thêm Widget bài viết ngẫu nhiên dạng danh sách cho một nhãn nhất định:

1- Đăng nhập vào Blog
2- Vào thẻ Bố Cục (layout)
3- Chọn Thêm Tiện ích (Add widget)

4- Tạo 1 widet HTML/Javarscipts và dán đoạn code sau vào:
<div id="random-posts"></div>
<script type="text/javascript">

function getRandomPosts(json) {
var maxEntries = 10;
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="http://namkna.blogspot.com/feeds/posts/summary/-/Blogspot-tips?alt=json-in-script&callback=getRandomPosts&max-results=999999" type="text/javascript"></script>
- Tuỳ chỉnh :
  • var maxEntries = 10; : dòng này để thiết lập số bài viết sẽ hiển thị
  • http://namkna.blogspot.com/ bằng URL địa chỉ blog của bạn.
  • /feeds/posts/summary/-/Blogspot-tipps : thay code màu đỏ bằng nhãn bạn muốn hiển thị (lưu ý, các nhãn có kí tự khỏang trắng phải thay thế kí tự khỏang trắng bằng %20)
  • (ví dụ nếu là labe Blog Yahoo thì bạn phải đánh là  Blog%20Yahoo)
Chúc thành công!
Nguồn: Fandung.

7 nhận xét:

  1. Bạn ơi, cho mình hỏi tí, cái widget này dùng thì hay đấy, nhưng mình muốn dùng nó 2 chỗ, tức là 2 widget cùng kiểu này nhưng khác nhau là label thì không được, khi chạy là cả 2 cái nó nhẩy về một vị trí . VD: 1 widget nhãn a, 1 widget nhãn b, mỗi widget 10 bài đăng, thì khi chạy nó nhẩy vào 1 vị trí luôn là 20 bài đăng cho 2 nhãn kia .
    có cách nào khắc phục không bạn?

    Trả lờiXóa
  2. @TDT Cái này đơn giản mà bạn bạn chỉ cần dổi tên 2 chữ random-posts trong code trên thành chữ khác ví dụ như bỏ bớt một chữ s đi để thành chữ random-post cũng được :3) :3) :3)
    - Bận để phần đó giống nhau thì trình duyệt tự hiểu nó cùng một id do vậy nó gộp vào một.:3) :3) :3)

    Trả lờiXóa
  3. Em muốn chỉ 2 cái đầu tiên có ảnh kèm title còn những cái còn lại chỉ có tile thì làm thế nào hả anh?

    Trả lờiXóa
    Trả lời
    1. Nếu như thế thì không dùng code này được em ak.

      Xóa
  4. Còn nếu muốn đặt ở vị trí "CÓ THỂ BẠN THÍCH!" giống trên trang này thì sao vậy Ad.

    Trả lờiXóa