Breaking News là một tiện ích kiểu như recent post, nó hiện thị các bài viết mới gần đây trên blog của bạn.
#DEMO
Bạn có thể xem DEMO tại đây.#CSS
1. Đăng nhập Blogger
2. Mẫu > Chỉnh sửa HTML
3. Tìm thẻ ]]></b:skin>
4. Dán code dưới vào trước(trên) thẻ mà bạn vừa tìm
/* CSS Breaking News */ #breakingnews {margin:15px 0 0 0;margin-right:15px;height:42px;line-height:29px;overflow:hidden;background:#fff;border:1px solid #e6e6e6;} #breakingnews .breakhead {position:absolute;background:none repeat scroll 0 0 #363b40;color:#fff;display:block;float:left;font-family:inherit;font-size:16px;font-weight:400;text-transform:uppercase;padding:6.5px 22px;} #adbreakingnews li a {font-family:inherit;font-weight:400;color:#666;margin-top:10px;transition:all 0.5s ease-in-out;} #adbreakingnews li a:hover {color:#359bed;} #adbreakingnews {float:left;margin-left:75px;margin-top:6px;} #adbreakingnews ul,#adbreakingnews li{list-style:none;margin:0;padding:0} @media only screen and (max-width:640px){ #breakingnews {margin:20px 0 0 0;margin-right:0;} #breakingnews .breakhead {padding:6.5px 14px;} #adbreakingnews {margin-left:50px;}}
#Script
1. Cũng tại phần Chỉnh sửa HTML bạn tìm thẻ </body> (nếu không được thì bạn thử với thẻ </head>)
2. Dán code dưới vào trên thẻ mà bạn vừa tìm
4. Lưu mẫu lại
1. Bố cục > Thêm tiện ích > HTML/Javascript
2. Dán code dưới vào rồi lưu lại
2. Dán code dưới vào trên thẻ mà bạn vừa tìm
<script type='text/javascript'>
//<![CDATA[
// Breaking News
$(document).ready(function(){var e="http://khanh98.blogspot.com",t=20;$.ajax({url:""+e+"/feeds/posts/default?alt=json-in-script&max-results="+t,type:"get",dataType:"jsonp",success:function(e){function t(){$("#adbreakingnews li:first").slideUp(function(){$(this).appendTo($("#adbreakingnews ul")).slideDown()})}var n,r,s="",a=e.feed.entry;if(void 0!==a){s="<ul>";for(var l=0;l<a.length;l++){for(var o=0;o<a[l].link.length;o++)if("alternate"==a[l].link[o].rel){n=a[l].link[o].href;break}r=a[l].title.$t,s+='<li><a href="'+n+'" target="_blank">'+r+"</a></li>"}s+="</ul>",$("#adbreakingnews").html(s),setInterval(function(){t()},5e3)}else $("#adbreakingnews").html("<span>No result!</span>")},error:function(){$("#adbreakingnews").html("<strong>Error Loading Feed!</strong>")}})});
//]]>
</script>
3. Thay http://khanh98.blogspot.com thành URL đến blog của bạn4. Lưu mẫu lại
#HTML
Đối với phần HTML này thì chúng ta sẽ đặt nó nằm giữa hai thẻ <body> và </body>, nếu bạn không biết phải đặt ở đâu trong đó thì làm như sau:1. Bố cục > Thêm tiện ích > HTML/Javascript
2. Dán code dưới vào rồi lưu lại
<b:if cond='data:blog.pageType == "index"'>
<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span>
<div id='adbreakingnews'>Loading...</div></div>
</b:if>
3. Hãy truy cập vào blog để kiểm tra xem tiện ích đã hoạt động chưa.
Comments
Post a Comment
» Vui lòng không spam vì nó sẽ bị xóa ngay sau đó.
» Nếu chèn code hãy mã hóa trước khi chèn vào nhận xét.
» Nếu thủ thuật Blog không áp dụng được thì hãy để lại URL blog để mình tiện kiểm tra.