Buat feedburner widget

Ada yang bertanya bagaimana membuat widget feedburner seperti di blog utama penulis.Caranya tidaklah susah kerana sesiapa saje yang telah mendaftar di feedburner (sekarang google feedburner) boleh menampilkan widget feednya dengan hanya copy dan pastekan kod htmlnya diblog.Yang kelihatan seperti rajah disebelah adalah kerana penulis telah memodifikasi kod htmlnya.Jika nak mempelajarinya, sila ikuti tutorialnya dibawah.

Lakukan 3 perkara ini dulu :

1) Daftar feedburner

2) Dapatkan no id feedburner anda.Lihat cth dibawah

http://feeds.feedburner.com/~e?ffid=2454852

3) Dapatkan gambar icon feedburner diinternet atau layari sini, atau ini.Download icon tersebut dan upload ke tempat biasa yg selalu anda simpan gambar.Kemudian dapatkan Url gambar icon tersebut.Cara yg paling mudah, dapatkan diphotobucket.

http://i193.photobucket.com/albums/z242/Chuztamant/600px-Feed_Icon_Bl-Or.png

Jika anda sudah daftar,dapatkan ID feedburner serta alamat Feed Icon, langkah selanjutnya anda boleh terus ke tutorialnya dibawah ini:

1. Login ke blog anda, kemudian pilih Layout-->edit html.

2. kemudian copy kod dibawah ini dan pastekan diatas kod ]]></b:skin>

#kotak {
background: #fff;
width: 200px;
color: #000000;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
font-weight: normal;
margin: 10px 0px 0px 0px;
padding: 3px;
border-top: 1px solid #666666;
border-right: 1px solid #ddd;
border-left: 1px solid #666666;
border-bottom: 1px solid #ddd;
display: inline;
}
#tombol {
background: #2B74B4;
color: #FFFFFF;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
margin: 0px 0px 0px 5px;
padding: 2px;
border: 1px solid #234B69;
font-weight: bold;
}
#email{
background: #FFFFFF;
color: #000000;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
margin: 0px;
padding: 4px;
border-top: 1px solid #666666;
border-right: 1px solid #DDDDDD;
border-left: 1px solid #666666;
border-bottom: 1px solid #DDDDDD;
}
#submit {
background: #2B74B4;
color: #FFFFFF;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
padding: 4px;
margin: 0px;
border: 1px solid #234B69;
}

3. Save template anda.

4. Kemudian pergi semula ke menu Layout-->add a gadget.Klik tanda plus ( + ) untuk HTML/JavaScript.

5. Lalu copy kod dibawah ini dan pastekan di dalam ruangan HTML/JavaScript.

<div
style="background:url(http://dino.hpa.googlepages.com/Newspaper_Feed_128x128_thumb1.png) no-repeat top right;padding:0px 0px">

<p><a href="http://feeds2.feedburner.com/BlogInfoTips" rel="alternate" type="application/rss+xml"><img alt="" style="vertical-align:middle;border:0" src="http://www.feedburner.com/fb/images/pub/feed-icon16x16.png"/></a>&nbsp;<a href="http://feeds2.feedburner.com/BlogInfoTips" rel="alternate" type="application/rss+xml">15 orang telah berlanggan..anda bila lagi?</a></p>

<p><blink><bold>Dapatkan update terkini dari</bold></blink></p>

Blog Info Tips langsung ke Email anda!

<p><form id="subscribe" action="http://www.feedburner.com/fb/a/emailverify" target="popupwindow" method="post" onsubmit="window.open('http://www.feedburner.com', 'popupwindow', 'scrollbars=yes,width=500,height=520');return true"><input id="kotak" onfocus="if (this.value == 'Masukan alamat Email anda...') {this.value = '';}" value="Masukan alamat Email anda..." name="email" onblur="if (this.value == '') {this.value = 'Masukan alamat Email anda...';}" type="text"/><input value="http://feeds.feedburner.com/~e?ffid=2454852" name="url" type="hidden"/><input value="daftar kolom tutorial" name="title" type="hidden"/><input id="tombol" value="klik disini" type="submit"/></form></p>
</div >

6. Gantilah alamat gambar, ID feedburner serta kata-kata yang saya tulis dengan kepunyaan anda sendiri.Kemudian klik save/simpan.

7. Lihat blog anda.Menjadi...klu tak ikut tutorial dari awal semula.Selesai.