Cara Membuat Kotak Berlangganan Subscribe di Blog

saya posting kali ini karena ada permintaan teman yang ingin membuat widget  subscribe di blognya. Naah.. widgetnya saya posting dech kali ini, yakni widget berlangganan artikel. Tapi tampilannya cukup cantik, gak monoton seperti widget berlangganan artikel bawaan blogger. Mau tau seperti apa widgetnya ? Seperti ini nih:

Cantik kan ? hehe..

Untuk caranya, silakan disimak cara memasang widget berlanggan artikel keren pada blog:

• Login ke Blogger

• Klik Tambahkan Gadget "Add a Gadget/Tambah Gadget"
   
• Pilih yang HTML/JavaScript

• Paste kode dibawah ini
  
  
  <style>    .knetwork-email{
      background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJMYBG7YIiY9TfMM5Cr9UzCAJmHJWzVZIdvl-RpR0QRDFjyTzE2ACIUNvbHu4aX0ac_J0EVDAv_rCQzgdqwGEQTUQrvS8uqMYa-gAqAam8xdomNuR_ik49xiZjYWEe_mkp6tya-MQflKjs/s1600/email.png) no-repeat 0px 12px ;
      width:300px;
      padding:10px 0 0 55px;
      float:left;
      font-size:1.4em;
      font-weight:bold;
      margin:0 0 10px 0;
      color:#686B6C;
      }
      .knetwork-emailsubmit{
      background:#9B9895;
      cursor:pointer;
      color:#fff;
      border:none;
      padding:3px;
      text-shadow:0 -1px 1px rgba(0,0,0,0.25);
      -moz-border-radius:6px;
      -webkit-border-radius:6px;
      border-radius:6px;
      font:12px sans-serif;
      }
      .knetwork-emailsubmit:hover{
      background:#E98313;
      }
      .textarea{
      padding:2px;
      margin:6px 2px 6px 2px;
      background:#f9f9f9;
      border:1px solid #ccc;
      resize:none;
      box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
      -moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
      -webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
      width:170px;
      color:#666;}
      </style>
      <div class="knetwork-email">
      Subscribe via Email
      <form action="http://feedburner.google.com/fb/a/mailverify?uri=Segala-Ada" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Segala-Ada', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
      <input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if (this.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here" type="text" />
      <input type="hidden" value="Segala Ada™" name="uri"/><input type="hidden" name="loc" value="en_US"/>
      <input class="knetwork-emailsubmit" value="Submit" type="submit" />
      </form>
      </div>

• Lalu Simpan, dan lihat hasilnya :)

KETERANGAN

1. Sekarang ganti http://feedburner.google.com/fb/a/mailverify?uri=Segala-Ada dengan Feedburner Feed kamu Link Email. kamu bisa mendapatkannya dengan mengunjungi account feedburner kemudian arahkan ke Publikasikan dan kemudian ke Email Subscriptions.
2. Ganti Segala Ada™ dengan judul feed kamu. Ini muncul di akhir link feed kamu. http://feedburner.google.com/fb/a/mailverify?uri=Segala-Ada

Selamat mencoba :)