Modifikasi Form Email Subscribe FeedBurner

RSS Spiderman

Setelah sekian Lama tidak menulis artikel, Kali ini TutorBloggers akan berbagi ilmu yang Berkaitan Dengan RSS (Realy Simple Sindication) yang memungkinkan pengunjung berlangganan Artikel suatu website dengan E-mail. Banyak yang bingung, Bagaimana sih cara modifikasi Form Email Subscribe FeedBurner? Sebenarnya, sangat mudah untuk memodifikasi Form Email Subscribe FeedBurner. Kita hanya perlu keahlian mengetik dan memahami Syntax HTML. jika anda ingin Menambahkan gambar di Form Email Subscribe, Anda bisa mencarinya Disini. Anda Bisa juga mendownload icon lainya di IconArchive. Info ini saya dapatkan dari Blog T****OL. Berikut Ini tutorialnya.

1. Anda Harus mempunyai Account FeedBurner Terlebih dahulu. Lalu login ke akun anda. Daftarkan blog anda di FeedBurner Atau baca Tutornya Disini. Menujulah ke bagian Publicize > Email Subscription.

Klik untuk memperbesar

2. Copy kode yang ada di sana ke Notepad atau Text Editor yang lain untuk sementara waktu dan Perhatikan kode yang diberikan :

<form style="border:1px solid #ccc;padding:3px;text-align:center;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TutorBloggers', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Enter your email address:</p><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="TutorBloggers" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe" />Pindahin Dimari<p>Delivered by <a href="http://feedburner.google.com" target="_blank">FeedBurner</a></p></form>

Perhatikan Langkah-langkah berikut ini!

• Hapus kode yg diberi warna Merah (Untuk mengilangkan garis batas)
• Cut "</p>" lalu paste untuk menggantikan "Pindahin Dimari" (Ini untuk mensejajarkan antara kotak untuk memasukkan email dengan tombol "Subscribe")
• Yang "TutorBloggers" adalah nama dari feedburner kita (Berbeda-beda pastinya..itu otomatis pas kita mengenerate kode buat "email subcription")
• Yang "Enter your email address:" bisa diganti dengan tulisan apapun. Jangan lupa untuk menambahkan tag <p> bila anda ingin berganti baris antar tulisan ya?
• Untuk memasukkan gambar pada form rss feed, kita harus menambahkan kode div-style seperti ini :
<div style="background:url(URL IMAGE ANDA) no-repeat top right;padding:10px 0px">  
• Dan jika anda memasukan gambar, jangan lupa juga untuk menambahkan tag penutup </div> di bagian yang paling akhir Code kita nantinya
• Yang "Subscribe" adalah Tulisan pada tombol untuk Berlangganan Artikel. Bisa diganti dengan 'Berlangganan Sekarang!' atau yang lainya.

Kode yang digunakan TutorBloggers :

<div style="background:url(http://icons.iconarchive.com/icons/celldrifter/muku-style/128/Folder-RSS-icon.png) no-repeat top right;padding:10px 0px">
<form style="action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tutorbloggers', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p><blink>Ingin Berlangganan Artikel? Masukan E-mail kamu dan Klik 'Subscribe Now!'</blink><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="TutorBloggers" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe Now!" /></p></form>
</div>

Yang diberi cetak tebal adalah kode penting yang biasanya tidak dimengerti oleh user.
Alhasil, inilah hasil Modifikasi Form FeedBurner saya :

Form FeedBurner Hasil Modifikasi.

Buat gampangnya tinggal ganti yg "TutorBloggers" dengan feed kawan dan juga memasukkan url icon yg kawan punya. Di IconArchive Juga ada.
 
Tambahan :
Untuk menambahkan kotak kecil yg tulisannya adalah jumlah pelanggan feed kita masuk ke Feedburner >> publicize >> feedcount >> 
Udah dapet semua kodenya? "Page Element" > "Add Gadget" > " HTML/javascript "

Alhasil, ini gabungan dari FeedCount dan E-mail Subscription :

<div style="background:url(http://icons.iconarchive.com/icons/celldrifter/muku-style/128/Folder-RSS-icon.png) no-repeat top right;padding:10px 0px">
<form style="action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tutorbloggers', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p><blink>Ingin Berlangganan Artikel? Masukan E-mail kamu dan Klik 'Subscribe Now!'</blink><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="TutorBloggers" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe Now!" /></p></form>
</div>
<p><a href="http://feeds.feedburner.com/TutorBloggers"><img src="http://feeds.feedburner.com/~fc/TutorBloggers?bg=003366&amp;fg=6666CC&amp;anim=1&amp;label=listeners" height="26" width="88" style="border:0" alt="" /></a></p>

Gila bener, nulis dari jam 12 ampe jam 3.... =))