Tạo Breaking News cho BlogSpot
Tạo Breaking News cho BlogSpot/Blogger
Tạo Breaking News cho
BlogSpot/Blogger sẽ giúp cho người đọc dễ dàng cập nhật những bài viết gần đây
trên blog của bạn và đó cũng là cơ hội để họ ghé lại blog của bạn lâu hơn. Mình
đã thử ngay chính blog của mình và đã thành công. Hôm nay mình chia sẻ cách làm
này, mong rằng nó sẽ giúp ích cho các bạn.
Các bạn tiến hành theo
từng bước dưới đây
Thêm HTML
- Đăng nhập vào Blogger.
- Các bạn vào Mẫu - Edit HTML - Tìm thẻ </body>
- Dán code dưới vào trên nó.
- Thay YOUR URL HERE thành địa chỉ blog của bạn.
<b:if cond='data:blog.pageType !=
"static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var url_blog = 'YOUR URL HERE', //replace with
your Domain
numpostx = 10; //Posts want to display
$.ajax({
url: '' + url_blog +
'/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '',
type: 'get',
dataType:
"jsonp",
success: function(data) {
var posturl, posttitle,
skeleton = '',
entry =
data.feed.entry;
if (entry !==
undefined) {
skeleton =
"<ul>";
for (var i = 0; i <
entry.length; i++) {
for (var j=0; j
< entry[i].link.length; j++)
{
if
(entry[i].link[j].rel == "alternate")
{
posturl = entry[i].link[j].href;
break;
}
} posttitle =
entry[i].title.$t;
skeleton +=
'<li><a href="' + posturl + '"
target="_blank">' + posttitle + '</a></li>';
}
skeleton +=
'</ul>';
$('#recentpostbreaking').html(skeleton);
// kode untuk efek
pada breaking news
function tick(){
$('#recentpostbreaking li:first').slideUp( function () {
$(this).appendTo($('#recentpostbreaking ul')).slideDown(); });
}
setInterval(function(){
tick () }, 5000);
} else {
$('#recentpostbreaking').html('<span>No result!</span>');
}
},
error: function() {
$('#recentpostbreaking').html('<strong>Error Loading
Feed!</strong>');
}
});
});
//]]>
</script>
</b:if></b:if>
|
Thêm Scrip
- Tìm thẻ </head>
- Dán code dưới vào trên nó.
<b:if cond='data:blog.pageType !=
"static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
#beakingnews{width:980px;margin:0
auto;line-height:25px;height:25px;background:#F7F7F7;overflow:hidden;margin-top:5px;}
#beakingnews .tulisbreaking{display:block;float:left;padding:0
7px;margin:0 5px 0 0;color:#FCFCFC;background:#5F0000}
#recentpostbreaking{float:left}
#recentpostbreaking ul,#recentpostbreaking
li{list-style:none;margin:0;padding:0}
</style>
</b:if></b:if>
|
Thêm Widget
- Vào Bố cục.
- Thêm tiện ích - Thêm tiện ích - HTML/Javascrip.
- Dán code dưới vào.
<b:if cond='data:blog.pageType !=
"static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div id='beakingnews'><span class='tulisbreaking'>Breaking
News</span><!-- tag pembuka tempat Breaking News-->
<div id='recentpostbreaking'>Loading...</div><!-- tag
tempat daftar Breaking News ditampilkan-->
</div><!-- tag penutup tempat Breaking News-->
</b:if></b:if>
<div style='clear: both;'/>
|
(Lưu ý khi thêm widget các bạn nên thêm ở vị
trí phía trên Bài viết (dưới header) theo mình đây là vị trí thích hợp nhất
trên blog để người dùng dễ quan sát nhất)
Chúc các bạn thành công!!!
No Comment to " Tạo Breaking News cho BlogSpot "
Xin chào! Nếu bạn có bất cứ đóng góp, câu hỏi hay thắc mắc nào vui lòng để lại bình luận dưới đây. Mỗi góp ý, nhận xét của bạn đều rất quan trọng với tôi. Tôi rất vui nếu bạn viết bằng Tiếng Việt có dấu. XIN CẢM ƠN!