Skip to content Skip to sidebar Skip to footer

Cara Menambahkan Breaking News Feed di Blog

Cara Menambahkan Breaking News Feed di Blog
Cara Menambahkan Breaking News Feed di Blog 

Tampan Community™ - Halo sobat semua karena banyak yang bertanya ke saya bagaimana Cara Menambahkan Breaking News Feed di Blog, Pada kesempatan kali ini saya akan membuat post yang mana merupakan jawaban dari pertanyaan sobat blogger di blog Tampan Community™.

Silahkan sobat perhatikan Langkah-langkah Berikut dan cara penerapannya :

Pertama silahkan sobat buka Blogger => Template => Klik Edit HTML

Kemudian Tambahkan kode di bawah ini tepat sebelum ]]></b:skin> atau </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;}}
 Kemudian tambahkan kode di bawah ini sebelum tag penutup </body>
<script type='text/javascript'>//<![CDATA[// Breaking News$(document).ready(function(){var e="http://lunafy.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>
Ganti http://lunafy.blogspot.com dengan alamat blog sobat

Kemudian simpan kode di bawah ini di mana saja bebas, terapkan di dalam tag body (Diantara tag pembuka <body> dan tag penutup </body>)
<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span><div id='adbreakingnews'>Loading...</div></div>
Jika sobat hanya ingin menampilkan breaking news ini pada halaman utama saja, silakan sobat bungkus markup di atas dengan tag kondisional khusus halaman utama saja.
<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>
Langkah Terakhir simpan template sobat, Mudah bukan Cara Menambahkan Breaking News Feed di Blog, Semoga Artikel ini bermanfaat buat sobat semua. Terima Kasih
Travel Offline
Travel Offline Halo, Saya Andrian. Saya adalah pengelola dari Travel Offline, sebuah blog yang sekaligus media informasi dan hiburan melalui beberapa anak situsnya. Salam kenal, dan semoga betah di Travel Offline.

1 comment for "Cara Menambahkan Breaking News Feed di Blog "

  1. kayaknya bagus nih, saya coba dulu.. oh ya berat gak nih kalo nambah widget ini ?

    ReplyDelete