Pages

Memodifikasi Kotak Berlangganan Feedburner

03 October 2010

Kali ini 4-jie akan membahas tentang feedburner. Feedburner wajib dipasang buat setiap blogger yang ingin memajukan tingkat pengunjung/ visitor nya. Untuk kali ini, tema nya tentang Memodifikasi kotak berlangganan feedburner . Dimana kita akan upgrade tampilan awal kotak feedburner yang masih dibilang biasa menjadi yang lebih luar biasa smile

Untuk DEMO nya silahkan lihat gambar dibawah ini :

Lalu, bagaimana caranya membuat tampilan kotak feedburner menjadi lebih menarik. Sehingga pengunjung bisa betah berlama-lama di blog anda? Caranya adalah dengan modifikasi 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/fajrialhadi"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6ghv59hMsb8HcYkoI6LPn8ml2QJauj0-QytFlFs4rPTsG4eFKDxut9vSdBHRwSvb28_diJCAqPGTKK5L9yw6dW9XhwQnvXEDQ80qz7UtJge5MMf3IVEubHlhJrqAxbQyfDbEFggX6PDy9/s144/rss%20feed%20icon.gif" /></a> <a href="http://feeds.feedburner.com/fajrialhadi">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=fajrialhadi', '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="4-jie" 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/4-jie"><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
kalau kira-kira masih binggung silahkan sobat tinggalkan komentar nya disini ya question
Begitulah caranya, semoga bermanfaat ya... happy blogging with 4-jie

No comments:

Post a Comment

 

Populer