Cara Menbuat Widget Kotak Berlangganan FeedBurner di Blog

Tutorial kali saya akan membahas tentang Cara Membuat Widget Kotak Berlangganan FeedBurner tips ini sudah banyak sekali dibahas di blog-blog sahabat dan bukan merupakan suatu pembahasan yang asing lagi di dunia blogger, namun itu bagi mereka-mereka yang sudah sekian lama menggeluti dunia blogger. Sebenarnya apa fungsi membuat Widget tersebut. Singkat saja saya jelaskan, Widget ini memiliki fungsi sebagai sarana bagi pungunjung blog kita untuk berlangganan artikel-artikel terbaru di blog tersebut, jadi pengunjung akan selalu mendapatkan kiriman artikel terbaru dari blog tersebut melalui email yang di daftarkan. Kurang lebih begitulah mengenai fungsi dari Widget ini. Seakarang seperti apa tampilan Widgetnya, berikut saya tampilkan Screenshot-nya.

Untuk membuat Widget yang seperti gambar di atas, caranya:
1. Login ke blog kamu>masuk ke Tata letak
2. Tambah Gadget dan pilih HTML Java Script, masukkan kode dibawah ini.

<style>

.mbt-email{

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpu_oH8P4qoXPOGICngCT7EVjxgdMEfHEe_0W6C0Q9Gs6Ax2P9jAm4Jrt-FXqo4Rbclc-onLbRfIf90wIiSWxKAKSdkB_7dXwIGQVQOXt15XZagLYb2O1ozMS_ciDt3g86ue8N50pGvK4M/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;

}

.mbt-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;

}

.mbt-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="mbt-email">

Subscribe via Email

<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/faridelly', '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="blogspot/faridelly" name="uri"/><input type="hidden" name="loc" value="en_US"/>

<input class="mbt-emailsubmit" value="Submit" type="submit" />

</form>

</div>

3. Ganti tulisan yang berwarna merah di atas dengan alamt FeedBurner blog kamu
4. Klik simpan.

Untuk cara mengetahui URL FeedBurner blog kamu, kunjungi lama dibawah ini
Cara Mengetahui URL FeedBurner Blog

Source