Laman

Pages

Laman

Nov 30, 2010

Tiện ích Bài viết mới nhất chạy marquee

Tiện ích Bài viết mới nhất là một trong những tiện ích cần thiết nhất cho blog của bạn. Có nhiều kiểu tiện ích Bài viết mới nhất và mỗi tiện ích đều có những tính năng riêng. Trước khi quyết định cài đặt lâu dài vào blog của bạn thì bạn nên xem xét tiện ích nào phù hợp với blog của bạn và đặc biệt là tiện ích đó phải thu hút sự chú ý của người đọc.

Tham khảo từ tiện ích Bài viết mới nhất dạng cơ bản (không có hình đại diện), thêm mắm thêm muối :35) rồi gọt đẽo, mài giũa tôi đã cho ra đời một tiện ích mới có tên Tiện ích Bài viết mới nhất chạy marquee (Marquee Recent Posts Widget).

Bạn có thể xem demo dưới đây.


Bài viết mới nhất


Cài đặt tiện ích này quả thật rất đơn giản. Bạn chỉ việc đặt toàn bộ đoạn code dưới đây vào một tiện ích HTML/JavaScript trên sidebar blogspot của bạn là OK.

<style type='text/css'>
#marqueeposts {width:300px;margin:0;}
.marqueetitle {margin:5px 0 0 0px; background-color:#dcdcdc; padding:0 0 0 0px; text-align:justify;}
.marqueetitle a {color: #5f9ea0; font-weight:bold;font-family:Arial !important;font-size:12px !important;}
.marqueetitle a:hover {color:#FF9933 !important;text-decoration:none !important;}
.marqueetext {margin:2px 0 10px 0; border-bottom:1px solid #2F363E; padding:0px 0 8px 0; font-size:12px; text-align:justify}
.marqueemore a {color: #a52a2a; font-weight:normal !important;font-family:Arial !important;}
.marqueemore a:hover {text-decoration:none !important;}
.marqueedate {color:#008000}
</style>

<script type="text/javascript">
function showrecentposts(json) {
document.write('<marquee id="marqueeposts" direction="up" width="100%" scrollamount="' + postspeed + '" height="' + postheight + 'px" align="top" onMouseOver="stop()" onMouseOut="start()">');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(Đọc thêm …)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "01";
monthnames[2] = "02";
monthnames[3] = "03";
monthnames[4] = "04";
monthnames[5] = "05";
monthnames[6] = "06";
monthnames[7] = "07";
monthnames[8] = "08";
monthnames[9] = "09";
monthnames[10] = "10";
monthnames[11] = "11";
monthnames[12] = "12";
if ("content" in entry) {
var postcontent = entry.content.$t;
} else
if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write('<div class="marqueetitle">');
document.write('');
document.write(posttitle);
if (showpostdate == true) {
document.write(' <span class="marqueedate">[' + cdday + '/' + monthnames[parseInt(cdmonth,10)] + '/' + cdyear + ']</span>');
}
document.write('</div><div class="marqueetext">');
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent);
document.write(' <span class="marqueemore">... ' + readmorelink + '</span>');
}
}
document.write('</div>');
}
document.write('</marquee>');
}
</script>

<script type="text/javascript">
var numposts = 7; // số bài viết hiển thị
var showpostdate = true; // ngày đăng, đặt false để ẩn đi
var showpostsummary = true; // phần tóm tắt bài viết
var numchars = 100; // số ký tự phần tóm tắt
var postspeed = 2; // tốc độ chạy marquee
var postheight = 250; // chiều cao bài viết
</script>

<script src="http://huynh-nhat-ha.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&callback=showrecentposts">
</script>

<div style="text-align:center;">
<a href="javascript:void(0);"
onclick="getElementById('marqueeposts').direction='down';">
<img src="https://sites.google.com/site/ngonngulaptrinhvn/files/marqueedown.gif"/>
</a>
<a href="javascript:void(0);"
onclick="getElementById('marqueeposts').direction='up';">
<img src="https://sites.google.com/site/ngonngulaptrinhvn/files/marqueeup.gif"/>
</a>
</div>

Chú ý ở dòng #marqueeposts {width:300px;margin:0;}, bạn cần đặt width cho marqueeposts bằng hoặc nhỏ hơn width của sidebar; thay huynh-nhat-ha bằng tên blogspot của bạn.

Nếu bạn muốn hiển thị tiện ích này cho một Nhãn (Label) thì cần thay đoạn code

<script src="http://huynh-nhat-ha.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&callback=showrecentposts">
</script>

thành:

<script src="http://huynh-nhat-ha.blogspot.com/feeds/posts/default/-/Tên nhãn?
orderby=published&alt=json-in-script&callback=showrecentposts">
</script>

Và đừng quên sửa huynh-nhat-ha thành tên blogspot của bạn nhé.

1 comment:



  1. Expert Grande Lifestyle Tourbillon Cylindrique à Quantième Perpétuel Jubilee, A good manufactured is definitely tag heuer replica sale unquestionably fantastic. A happens are certainly obnoxious, resonant plus perfectly regulated, together with the district repeats musical plus euphonic. Jaeger-LeCoultre has determined a different dwelling around Brisbane during without any doubt a city's highly regarded look at boutique: A An hour Window. In such a look at Jaeger-LeCoultre currently have beautifully completed a blend of your never ending appointment setting, celestial satellite level plus tourbillon, which will is parked , for their innovative extra-white breitling replica sale platinum eagle instance. The form is definite around it has the nineteenth a single idea, intensionally similar mainly with never ending appointment setting pocket-watches of your times. A appointment setting system is definitely timeless plus very clear to read simple things, when could be the a matter of minutes plus working hours as a consequence of the fresh "dauphine" possession. The following look at is definitely really plus enjoyably common, having said that finer check explains a position with Jaeger-LeCoultre's ever-impressive louis vuitton replica sale present day specialised enhancements, research these folks a forging with innovative track record. Through one-hundred ages eventually, precisely the same will also apply to Jaeger-LeCoultre and it's unquestionably the whole amount business presentation in such a superb look at. To get at the first try, the following unit offers your hovering tourbillon which includes a cylindrical balance-spring.

    ReplyDelete

Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D