Cara Membuat Headline News di blog

adscblog

Headline News merupakan salah satu Feature yang menampilkan Artikel tertentu baik itu sesuai dengan hasil postingan atau menurut Label tertentu yang anda kaitkan terhadap Headline News tersebut,Headline News ini sangatlah banyak di gemari oleh blogger indonesia dan tidak sedikit mereka menerapkan Headline News ini di blog nya masing masing

Namun tidak sedikit juga mereka yang tidak menyukai Headline News ini dengan alasan terlalu mencolek dan juga kan memperlambat terhadap loading suatu blog,kecuali mereka mempunyai kode kode tertentu untuk membuat loading blog mereka menjadi maksimal itu tidak masalah jika breaking News ini di pasang di blog mereka

Namun disini saya akan berbagi tutorial cara pemasangan Headline News dan trik ini sudah saya coba dan Work 100% dengan begitu saya berani berbagi tutorial ini dengan blogger lain nya,walaupun di blog saya tidak memasang Headline News ini karena terlalu banyak pernak pernik nya dan takut berpengaruh terhadap Loading page,dari pada ilang mendingan di bagiin aja

Cara Pemasangan headline News/Breaking News di blog

Adapun cara pemasangan Headline News ini sangat lah mudah,anda hanya perlu mengikuti langkah-langkah pemasangan nya di bawah ini

• Masuk ke Blogger dengan Email dan Pasword anda
• Setelah itu silahkan anda Masuk ke Template yang berada di bagian kiri blogger
• Lalu kemudian silahkan klik Edit Html
• Setelah anda berada di bagian peng editan HTML silahkan cari kode </b:skin> atau juga </style> setelah itu silahkan letakan kode berikut sebelum kode tersebut

/* CSS Breaking News */
#breakingnews {width:40%;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;}}

Langkah selanjut nya silahkan anda cari lagi kode </body> kemudian silahkan letakan Javascript berikut sebelum kode tersebut

<script type='text/javascript'>
//<![CDATA[
// Breaking News
$(document).ready(function(){var e="http://youmasak.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(none)})}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>

Untuk langkah terakhir silahkan anda letakan kode berikut sesuai dengan keinginan anda untuk meletakan nya

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

Langkah selanjut nya silahkan anda Save Template dan lihat hasil nya di laman blog anda.
Nah itulah cara pembuatan Headline News atau Breaking news di blog,semoga artikel nya bisa membantu sobat blogger selamat mencoba dan salam blogger.

adscblog

Recommendation Apps

ads1

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by Dede Ubed, Published at 11 Juni and have 0 komentar