Membuat Hot News Keren dibawah Header Blog

As Khairi - Dalam Modifikasi Blog kali ini, saya akan share tentang cara Membuat sebuah Hot News/Berita Terbaru yang mungkin sudah tak asing lagi bagi para blogger yang sudah berpengalaman. Ada bermacam model dalam membuat hot news. Salah satunya seperti Hot News Keren dibawah ini.

Hot News Keren dibawah Header Blog

Tertarik Untuk Mencoba?

Berikut Caranya Membuat Hot News Keren dibawah Header Blog :

1. Login ke akun Blogger
2. Pilih Template
3. Pilih Cadangkan/Pulihkan untuk backup template jika terjadi  error
4. Klik Edit HTML
5. Pilih Format Template
6. Copy Kode dibawah ini, lalu Pastekan di atas ]]></b:skin> (Gunakan Ctrl+F untuk memudahkan pencarian)

Kode:

.hotnews { background:#252525 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE_lEsqt_HsoCsGfDdjLBgwG9X5fhSkddl7BKqe1s3ApXfPxDedGZF1BV3PiJkAWVtKTJXWDsw1rUVd3p-LB9-2uVme_Dn1ipJKp0nWsWXO_xMNimy7iIcsxT5cV-QdIwogf3mtIPhgAw/s1600/hot+news.jpg) no-repeat top left;width:900px;margin:0 auto;padding:0 auto; height:24px;color:#fff; } .news { width: 900px;margin:0 auto;padding:0 auto;line-height: 1.2em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both; } .news a:link, .news a:visited{ color:#000000;text-decoration:none; } .news a:hover { color:#ddd;text-decoration:underline; }

     7. Ganti tulisan yang berwarna biru dengan link gambar sobat.
     8. Kemudian Copy Kode dibawah ini dan Pastekan diatas kode </header>

Kode:

<div class='hotnews'> <div style='float:left;width:900px;padding:1px 0 6px 130px; position:relative; overflow:hidden;'> <script type='text/javascript'> var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 4000, &quot;_new&quot;) cssfeed.addFeed(&quot;Creating Website&quot;, &quot;http://www.askhairi.blogspot.com/feeds/posts/default&quot;) //Specify &quot;label&quot; plus URL to RSS feed cssfeed.displayoptions(&quot;date&quot;) //show the specified additional fields cssfeed.setentrycontainer(&quot;div&quot;) //Wrap each entry with a DIV tag cssfeed.filterfeed(9, &quot;date&quot;) //Show 9 entries, sort by date cssfeed.entries_per_page(1) cssfeed.init() </script> </div> <div style='clear:both;'/> </div>

     9. Ganti tulisan yang berwarna merah dengan link blog/website sobat
   10. Klik Save dan lihat hasilnya.

Sekian Postingan tentang Membuat Hot News Keren dibawah Header Blog. Semoga bisa bermanfaat untuk sobat semua.