• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Tiện ích Bài viết ngẫu nhiên luân phiên

3
22/01/2011

Bài viết ngẫu nhiên luân phiên là một kiểu tiện ích hiển thị 1 bài viết một cách ngẫu nhiên rồi tự động chuyển sang bài viết khác. Tiện ích này hiển thị tiêu đề bài viết, tác giả, ngày đăng bài viết và một phần tóm tắt bài viết.

Bạn có thể xem Demo ở cuối bài viết này.

Tiện ích này sử dụng Feed Atom nên blog của bạn phải đăng ký với Feedburner của Google.

Để cài đặt tiện ích này, bạn cần có một điều kiện là API Key của AJAX. Để lấy API Key cho blog của bạn, vào trang này để đăng ký. Bạn nhập địa chỉ blog rồi nhấn Generate API Key.



Tiếp theo bạn đăng nhập tài khoản Google bằng địa chỉ gmail để chuyển đến trang lấy API Key. Đó là một chuỗi dài gồm các chữ cái và con số lộn xộn, bạn hãy copy chuỗi số đó rồi lưu lại.



Đã có API Key, vậy chúng ta bắt đầu cài đặt tiện ích này như sau.

Đăng nhập Blogger, vào Design >> Page Elements. Đặt đoạn code sau đây vào một tiện ích HTML/JavaScript.

<style type="text/css">
#feedGadget {margin: 0 auto;width: 350px;}
.gfg-root {background-color: #234;border: 1px solid #456;font-family: Arial,sans-serif;font-size: 12px;height: auto;overflow: hidden;padding: 4px;position: relative;text-align: center;}
.gfg-title {background-color: #456;color: #CDE;font-size: 16px;font-weight: bold;line-height: 1.4em;overflow: hidden;white-space: nowrap;}
.gfg-subtitle {background-color: #456;font-size: 14px;line-height: 1.4em;overflow: hidden;white-space: nowrap;}
.gfg-entry {height:9.9em;overflow:hidden;position:relative;text-align:left;width:100%;}
.gfg-root .gfg-entry .gf-result {background-color:#123;height:100%;padding:0 10px;position:relative;width:auto;}
.gfg-root .gfg-entry .gf-result .gf-title {color:#ABC;display:block;font-size:13px;font-weight:bold;line-height:1.2em;margin-top:5px;overflow:hidden;white-space:nowrap;}
.gfg-root .gfg-entry .gf-result .gf-snippet {color:#AAA;font-size:12px;line-height:1.3em;margin-top:5px;}
.clearFloat {clear:both;}
.gfg-list {display:none !important;}
</style>
<script src="http://www.google.com/jsapi/?key=API Key" type="text/javascript"></script>
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>
<script type="text/javascript">
function showGadget() {
var feeds = [{title:'Huynh Nhat Ha on Blogger', url:'http://huynh-nhat-ha.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999'},];
new GFdynamicFeedControl(feeds, 'feedGadget', {numResults : 1000, stacked : true, title: "Bài viết ngẫu nhiên luân phiên"});
}
google.load("feeds", "1");
google.setOnLoadCallback(showGadget);
</script>
<div id="feedGadget">Loading ...</div>
<div style='clear: both;'></div>

Trong đoạn code trên, bạn cần điều chỉnh width: 350px sao cho tương thích với chiều rộng vùng bố trí tiện ích này, thay API Key của bạn vừa đăng ký, thay Huynh Nhat Ha on Blogger bằng tiêu đề blog của bạn, thanh huynh-nhat-ha bằng tên blogspot của bạn.

Lưu tiện ích là OK. :55)

Tiện ích này do Blogdoctor.me phát triển. Tôi có điều chỉnh một chút để code trở nên ngắn gọn hơn rất nhiều.




Loading ...

{3 bình luậnAdd yours ?}

08:41:00, 17 thg 2, 2011

Bác Hà ơi cho em hỏi, cái này muốn nó hiển thị hình ảnh và tiêu đề thì làm thế nào

Reply
11:05:00, 17 thg 2, 2011

Cái này dùng AJAX Feed API của Google nên k can thiệp để có thumbnail được

Reply
21:22:00, 25 thg 2, 2012

Oh. cái này hay
nhưng sao mình không tìm thấy chỗ lấy API nhỉ :(
Help me

GREEN VIETNAM

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn