Cara Membuat Headline News

Cara Membuat Headline News | Cara pasang headline news di blog inilah yang akan kita bahas. setelah sobat mengatahui fungsi headline news di blog sekarang saya coba share cara pasangnya : 

1.  Masuk ke dashbor blog sobat,
2. Kemudian pilih Rancangan kemudian Edit HTML
   untuk tampilan blogger lama.
3. Untuk tampilan blogger baru silahkan pilih Template kemudian Edit HTML 
4. Setelah terbuka silahkan cari kode ]]></b:skin> dengan menggunakan Ctrl + F. 
5.  Pasang
   kode berikut tepat di atas kode ]]></b:skin>

 .headline-wrapper{background:url(https://lh3.googleusercontent.com/-leV22rchdzc/UAP58mLNrFI/AAAAAAAADb4/sRUlcvkSIsA/s38/headline-bg.png)
repeat-x;width:960px;height:30px;margin:0
auto;padding:0 auto}

.headline{width:960px;line-height:1.4em;text-align:left;font-family:Arial;font-size:12px;color:#4f4f4f;overflow:hidden;clear:both;margin:0
auto;padding:0 auto;text-shadow: 1px 1px 1px #000}

.headline a:hover{color:#eace12;text-decoration:none}

·  
Perhatikan link ini adalah background headline
news yang akan kita gunakan, anda bisa mengubahnya menurut selera anda : https://lh3.googleusercontent.com/-leV22rchdzc/UAP58mLNrFI/AAAAAAAADb4/sRUlcvkSIsA/s38/headline-bg.png

·  
Kemudian angka berikut 960px Menunjukkan
panjang headline news yang akan dipasang, anda bisa mengubahnya sesuai ukuran
blog sobat.

6.      Selanjutnya anda cari kode </head> dan anda pasang kode berikut di atas kode </head>

<script
src='https://www.google.com/jsapi?key=ABQIAAAAlQIoliUVPjZwD8UDgw_U3RTUhB4JyH-ajz-fA9t4yePPPdGAfRTC_mtuh6Iq1MLEipD0I2rCi30Png'
type='text/javascript'/>

<script src='http://kompiajaib.googlecode.com/files/newsticker2.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:#666;font-size: 100%;}

.datefield{ /*CSS for date field in general*/

color:#fff;font:normal 12px Arial;}

#example1{ /*Demo 1 main container*/

width: 900px;

height: 12px;

border: 0px solid #aaa;

padding: 0px;

font:bold 12px Arial;

text-transform:none;

text-align:left;

background-color:transparent;}

code{ /*CSS for insructions*/

color: #fff;}

#example1 a:link, #example1 a:visited {color:#60BAFA;text-decoration:none;}

#example1 a:hover {color:#fff;text-decoration:none;}

</style>

7.
Kemudian
cari kode <b:includable id='main'>
Pasang kode berikut dibawah kode <b:includable
id='main'>

<div class='headline-wrapper'>

<div class='headline'>

<div style='float:left;padding:5px 5px 5px 10px;font:bold 12px
Arial;color:#aeaeae;text-transform:none;'>

Latest Posts :

</div>

<div style='float:left;width:800px;padding:5px 0; position:relative;
overflow:hidden;'>

<script type='text/javascript'>

var cssfeed=new gfeedrssticker(&quot;example1&quot;,
&quot;example1class&quot;, 3000, &quot;_new&quot;)

cssfeed.addFeed(&quot;Latest Movies&quot;, &quot;http://dangstars.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><div style='clear:both;'/>

</div>

·  
Lihat tulisan Latest
Posts, Ganti sesuai keinginan sobat.

·  
Kemudian dangstars.blogspot.com
ganti dengan LINK blog sobat.

8.
Terakhir
simpan perubahan yang sobat setting

9.
Kemudian
silahkan buka blog anda dan lihat apakah posisi headline news sudah sesuai dengan keinginan sobat. Jika tidak sesuai silahkan tinggalkan komentar dibawah
ini.

Demikian tadi tutorial Cara Membuat Headline News di blog, semoga tutorial ini dapat bermanfaat. Sumber : Kompiajaib.blogspot.com