Beberapa waktu lalu ada pengunjung blog ini yang menanyakan Bagaimana Cara Membuat Headline News di Blog nah demi memenuhi permintaan pengunjung *ciee* kali ini saya akan bagikan Wiget Headline News yang keren ini muehehehe.
OK sebelumnya saya ucapkan terimakasih kepada Mas Taufik Niurrochman
karena saya memakai breadcrumb melayangnya sebagai dasarnya dari
Headline News Melayang ini. Tak lupa kepada Mastemplate yang telah
menyediakan kode Headline News nya *maaf gak minta ijin :p*, dan
terimakasih juga kepada diri saya sendiri yang sukses puyeng dibuatnya
*maklum nubi dalam utak-atik css*. Terimakasih kesiapa lagi ya? Oia
Terimakasih kepada pembaca blog ini, kepada yang copas artikel ini
*maybe* dan memberikan sumber live linknya.
Lanjut ke pokok bahasan Membuat Headline News Blog, pertama login
Blogger > Dashboard > Template > Edit HTML > Expand Template
Widget > Tekan Ctrl + F pada keyboard kemudian ketikkan dan temukan
kode ini ]]></b:skin> letakkan css berikut tepat diatas kode tersebut
.headline-wrapper{position:fixed;background:#333 repeat-x bottom;width:98%;height:29px;border-bottom:3px solid #999;padding:1px 1% 1px 1%; z-index:9999;-webkit-box-shadow:0 0 7px #000;-moz-box-shadow:0 0 7px #000;box-shadow:0 0 7px #000; }.headline{width:930px;line-height:1.4em;text-align:left;font-family:Arial;font-size:12px;color:#fff;overflow:hidden;clear:both;margin:0 auto;padding:0 auto}.headline a:hover{color:#eace12;text-decoration:underline}
Sesuaikan dengan selera dan template anda bila warna, tinggi dan lebarnya kurang tepat.
Langkah berikutnya cari kode <body letakkan kode berikut tepat dibawahnya
<div class="headline-wrapper"><div class="headline"><div style="float: left; padding: 7px 5px 1px 7px;"><img alt="feed" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcraPZXcofWUK8qLB1oHVCO0TFObcd17wZr0rcK8MJFydePLOqVGAVaEBjdMNuBoQENOOUrWleoLfWj7_ekr9ng6ODQuXfNY4wwa5lDw5v_etOfTE_PBPdhcYjYN-BbivuiQKhDw2CBUGP/s47/rss_rectangle.png" /></div><div style="float: left; overflow: hidden; padding: 7px 0; position: relative; width: 800px;"><script type="text/javascript">var cssfeed=new gfeedrssticker("example1", "example1class", 3000, "_new")cssfeed.addFeed("HeadlineNews","http://anwar-lahai.blogspot.com/feeds/posts/default")cssfeed.addFeed("Headline News", "http://blif-indo.blogspot.com/feeds/posts/default")cssfeed.displayoptions("date")cssfeed.setentrycontainer("div")cssfeed.filterfeed(20, "date")cssfeed.entries_per_page(1)cssfeed.init()</script></div></div></div>
Ganti yang berwarna kuning dengan alamat blog Anda, terakhir tambahkan javascript ini diatas </head>
<script src='http://anwar-lahai.googlecode.com/files/headline.js' type='text/javascript'/>
Simpan template Anda. Jika berhasil maka akan menjadi seperti pada Blog Demo ini http://kopas-us.blogspot.com.
*NB : sebaiknya simpan kode js nya di hosting anda sendiri mosal yourjavascript.com
Demikian Cara Membuat Headline News Melayang di Blog semoga bermanfaat, bila ada pertanyaan silahkan tulis di komentar.
0 komentar:
Post a Comment