Cara pasang breaking news | info terkini di blog

H

allo mas broer,adik yang imut,oke dech semua saja yang demen/suka atau bahasa ingris nya Like ,memodifikasi blog , kang mahfid ada info nich buat pasang breaking news atau info terkini di blog untuk melihat contohnya silahkan sobat lihat contoh breaking news di atas ,nah untuk cara membuat nya ikuti tutorial nya sampai selesai yach .....

1. setelah loggin ke blogger sobat langsung masuk ke dasboard 
2. lalu Edit HTML jangan lupa download lengkap dulu template takutnya terjadi kesalahan 
3. selanjut nya cari ]]></:skin> lalu masukkan kode css di bawah ini tepat di atas kode ]]></:skin>
   berikut kode nya

   .newspic {background:#000 url(http://karinafotocollection-project.googlecode.com/files/briking.gif) no-repeat top left;width:970px;margin-top:25px;padding:0 auto;height:32px;color:#fff;}
   .news {width: 970px;margin:0 auto;padding:0 auto;line-height: 1.4em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;}
   .news a:link, .news a:visited{color:#fff;text-decoration:none;}
   .news a:hover {color:#ddd;text-decoration:underline;}

   Jika sobat ingin merubah ketinggian breaking news nya ganti kode teks warna merah dan untuk merubah lebar backround nya sobat bisa ganti teks warna biru
4. selanjutnya sobat taruh kode di bawah ii tepat di atas kode </head> berikut kodenya

   <script src='http://www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'></script>
   <script src='http://karinafotocollection-project.googlecode.com/files/breaking-news.js' type='text/javascript'/>
   <style type='text/css'>
   .titlefield{ /*CSS for RSS title link in general*/
   text-decoration: none;}
   .labelfield{ /*CSS for label field in general*/
   color:#aaa;font-size: 100%;}
   .datefield{ /*CSS for date field in general*/
   color:#aaa;font:normal 14px Arial;text-transform:none;}
   #example1{ /*Demo 1 main container*/
   width: 780px;
   height: 14px;
   border: 0px solid #aaa;
   padding: 0px;
   font:bold 16px Arial;
   text-transform:none;
   text-align:left;
   background-color:transparent;}
   code{ /*CSS for insructions*/
   color: #fff;}
   #example1 a:link, #example1 a:visited {color:#f2f2f2;text-decoration:none;}
   #example1 a:hover {color:#C8D3F2;text-decoration:none;}
   </style>

5. selanjutnya cari kode <div id='header-wrapper'> lalu taruh kode berikut tepat dibawah kode </div>untuk contoh peletakan kode seperti ini

   <div id='header-wrapper'>

   - - - - - - - - - - - - - - - - -
    - - - - - - - --  - - - - - - -
    - - - - - - - - - - - - - - - -
   </div>
   letakkan kodenya disini   berikut kode nya:
   

   <div class='newspic'>
   
   <div style='float:left;width:780px;padding:6px 0 6px 180px; 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://alamat blog.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(10, &quot;date&quot;) //Show 10 entries, sort by date
   cssfeed.entries_per_page(1)
   cssfeed.init()
   </script>
   </div>
   <div style='clear:both;'/>
   </div>

   Ganti teks warna merah di atas  dengan alamat blog sobat
6. Untuk yang terakhir Save template