Friday, 10 August 2012

Modifikasi Kotak Berlangganan Feedburner



Akhirnya setelah saya mengalami kebosanan (Virus Bosan menghampiri) selama 1 minggu terakhir ini, semangat saya perlahan datang kembali. Itu terlihat dari perubahan template. Template yang dulu, saya buang dan saya ganti dengan yang lebih fresh.
Kembali lagi ke topik pembicaraan. Sebagian blogger menganggap feedburner wajib ada di dalam blog kita. Manfaat yang paling di rasakan adalah pengunjung lebih mudah dalam berlangganan artikel kita melalui email mereka. Sehingga setiap kita update postingan, pengunjung akan menerima artikel kita dalam bentuk pesan email.
Lalu, bagaimana caranya membuat tampilan kotak feedburner menjadi lebih menarik. Sehingga pengunjung bisa betah berlama-lama di blog anda? Caranya adalah denganmodifikasi tampilan kotak feedburner. Cara modifikasi feedburner berikut:

  • Login ke Blogger
  • Masuk ke bagian Rancangan
  • Pilih Elemen Halaman
  • Kemudian klik Tambah Gadget
  • Piih HTML/Javascript
  • Masukan kode di bawah ini, di dalam form yang di sediakan:

<style>
.form{border:1px solid #d8d8d8;background:#fff padding:3px;width:308px;height:200px;-moz-border-radius:6px}.rss{background:url("http://i56.tinypic.com/5y6kxi.png") no-repeat top right}.button{background:#9b9b9b;color:#FFF;font-size:11px;font-family:Arial,Tahoma,Verdana;margin-left:5px;border:1px solid #fff;padding:3px 5px 3px 5px;font-weight:bold;-moz-border-radius:5px}
</style>
<div class="form">
<div class="rss">
<div style="font-weight:bold; color:#333333; font-size:15px; padding:10px 5px 5px 10px;"><a href="http://feeds.feedburner.com/EducationDownload"><img src="http://lh6.ggpht.com/_15FopxVONSo/SSwFpjxP6BI/AAAAAAAAA3I/0GCim8O1rZ0/s144/rss%20feed%20icon.gif" /></a> <a href="http://feeds.feedburner.com/EducationDownload">GET UPDATE VIA RSS</a></div>
<div style="font-weight:bold; padding:10px 10px;">GET UPDATE VIA EMAIL</div>
<div style="padding-left:10px">Jika anda suka dengan artikel di blog ini. Silahkan berlangganan via RSS. Isi alamat email anda di bawah ini!!</div>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=EducationDownload', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><div style="padding-left:10px; padding-bottom:10px; padding-top:10px"><input type="text" style="width:160px; height:18px" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Ketik email anda disini...&quot;;}" onfocus="if (this.value == &quot;Ketik email anda disini...&quot;) {this.value = &quot;&quot;}" type="text" value="Ketik email anda disini..." /> <input type="hidden" value="EducationDownload" name="uri" /><input type="hidden" name="loc" value="en_US" /><input class="button" type="submit" value="SUBCRIBE" /></div></form>
<div style="padding-left:10px"><a href="http://feeds.feedburner.com/EducationDownload"><img src="http://feeds.feedburner.com/~fc/egablogs?bg=99CCFF&amp;fg=444444&amp;anim=1" width="88" height="26" style="border:0" alt="" /></a></div>
</div></div>

Keterangan:
Kode warna hijau : Biarkan atau ganti dengan gambar sesuka anda
Kode warna merah : Ganti dengan id feedburner anda
Kode warna oranye: Ganti dengan gambar feedcount anda
  • Setelah semua selesai anda edit, klik save dan lihat hasilnya


0 comments:

Post a Comment