Kenapa modifikasi headline ini dikatakan ala Beben Koben? Begini ceritanya, pagi ini sebenarnya agak sedikit suntuk karena tadi malam tidur terlalu larut, ditambah bingung cari topik postingan. Coba jalan-jalan...eh nyangkut di blognya kang Beben.

Nah terlahirlah sebuah ide, mencari hal yang menarik di blog kang Beben untuk dibuat topik. Mata terpana pada pandangan ke arah footer...kebiasaan kalau lihat cewek juga pasti lihat kakinya dulu hahahaha.... Di situ ada widget recently yang menampilkan headline news yang tampil satu per satu. Setelah dilihat ternyata itu adalah headline news dari feedburner (kalau enggak salah hehehe...).

Nah kang Beben tuh si empunya Tutorial Blog for Stylish Blogger, si Bolanglang yang katanya ganteng hehehe... Isi blognya tentang tutorial blog, jadi kalau Anda butuh tutorial blog, coba ubek-ubek blognya kang Beben hehehe....

Seperti apa sih Memodifikasi Headline News FeedBurner Ala Beben Koben ini? Bisa Anda lihat langsung di blognya kang Beben deh DI SINI. Coba lihat di bagian footer pada widget Recently.

Bagaimana Anda tertarik untuk mencobanya? Yo kita belajar sama-sama di bawah ini.

Sebenarnya widget ini bisa langsung diterapkan ke blog tanpa edit HTML, Anda hanya perlu meng-copy seluruh kode di bawah ini dan mempastenya pada gadget HTML/JavaScript.

<style type="text/css">
#bbn6 .feedburnerFeedBlock ul{margin:0;padding:0;list-style:none;position:relative;}
#bbn6 .feedburnerFeedBlock{height:195px;overflow:hidden;}
#bbn6 .feedburnerFeedBlock ul li{text-align:left;position:absolute;top:0;left:0;height:160px;margin:0;padding:10px;color:#666;font-weight:400;}
#bbn6 #creditfooter{display:none;}.headline a{font-size:20px;color:#000}
</style>
<div id="bbn6">
<script type="text/javascript">
var x=2;function slideWitchs(){x+=1;if(x>5){x=1}
$("#bbn6 .feedburnerFeedBlock ul li:nth-child(n)").animate({opacity:0});$("#bbn6 .feedburnerFeedBlock ul li:nth-child("+(x)+")").animate({opacity:1});}
$(document).ready(function(){setInterval("slideWitchs()",5500);});
</script>
<script src="http://feeds.feedburner.com/kompiajaib?format=sigpro" type="text/javascript" ></script>
</div>

Angka 5 untuk menampilkan berapa banyak recent post yang ditampikan.

Angka 5500 untuk mengatur kecepatan pergantian recent post.

http://feeds.feedburner.com/kompiajaib coba ganti dengan url feedburner Anda.

Untuk warna tulisan, tinggi widget, dan lain-lain silahkan atur pada kode CSS-nya. 

Namun ada baiknya untuk menghindari error yang terjadi ketika validasi HTML5, kode CSS dan kode pemangilnya dipisahkan. Seperti pada postingan saya sebelumnya tentang "Hindari Penggunaan Widget Tanpa Edit HTML" sebaiknya kode CSS-nya simpan pada edit HTML dan pemanggilnya disimpan di gadget HTML/Javascript pada tata letak atau layout.

Untuk kode di atas, kode CSS-nya yang harus disimpan di atas kode ]]></b:skin> adalah:

#bbn6 .feedburnerFeedBlock ul{margin:0;padding:0;list-style:none;position:relative;}
#bbn6 .feedburnerFeedBlock{height:195px;overflow:hidden;}
#bbn6 .feedburnerFeedBlock ul li{text-align:left;position:absolute;top:0;left:0;height:160px;margin:0;padding:10px;color:#666;font-weight:400;}
#bbn6 #creditfooter{display:none;}.headline a{font-size:20px;color:#000}

Dan pemanggilnya adalah:

<div id="bbn6">
<script type="text/javascript">
var x=2;function slideWitchs(){x+=1;if(x>5){x=1}
$("#bbn6 .feedburnerFeedBlock ul li:nth-child(n)").animate({opacity:0});$("#bbn6 .feedburnerFeedBlock ul li:nth-child("+(x)+")").animate({opacity:1});}
$(document).ready(function(){setInterval("slideWitchs()",5500);});
</script>
<script src="http://feeds.feedburner.com/kompiajaib?format=sigpro" type="text/javascript" ></script>
</div>

Demikian saja postingan Memodifikasi Headline News FeedBurner Ala Beben Koben ini semoga dapat dimengerti dan bermanfaat... Selamat berkreasi...

Buat kang Beben makasih yah udah ngizinin untuk nyomot kodenya hehehe... (diizinin ga yah...? Engak boleh enggak kang Beben harus ngizinin yah...hahaha...)

Memodifikasi Headline News FeedBurner Ala Beben Koben

Kenapa modifikasi headline ini dikatakan ala Beben Koben? Begini ceritanya, pagi ini sebenarnya agak sedikit suntuk karena tadi malam tidur terlalu larut, ditambah bingung cari topik postingan. Coba jalan-jalan...eh nyangkut di blognya kang Beben.

Nah terlahirlah sebuah ide, mencari hal yang menarik di blog kang Beben untuk dibuat topik. Mata terpana pada pandangan ke arah footer...kebiasaan kalau lihat cewek juga pasti lihat kakinya dulu hahahaha.... Di situ ada widget recently yang menampilkan headline news yang tampil satu per satu. Setelah dilihat ternyata itu adalah headline news dari feedburner (kalau enggak salah hehehe...).

Nah kang Beben tuh si empunya Tutorial Blog for Stylish Blogger, si Bolanglang yang katanya ganteng hehehe... Isi blognya tentang tutorial blog, jadi kalau Anda butuh tutorial blog, coba ubek-ubek blognya kang Beben hehehe....

Seperti apa sih Memodifikasi Headline News FeedBurner Ala Beben Koben ini? Bisa Anda lihat langsung di blognya kang Beben deh DI SINI. Coba lihat di bagian footer pada widget Recently.

Bagaimana Anda tertarik untuk mencobanya? Yo kita belajar sama-sama di bawah ini.

Sebenarnya widget ini bisa langsung diterapkan ke blog tanpa edit HTML, Anda hanya perlu meng-copy seluruh kode di bawah ini dan mempastenya pada gadget HTML/JavaScript.

<style type="text/css">
#bbn6 .feedburnerFeedBlock ul{margin:0;padding:0;list-style:none;position:relative;}
#bbn6 .feedburnerFeedBlock{height:195px;overflow:hidden;}
#bbn6 .feedburnerFeedBlock ul li{text-align:left;position:absolute;top:0;left:0;height:160px;margin:0;padding:10px;color:#666;font-weight:400;}
#bbn6 #creditfooter{display:none;}.headline a{font-size:20px;color:#000}
</style>
<div id="bbn6">
<script type="text/javascript">
var x=2;function slideWitchs(){x+=1;if(x>5){x=1}
$("#bbn6 .feedburnerFeedBlock ul li:nth-child(n)").animate({opacity:0});$("#bbn6 .feedburnerFeedBlock ul li:nth-child("+(x)+")").animate({opacity:1});}
$(document).ready(function(){setInterval("slideWitchs()",5500);});
</script>
<script src="http://feeds.feedburner.com/kompiajaib?format=sigpro" type="text/javascript" ></script>
</div>

Angka 5 untuk menampilkan berapa banyak recent post yang ditampikan.

Angka 5500 untuk mengatur kecepatan pergantian recent post.

http://feeds.feedburner.com/kompiajaib coba ganti dengan url feedburner Anda.

Untuk warna tulisan, tinggi widget, dan lain-lain silahkan atur pada kode CSS-nya. 

Namun ada baiknya untuk menghindari error yang terjadi ketika validasi HTML5, kode CSS dan kode pemangilnya dipisahkan. Seperti pada postingan saya sebelumnya tentang "Hindari Penggunaan Widget Tanpa Edit HTML" sebaiknya kode CSS-nya simpan pada edit HTML dan pemanggilnya disimpan di gadget HTML/Javascript pada tata letak atau layout.

Untuk kode di atas, kode CSS-nya yang harus disimpan di atas kode ]]></b:skin> adalah:

#bbn6 .feedburnerFeedBlock ul{margin:0;padding:0;list-style:none;position:relative;}
#bbn6 .feedburnerFeedBlock{height:195px;overflow:hidden;}
#bbn6 .feedburnerFeedBlock ul li{text-align:left;position:absolute;top:0;left:0;height:160px;margin:0;padding:10px;color:#666;font-weight:400;}
#bbn6 #creditfooter{display:none;}.headline a{font-size:20px;color:#000}

Dan pemanggilnya adalah:

<div id="bbn6">
<script type="text/javascript">
var x=2;function slideWitchs(){x+=1;if(x>5){x=1}
$("#bbn6 .feedburnerFeedBlock ul li:nth-child(n)").animate({opacity:0});$("#bbn6 .feedburnerFeedBlock ul li:nth-child("+(x)+")").animate({opacity:1});}
$(document).ready(function(){setInterval("slideWitchs()",5500);});
</script>
<script src="http://feeds.feedburner.com/kompiajaib?format=sigpro" type="text/javascript" ></script>
</div>

Demikian saja postingan Memodifikasi Headline News FeedBurner Ala Beben Koben ini semoga dapat dimengerti dan bermanfaat... Selamat berkreasi...

Buat kang Beben makasih yah udah ngizinin untuk nyomot kodenya hehehe... (diizinin ga yah...? Engak boleh enggak kang Beben harus ngizinin yah...hahaha...)