Home » » Hướng dẫn tạo Breaking News cho Blogspot

Hướng dẫn tạo Breaking News cho Blogspot

Làm thế nào để Thêm Breaking News (Tạo tin tức mới) cho Blogspot. Ở bài viết này mình hướng dẫn cho các bạn tạo mục tin tức mới , tin hot nằm đầu tiên trên các bài đăng. Việc tạo khá đơn giản.


Các bước thực hiện như sau: Lưu ý tùy thuộc vào Template blospot  của các bạn để thực hiện nhé!

Đầu tiên vào Blog của bạn Bloger-->Mẫu-->>Chỉnh sửa HTML



Nhấn Ctrl + F tìm kiếm ]]></b:skin> hoặc </style>


/* 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;}}


Sau đó, thêm mã dưới đây vào thẻ đóng </body>

<script type='text/javascript'>


//<![CDATA[


// Breaking News


$(document).ready(function(){var e="https://seowebaz.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>


Thay thế link https://seowebaz.blogspot.com bằng địa chỉ của bạn, sau đó lưu vào mã dưới ở mục nào bạn thích, thường thì đầu tiên header. Áp dụng trong các thẻ body nhé các bạn ( Nằm giữa 2 thẻ này <body> và thẻ đóng </body> ).


<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span>


<div id='adbreakingnews'>Loading...</div></div>


Nếu bạn muốn hiển thị các tin tức trên trang chính, xin các bạn đánh dấu trong các thẻ nằm code dưới đây


<b:if cond='data:blog.pageType == &quot;index&quot;'>


<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span>


<div id='adbreakingnews'>Loading...</div></div>


</b:if>



Sau đó lưu mẫu! 

Chúc các bạn thành công!

0 nhận xét:

Post a Comment